Question

我想制作一款简单的桌面游戏，其上有5 x 5方形瓷砖。显然我希望它有一个动态界面，其中tile的width和height属性是根据用户的手机分辨率设置的。就此而言，在我的XAML代码中我使用*东西将我的页面宽度划分为5列（相对大小），并且在每列中我都有一个堆栈面板，我添加了5个按钮。像这样：

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="1*"/>
        </Grid.ColumnDefinitions>
        <StackPanel x:Name="ButtonsCol0" Grid.Column="0">
            <Button Background="AliceBlue"
               MinWidth="{Binding ActualHeight, RelativeSource={RelativeSource Self}}" 
               MinHeight="{Binding ActualWidth, RelativeSource={RelativeSource Self}}">
            </Button>
            <Button 
               MinWidth="{Binding ActualHeight, RelativeSource={RelativeSource Self}}" 
               MinHeight="{Binding ActualWidth, RelativeSource={RelativeSource Self}}">
            </Button>
            <Button 
               MinWidth="{Binding ActualHeight, RelativeSource={RelativeSource Self}}" 
               MinHeight="{Binding ActualWidth, RelativeSource={RelativeSource Self}}">
            </Button>
            <Button 
               MinWidth="{Binding ActualHeight, RelativeSource={RelativeSource Self}}" 
               MinHeight="{Binding ActualWidth, RelativeSource={RelativeSource Self}}">
            </Button>
            <Button 
               MinWidth="{Binding ActualHeight, RelativeSource={RelativeSource Self}}" 
               MinHeight="{Binding ActualWidth, RelativeSource={RelativeSource Self}}">
            </Button>
        </StackPanel>

（对于每列，我还有4个StackPanel以上）

现在的问题是，我希望瓷砖具有正方形形状（相同的高度和宽度），我发现this question这就是我添加的原因：

    MinWidth="{Binding ActualHeight, RelativeSource={RelativeSource Self}}" 
    MinHeight="{Binding ActualWidth, RelativeSource={RelativeSource Self}}">

到我的按钮，这似乎有效，但是当我运行代码时，结果是这样的：

enter image description here

请帮助......：）

Answer 1

你可以做一些不同的事情，比如这个（只是一个想法）：

制作一个包含按钮的网格。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <!-- If you add the buttons in the Grid's cells, -->
    <!-- they should expand to the available width and height -->

    <Button Grid.Row="0" Grid.Column="0"
        MinWidth="{Binding ActualHeight, RelativeSource={RelativeSource Self}}" 
        MinHeight="{Binding ActualWidth, RelativeSource={RelativeSource Self}}"/>
    <Button Grid.Row="0" Grid.Column="1"
        MinWidth="{Binding ActualHeight, RelativeSource={RelativeSource Self}}" 
        MinHeight="{Binding ActualWidth, RelativeSource={RelativeSource Self}}"/>

     .... 23 more buttons
</Grid>

另外，（我从未使用过这个），看看这些（反向）绑定：

MinWidth="{Binding ActualHeight, RelativeSource={RelativeSource Self}}" 
MinHeight="{Binding ActualWidth, RelativeSource={RelativeSource Self}}"

这意味着MinWidth和MinHeight仍然不匹配 - 尝试使用相同的值：将初始值ActualWidth存储到属性，然后将该属性绑定到MinWidth和MinHeight：

MinWidth="{Binding FixedSize, RelativeSource={RelativeSource Self}}" 
MinHeight="{Binding FixedSize, RelativeSource={RelativeSource Self}}"

其中FixedSize是包含初始ActualWidth

的属性

这应该没问题但是一旦改变了方向，我认为这一切都会搞砸。这取决于您是否希望您的应用具有锁定方向，或者应该适应。如果它应该适应，绑定也应该改变。

但我觉得它仍然很麻烦...你最好有一个矩阵（2D按钮阵列）并将它们添加到View中 - 因此通过这种方式你可以通过简单地从它们访问它们来更轻松地管理它们数组而不是像ButtonCol0Row0，ButtonCol0Row1等那样访问它们。

Answer 2

绝对使用网格。这将为您提供一个填充父容器的统一网格。您可以根据需要在按钮或网格上设置边距。 请注意，控件的默认HorizontalAlignment和VerticalAlignment为“Stretch”，因此您无需在按钮上设置任何尺寸！

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <Button Grid.Row="0" Grid.Column="0" />
    <Button Grid.Row="0" Grid.Column="1" />
    ... etc
</Grid>

如果你想抓住按钮，就像另一张海报所说的那样，你可以将它们添加到数组而不是在XAML中定义它们 - 或者你可以循环遍历网格子节点，因为它们将按照指定的顺序声明（确保从左/右/上/下以正确的顺序指定它们，并且可以将在XAML中创建的按钮添加到数组中。你的电话（我不喜欢在代码中创建控件 - 我认为你应该尽可能在XAML中声明）

定义方形按钮，windows phone 8

2 个答案: