Wpf 为什么Viewbox在具有等间距行/列的网格中打破布局？

简单地说，我有一个网格，有三个同样高的行和两个按钮。我希望第一行有第一个按钮，然后第二行是空的，最后第三行有第二个按钮。这样我就得到了按钮之间的相对大小的间距。我需要这个，而不是硬编码绝对边距值。因此，这里是用于此的XAML：

                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
                    <Button Grid.Row="0">Button 1</Button>
                    <Button Grid.Row="2">Button 2</Button>
                </Grid>

很好！现在，我需要的附加功能是使所有内容都可伸缩，因此我将其放在Viewbox中：

            <Viewbox>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
                    <Button Grid.Row="0">Button 1</Button>
                    <Button Grid.Row="2">Button 2</Button>
                </Grid>
            </Viewbox>

突然布局被打破了。我得到了Viewbox提供的缩放比例，但按钮之间没有空格。所以有两个问题：

为什么Viewbox会破坏这里的东西？ 我如何解决这个问题？我需要灵活性，所以想象一下我可以有任意数量的按钮，这些按钮可以被网格中任意数量的空行/列分隔。 试试这个

     <Viewbox>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition 
                        MinHeight="{Binding Path=ActualHeight,
                                   ElementName=MyButton1}"
                        Height="*" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <Button Grid.Row="0" x:Name="MyButton1">Button 1</Button>
            <Button Grid.Row="2">Button 2</Button>
        </Grid>
    </Viewbox>

严格假设按钮高度相同

为了解释为什么会发生这种情况，请检查这个

试试这个

     <Viewbox>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition 
                        MinHeight="{Binding Path=ActualHeight,
                                   ElementName=MyButton1}"
                        Height="*" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <Button Grid.Row="0" x:Name="MyButton1">Button 1</Button>
            <Button Grid.Row="2">Button 2</Button>
        </Grid>
    </Viewbox>

严格假设按钮高度相同

---

为了解释为什么会发生这种情况，请检查这个

Viewbox不能很好地处理百分比。在我看来，我不建议使用Viewbox对所有元素进行分组。您应该仅对按钮文本使用Viewbox：

<Window.Resources>
    <Style x:Key="DefaultButton" TargetType="Button">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Border Background="LightGray">
                        <Viewbox>
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                        </Viewbox>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>
<Grid>
    <Border>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="0.3*" />
                <RowDefinition Height="0.3*" />
                <RowDefinition Height="0.3*" />
            </Grid.RowDefinitions>
            <Button Grid.Row="0" Style="{DynamicResource DefaultButton}">Button 1</Button>
            <Button Grid.Row="2" Style="{DynamicResource DefaultButton}">Button 2</Button>
        </Grid>
    </Border>
</Grid>

---

Viewbox不能很好地使用百分比。在我看来，我不建议使用Viewbox对所有元素进行分组。您应该仅对按钮文本使用Viewbox：

<Window.Resources>
    <Style x:Key="DefaultButton" TargetType="Button">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Border Background="LightGray">
                        <Viewbox>
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                        </Viewbox>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>
<Grid>
    <Border>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="0.3*" />
                <RowDefinition Height="0.3*" />
                <RowDefinition Height="0.3*" />
            </Grid.RowDefinitions>
            <Button Grid.Row="0" Style="{DynamicResource DefaultButton}">Button 1</Button>
            <Button Grid.Row="2" Style="{DynamicResource DefaultButton}">Button 2</Button>
        </Grid>
    </Border>
</Grid>