时间戳

首页 > 解决方案 > 通过代码和非统一位置在图像顶部生成标签

c# - 通过代码和非统一位置在图像顶部生成标签

问题描述

我是 WPF 的新手。我正在尝试重写我以前使用 winforms 所做的应用程序。它本质上是一种乐器（弹拨弦）的图像，显​​示每个音符位置的标签和演奏它的能力。

我的问题是：我制作了一个网格，并在第一行插入了一个资源图像，跨越 3 个列。现在我需要在这张图片上放置多个标签，每个标签对应一个特定的音符。我如何在图像上放置标签..请看这两张图片

这是我当前的 WPF 布局

这是我当前的 WPF 布局

这就是我在winforms中的做法

这就是我在winforms中的做法

是否可以通过代码生成多个标签，就像第二张图片一样？

请注意，这些标签将在播放歌曲时显示。每个标签将对应一个特定的音符

标签： c#wpfimagexamllabel

解决方案

您将需要结合您选择的画布和布局控件。在这个例子中，我使用了停靠面板。

<DockPanel LastChildFill="True">
        <StackPanel DockPanel.Dock="Bottom" Height="80" Orientation="Horizontal" HorizontalAlignment="Right">
            <Button Margin="5">Click me</Button>
            <Button Margin="5">Click me</Button>
            <Button Margin="5">Click me</Button>
        </StackPanel>
        <Canvas x:Name="FretLayoutCanvas">
            <Button Canvas.Left="5" Canvas.Top="15" >Fret 1</Button>
            <Button Canvas.Left="55" Canvas.Top="55" >Fret 2</Button>
        </Canvas>
</DockPanel>

这看起来像这样：

样本布局

在后面的代码中，将您的控件添加到 FretLayoutCanvas 并为每个控件计算适当的 Left 和 Top。

推荐阅读