Question

我仍然相对较新的WPF和目前的自我训练。我使用Google来查找大约90％的问题的答案，但在这种特殊情况下，我发现自己的答案似乎不起作用，所以我希望有人可以帮助我解决问题

为了使用带有C＃的WPF和.NET 4.5训练自己，我正在编写一个计算器应用程序。目前我试图让Equals按钮（=）在我的网格中延伸2行。到目前为止，这就是我的XAML的样子：

<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero" x:Class="WpfCalc.MainWindow"
        Title="WPF Calculator" Height="350" Width="525">

    <Window.Resources>
        <Style x:Key="NumberButton" TargetType="Button">
            <Setter Property="Width" Value="40"/>
            <Setter Property="Height" Value="40"/>
            <Setter Property="Margin" Value="5"/>
            <Setter Property="ContentTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <Label Content="{Binding}" FontSize="20" FontFamily="Consolas"/>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

    <StackPanel>
        <TextBlock>

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

            <!--Numbers-->
            <Button Grid.Row="3" Grid.Column="1" Style="{StaticResource NumberButton}" Content="0"/>
            <Button Grid.Row="2" Grid.Column="0" Style="{StaticResource NumberButton}" Content="1"/>
            <Button Grid.Row="2" Grid.Column="1" Style="{StaticResource NumberButton}" Content="2"/>
            <Button Grid.Row="2" Grid.Column="2" Style="{StaticResource NumberButton}" Content="3"/>
            <Button Grid.Row="1" Grid.Column="0" Style="{StaticResource NumberButton}" Content="4"/>
            <Button Grid.Row="1" Grid.Column="1" Style="{StaticResource NumberButton}" Content="5"/>
            <Button Grid.Row="1" Grid.Column="2" Style="{StaticResource NumberButton}" Content="6"/>
            <Button Grid.Row="0" Grid.Column="0" Style="{StaticResource NumberButton}" Content="7"/>
            <Button Grid.Row="0" Grid.Column="1" Style="{StaticResource NumberButton}" Content="8"/>
            <Button Grid.Row="0" Grid.Column="2" Style="{StaticResource NumberButton}" Content="9"/>

            <!--Math Operations-->
            <Button Grid.Row="0" Grid.Column="3" Style="{StaticResource NumberButton}" Content="/"/>
            <Button Grid.Row="1" Grid.Column="3" Style="{StaticResource NumberButton}" Content="*"/>
            <Button Grid.Row="2" Grid.Column="3" Style="{StaticResource NumberButton}" Content="-"/>
            <Button Grid.Row="3" Grid.Column="3" Style="{StaticResource NumberButton}" Content="+"/>
            <Button Grid.Row="2" Grid.Column="4" Grid.RowSpan="2" VerticalAlignment="Stretch" Style="{StaticResource NumberButton}" Content="="/>
        </Grid>
    </StackPanel>
</Window>

最底部<Button>是我的等于按钮。我将它设置为行间距为2，我期望按钮垂直拉伸以填充网格中的两个单元格。但事实并非如此。我的个人研究表明，使用VerticalAlignment或VerticalContentAlignment可以使按钮拉伸，但它不起作用，并且与其他按钮保持相同的大小，只是在跨区域中垂直居中。 / p>

任何人都知道如何让我做到我想做的事情？感谢帮助。

Answer 1

您的问题可能是样式NumberButton将按钮的高度设置为40。

尝试将Height标记中的<Button>属性设置为80，这将优先于样式化的Height设置器（有关确切顺序，请参阅here属性优先）

<Button Grid.Row="2" Grid.Column="4" Grid.RowSpan="2" 
        VerticalAlignment="Stretch" Style="{StaticResource NumberButton}" 
        Content="=" Height="80" />

作为替代方案，您还可以创建另一种样式BasedOn NumberButton样式，如下所示：

<Style x:Key="EqualsButton" TargetType="Button" 
       BasedOn="{StaticResource NumberButton}>
    <Setter Property="Height" Value="80"/>
</Style>

Answer 2

尝试将Height="Auto"添加到该按钮。它在我试用时起作用了。

在网格范围内拉伸按钮

2 个答案: