C# 调整图像大小使网格从窗口中消失

我有一个包含图像的网格（顶部有两行，稍后我将使用bot）和另一个包含4个单选按钮的网格

调整大小时，如果栅格高度大于图像，则图像周围有两行白色：

但如果高度较小，则图像显示不正确，我的按钮消失：

我该怎么做才能在屏幕上保留按钮，并在左右两侧添加白色列以查看整个图像

这是我的代码：

<Grid Grid.Column="2">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="auto"/>
    </Grid.RowDefinitions>

    <Image Grid.Row="1"
           Source="{Binding Picture}"
           HorizontalAlignment="Stretch"
           VerticalAlignment="Stretch"/>

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

        <RadioButton Grid.Column="0" Grid.Row="0" Background="Red" Content="Point 1" IsChecked="{Binding SelectedPointIndex, ConverterParameter=1, Converter={StaticResource IndexBooleanConverter}}" />
        <RadioButton Grid.Column="1" Grid.Row="0" Background="Green" Content="Point 2" IsChecked="{Binding SelectedPointIndex, ConverterParameter=2, Converter={StaticResource IndexBooleanConverter}}"/>
        <RadioButton Grid.Column="1" Grid.Row="1" Background="Blue" Content="Point 3" IsChecked="{Binding SelectedPointIndex, ConverterParameter=3, Converter={StaticResource IndexBooleanConverter}}"/>
        <RadioButton Grid.Column="0" Grid.Row="1" Background="Yellow" Content="Point 4" IsChecked="{Binding SelectedPointIndex, ConverterParameter=4, Converter={StaticResource IndexBooleanConverter}}"/>
    </Grid>
</Grid>

---

用于图像集为

而不是

的行。如果您想在图像和单选按钮之间留空格，我看到您的附加行，请将其高度设置为固定大小

说明： “自动”保证网格行的高度等于子内容的高度。若您希望通过父控件的大小动态地影响内容的大小，则应使用“N*”，其中N-number

例如：

 <Grid.RowDefinitions>
     <RowDefinition Height="*"/> <!-- 25% of the rest of space -->
     <RowDefinition Height="2*"/> <!-- 50% of the rest of space -->
     <RowDefinition Height="*"/> <!-- 25% of the rest of space -->
     <RowDefinition Height="auto"/> <!-- As result is static value. Height equals to height that's needed to display child content -->
 </Grid.RowDefinitions>

---

您遇到了简单的布局问题。如果您想让某些内容占用保证空间，请使用

Auto

，它优先于星号（星号分配剩余空间，如果没有，它们将一无所获）

您需要以下布局：

<Grid> <!-- high level container to ensure buttons grid is visible -->
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="auto" /> <!-- this row take precedence over first one -->
    </Grid.RowDefinitions>
    <Grid Grid.Row="0" ... > <!-- image grid -->
        ...
        <Image ... /> 
    </Grid>
    <Grid Grid.Row="1"> <!-- buttons grid -->
        ...
        <RadioButton ... />
    </Grid>
</Grid>

...
...

和演示

---

此解决方案正在运行，但我的图片周围总是有空格，因为顶部和底部边框永远不会消失。有没有办法根据剩余空间调整图片？对不起，您能更详细地解释一下如何调整图片吗？我想显示比可能大的图片（没有白色区域）。另一个答案与此行为相对应（但我有另一个问题：-（）此操作正常，但另一个元素有问题。我将尝试解释。我有一个用于在图像上绘制点的功能。我定义了

image\u MouseDown

以获取鼠标坐标，并根据图像

点p=e.GetPosition绘制点（图像）

。如果图像前后没有2行，我的位置取决于空格。具体地说，如果我的图像是高度为400的网格中的200x200像素，我将有两个高度为100px的白色区域。如果我单击点[0；0]，我的点将显示在顶部白色区域。