Question

我正在使用XAML，我需要完成以下任务：

我有一系列按钮，当分辨率发生变化时，我需要适应特定的列。使用DockPanel元素，但是有什么成就是列按钮适合。我需要的是相反的按钮大小适合列。有什么建议吗？

这是代码

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="25*"/>
            <ColumnDefinition Width="50*"/>
            <ColumnDefinition Width="25*"/>
        </Grid.ColumnDefinitions>
        <Border Grid.Column="0"/>
        <Border Grid.Column="2"/>
        <Border Grid.Column="1" >
        <Grid Name ="grillaEditor">
            <Grid.RowDefinitions>
                <RowDefinition Height="12*"/>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <Border Grid.Row="0"/>
            <Border Grid.Row="1">
                <StackPanel Orientation="Horizontal">
                    <StackPanel  Orientation="Horizontal" >
                        <Button Width="30" Height="30" BorderBrush="{x:Null}"   >
                            <StackPanel>
                                    <Image Source="Resources/Images/Icons/undo-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30" BorderBrush="{x:Null}" >
                            <StackPanel>
                                    <Image Source="Resources/Images/Icons/redo-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30" BorderBrush="{x:Null}">
                            <StackPanel>
                                <Image Source="Resources/Images/Icons/paste-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30" BorderBrush="{x:Null}" >
                            <StackPanel>
                                    <Image Source="Resources/Images/Icons/cut-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30" BorderBrush="{x:Null}" >
                            <StackPanel>
                                <Image Source="Resources/Images/Icons/copy-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30" BorderBrush="{x:Null}">
                            <StackPanel>
                                <Image Source="Resources/Images/Icons/trash-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30"  >
                            <StackPanel>
                                <Image Source="Resources/Images/Icons/left_circular-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30"  >
                            <StackPanel>
                                    <Image Source="Resources/Images/Icons/right_circular-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30"" >
                            <StackPanel>
                                <Image Source="Resources/Images/Icons/up_circular-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30" >
                            <StackPanel>
                                    <Image Source="Resources/Images/Icons/down_circular-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30" >
                            <StackPanel>
                                <Image Source="Resources/Images/Icons/restart-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30" >
                            <StackPanel>
                                    <Image Source="Resources/Images/Icons/select_all-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30" BorderBrush="{x:Null}" >
                            <StackPanel>
                                    <Image Source="Resources/Images/Icons/zoom_out-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30" BorderBrush="{x:Null}" >
                            <StackPanel>
                                    <Image Source="Resources/Images/Icons/zoom_in-26.png" ></Image>
                            </StackPanel>
                        </Button>
                        <Button Width="30" Height="30" BorderBrush="{x:Null}" >
                            <StackPanel>
                                    <Image Source="Resources/Images/Icons/resize_four_directions-26.png" ></Image>
                            </StackPanel>
                        </Button>
                    </StackPanel>
                </StackPanel>
                </Border>
            </Grid>
        </Border>

Answer 1

您正在设置按钮的Width和Height，因此他们将始终尝试使用该尺寸。在列的StackPanel上设置宽度和高度，然后在设置HorizontalAlignment = Stretch的按钮上设置它们以使它们适合其父容器的宽度，或VerticalAlignment = Stretch使它们适合它的高度。

适合列Xaml的内容

1 个答案: