Windows 8.1 xaml 拉伸不收缩按钮

Question

我有一个包含多行和多列的网格（如下所示），每个单元格中都有一个按钮，很像计算器。这些按钮的 Horizo​​ntalAlignment 和 VerticalAlignment 设置为“Stretch”

但是，由于屏幕尺寸不同，并且我需要保持单元格和其中控件的宽度和高度大小相同，我将宽度和高度指定为 *

我希望按钮因此填充它们所在的单元格，但它们不适合。您可以看到这是开发环境的屏幕截图。第一个按钮显示按钮边框的位置... 它们实际上从侧面突出，并且在顶部和底部有大约 8 个像素的边距。

每个按钮中的文本都是一个数字，所以我知道文本的大小不是问题，想知道是否有人有任何想法？我不想为每个按钮手动设置边距，因为这不仅耗时，而且如果应用程序在不同尺寸的屏幕上运行，它们可能适合。

        <Grid Grid.Row="2" x:Name="ButtonsGrid" Margin="18,9,18,0">
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="*" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <Button Grid.Row="0" Grid.Column="0" Content="1"
                HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
        <Button Grid.Row="0" Grid.Column="1" Content="2" 
                HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
        <Button Grid.Row="0" Grid.Column="2" Content="3" 
                HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
        <Button Grid.Row="0" Grid.Column="3" Content="4" 
                HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />

        <Button Grid.Row="1" Grid.Column="0" Content="5" 
                HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
        <Button Grid.Row="1" Grid.Column="1" Content="6" 
                HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
        <Button Grid.Row="1" Grid.Column="2" Content="7" 
                HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
        <Button Grid.Row="1" Grid.Column="3" Content="8" 
                HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />

        <Button Grid.Row="2" Grid.Column="0" Content="9" 
                HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
        <Button Grid.Row="2" Grid.Column="1" Content="0" 
                HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
        <Button Grid.Row="2" Grid.Column="2" Content="Clear" 
                HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.ColumnSpan="2" />
    </Grid>

Answer 1

按钮有一定的边距和内边距，这就是为什么它只能缩小到一定的尺寸。

您的单元格尺寸小于此值，您可以通过编辑按钮的ControlTemplate 来解决此问题。

Answer 2

我以前从未做过 Windows Phone 应用程序。但是我在 Wpf 中做了这个示例。希望对您的业务有所帮助

代码如下：

 <Grid Grid.Row="2" x:Name="ButtonsGrid">
    <Grid.Resources>
        <Style TargetType="{x:Type Button}">
            <Setter Property="Margin" Value="2"/>
            <Style.Triggers>
                <Trigger Property="Tag" Value="btn_Login">
                    <Setter Property="Margin" Value="10,5,10,5"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Grid.Resources>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>

    <Button Grid.Row="0" Grid.Column="0" Content="1"
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
    <Button Grid.Row="0" Grid.Column="1" Content="2" 
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
    <Button Grid.Row="0" Grid.Column="2" Content="3" 
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
    <Button Grid.Row="0" Grid.Column="3" Content="4" 
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />

    <Button Grid.Row="1" Grid.Column="0" Content="5" 
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
    <Button Grid.Row="1" Grid.Column="1" Content="6" 
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
    <Button Grid.Row="1" Grid.Column="2" Content="7" 
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
    <Button Grid.Row="1" Grid.Column="3" Content="8" 
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />

    <Button Grid.Row="2" Grid.Column="0" Content="9" 
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
    <Button Grid.Row="2" Grid.Column="1" Content="0" 
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
    <Button Grid.Row="2" Grid.Column="2" Content="Clear" 
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.ColumnSpan="2" />

    <Button Tag="btn_Login" Grid.Row="3" Content="Login" 
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.ColumnSpan="4" />
</Grid>