Question

我是WPF的新手。我正在创建一个允许我控制MIDI设备的应用程序。为此，我创建了一个键盘用户控件。我认为它看起来很棒，但我无法弄清楚如何设计它以便在绘制到窗口时缩放。任何人都可以帮助修改下面的xaml吗？

<Grid>
    <StackPanel Orientation="Horizontal">
        <Grid>
            <Polygon Name="A0" Tag="21" Points="0,130 0,200 36,200 36,130 31,130 31,0 0,0 0,130" Stroke="Black" StrokeThickness="1" HorizontalAlignment="Left" Margin="0,0,0,0" />
            <Polygon Name="Asharp0" Tag="22" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="31,0,0,0" />
            <Polygon Name="B0" Tag="23" Points="0,130 0,200 36,200 36,0 15,0 15,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="36,0,0,0" />
        </Grid>
        <Grid>
            <Polygon Name="C1" Tag="24" Points="0,0 0,200 36,200 36,130 22,130 22,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="0,0,0,0" />
            <Polygon Name="Csharp1" Tag="25" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="22,0,0,0" />
            <Polygon Name="D1" Tag="26" Points="0,130 0,200 36,200 36,130 29,130 29,0 7,0 7,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="36,0,0,0" />
            <Polygon Name="Dsharp1" Tag="27" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="65,0,0,0" />
            <Polygon Name="E1" Tag="28" Points="0,130 0,200 36,200 36,0 14,0 14,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="72,0,0,0" />
            <Polygon Name="F1" Tag="29" Points="0,0 0,200 36,200 36,130 21,130 21,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="108,0,0,0" />
            <Polygon Name="Fsharp1" Tag="30" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="129,0,0,0" />
            <Polygon Name="G1" Tag="31" Points="0,130 0,200 36,200 36,130 26,130 26,0 5,0 5,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="144,0,0,0" />
            <Polygon Name="Gsharp1" Tag="32" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="170,0,0,0" />
            <Polygon Name="A1" Tag="33" Points="0,130 0,200 36,200 36,130 31,130 31,0 10,0 10,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="180,0,0,0" />
            <Polygon Name="Asharp1" Tag="34" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="211,0,0,0" />
            <Polygon Name="B1" Tag="35" Points="0,130 0,200 36,200 36,0 15,0 15,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="216,0,0,0" />
        </Grid>
        <Grid>
            <Polygon Name="C2" Points="0,0 0,200 36,200 36,130 22,130 22,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="0,0,0,0" />
            <Polygon Name="Csharp2" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="22,0,0,0" />
            <Polygon Name="D2" Points="0,130 0,200 36,200 36,130 29,130 29,0 7,0 7,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="36,0,0,0" />
            <Polygon Name="Dsharp2" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="65,0,0,0" />
            <Polygon Name="E2" Points="0,130 0,200 36,200 36,0 14,0 14,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="72,0,0,0" />
            <Polygon Name="F2" Points="0,0 0,200 36,200 36,130 21,130 21,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="108,0,0,0" />
            <Polygon Name="Fsharp2" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="129,0,0,0" />
            <Polygon Name="G2" Points="0,130 0,200 36,200 36,130 26,130 26,0 5,0 5,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="144,0,0,0" />
            <Polygon Name="Gsharp2" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="170,0,0,0" />
            <Polygon Name="A2" Points="0,130 0,200 36,200 36,130 31,130 31,0 10,0 10,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="180,0,0,0" />
            <Polygon Name="Asharp2" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="211,0,0,0" />
            <Polygon Name="B2" Points="0,130 0,200 36,200 36,0 15,0 15,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="216,0,0,0" />
        </Grid>
        <Grid>
            <Polygon Name="C3" Points="0,0 0,200 36,200 36,130 22,130 22,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="0,0,0,0" />
            <Polygon Name="Csharp3" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="22,0,0,0" />
            <Polygon Name="D3" Points="0,130 0,200 36,200 36,130 29,130 29,0 7,0 7,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="36,0,0,0" />
            <Polygon Name="Dsharp3" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="65,0,0,0" />
            <Polygon Name="E3" Points="0,130 0,200 36,200 36,0 14,0 14,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="72,0,0,0" />
            <Polygon Name="F3" Points="0,0 0,200 36,200 36,130 21,130 21,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="108,0,0,0" />
            <Polygon Name="Fsharp3" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="129,0,0,0" />
            <Polygon Name="G3" Points="0,130 0,200 36,200 36,130 26,130 26,0 5,0 5,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="144,0,0,0" />
            <Polygon Name="Gsharp3" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="170,0,0,0" />
            <Polygon Name="A3" Points="0,130 0,200 36,200 36,130 31,130 31,0 10,0 10,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="180,0,0,0" />
            <Polygon Name="Asharp3" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="211,0,0,0" />
            <Polygon Name="B3" Points="0,130 0,200 36,200 36,0 15,0 15,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="216,0,0,0" />
        </Grid>
        <Grid>
            <Polygon Name="C4" Points="0,0 0,200 36,200 36,130 22,130 22,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="0,0,0,0" />
            <Polygon Name="Csharp4" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="22,0,0,0" />
            <Polygon Name="D4" Points="0,130 0,200 36,200 36,130 29,130 29,0 7,0 7,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="36,0,0,0" />
            <Polygon Name="Dsharp4" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="65,0,0,0" />
            <Polygon Name="E4" Points="0,130 0,200 36,200 36,0 14,0 14,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="72,0,0,0" />
            <Polygon Name="F4" Points="0,0 0,200 36,200 36,130 21,130 21,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="108,0,0,0" />
            <Polygon Name="Fsharp4" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="129,0,0,0" />
            <Polygon Name="G4" Points="0,130 0,200 36,200 36,130 26,130 26,0 5,0 5,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="144,0,0,0" />
            <Polygon Name="Gsharp4" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="170,0,0,0" />
            <Polygon Name="A4" Points="0,130 0,200 36,200 36,130 31,130 31,0 10,0 10,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="180,0,0,0" />
            <Polygon Name="Asharp4" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="211,0,0,0" />
            <Polygon Name="B4" Points="0,130 0,200 36,200 36,0 15,0 15,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="216,0,0,0" />
        </Grid>
        <Grid>
            <Polygon Name="C5" Points="0,0 0,200 36,200 36,130 22,130 22,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="0,0,0,0" />
            <Polygon Name="Csharp5" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="22,0,0,0" />
            <Polygon Name="D5" Points="0,130 0,200 36,200 36,130 29,130 29,0 7,0 7,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="36,0,0,0" />
            <Polygon Name="Dsharp5" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="65,0,0,0" />
            <Polygon Name="E5" Points="0,130 0,200 36,200 36,0 14,0 14,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="72,0,0,0" />
            <Polygon Name="F5" Points="0,0 0,200 36,200 36,130 21,130 21,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="108,0,0,0" />
            <Polygon Name="Fsharp5" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="129,0,0,0" />
            <Polygon Name="G5" Points="0,130 0,200 36,200 36,130 26,130 26,0 5,0 5,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="144,0,0,0" />
            <Polygon Name="Gsharp5" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="170,0,0,0" />
            <Polygon Name="A5" Points="0,130 0,200 36,200 36,130 31,130 31,0 10,0 10,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="180,0,0,0" />
            <Polygon Name="Asharp5" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="211,0,0,0" />
            <Polygon Name="B5" Points="0,130 0,200 36,200 36,0 15,0 15,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="216,0,0,0" />
        </Grid>
        <Grid>
            <Polygon Name="C6" Points="0,0 0,200 36,200 36,130 22,130 22,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="0,0,0,0" />
            <Polygon Name="Csharp6" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="22,0,0,0" />
            <Polygon Name="D6" Points="0,130 0,200 36,200 36,130 29,130 29,0 7,0 7,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="36,0,0,0" />
            <Polygon Name="Dsharp6" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="65,0,0,0" />
            <Polygon Name="E6" Points="0,130 0,200 36,200 36,0 14,0 14,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="72,0,0,0" />
            <Polygon Name="F6" Points="0,0 0,200 36,200 36,130 21,130 21,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="108,0,0,0" />
            <Polygon Name="Fsharp6" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="129,0,0,0" />
            <Polygon Name="G6" Points="0,130 0,200 36,200 36,130 26,130 26,0 5,0 5,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="144,0,0,0" />
            <Polygon Name="Gsharp6" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="170,0,0,0" />
            <Polygon Name="A6" Points="0,130 0,200 36,200 36,130 31,130 31,0 10,0 10,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="180,0,0,0" />
            <Polygon Name="Asharp6" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="211,0,0,0" />
            <Polygon Name="B6" Points="0,130 0,200 36,200 36,0 15,0 15,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="216,0,0,0" />
        </Grid>
        <Grid>
            <Polygon Name="C7" Points="0,0 0,200 36,200 36,130 22,130 22,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="0,0,0,0" />
            <Polygon Name="Csharp7" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="22,0,0,0" />
            <Polygon Name="D7" Points="0,130 0,200 36,200 36,130 29,130 29,0 7,0 7,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="36,0,0,0" />
            <Polygon Name="Dsharp7" Points="0,0 0,130 21,130 21,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="65,0,0,0" />
            <Polygon Name="E7" Points="0,130 0,200 36,200 36,0 14,0 14,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="72,0,0,0" />
            <Polygon Name="F7" Points="0,0 0,200 36,200 36,130 21,130 21,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="108,0,0,0" />
            <Polygon Name="Fsharp7" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="129,0,0,0" />
            <Polygon Name="G7" Points="0,130 0,200 36,200 36,130 26,130 26,0 5,0 5,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="144,0,0,0" />
            <Polygon Name="Gsharp7" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="170,0,0,0" />
            <Polygon Name="A7" Points="0,130 0,200 36,200 36,130 31,130 31,0 10,0 10,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="180,0,0,0" />
            <Polygon Name="Asharp7" Points="0,0 0,130 20,130 20,0" Stroke="Black" Fill="Black" StrokeThickness="1" Width="21" Height="130" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="211,0,0,0" />
            <Polygon Name="B7" Points="0,130 0,200 36,200 36,0 15,0 15,130" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="216,0,0,0" />
        </Grid>
        <Grid>
            <Polygon Name="C8" Points="0,0 0,200 36,200 36,0" Stroke="Black" StrokeThickness="1" Width="36" HorizontalAlignment="Left" Margin="0,0,0,0" />
        </Grid>
    </StackPanel>
</Grid>

我使用了一系列堆叠的面板网格，因为我懒得留下边距。如果需要，我不介意重组。只需轻松创建一个八度音阶并剪切+粘贴。

Answer 1

您可以使用ViewBox作为父容器。它将缩放StackPanel中的内容以适合窗口的大小。

创建可伸缩WPF用户控件的提示

1 个答案: