Avalonia：根据其他行是否可见调整网格行的大小答案

【问题标题】：Avalonia : Have the size of a grid row resize depending on if the other rows are visible or notAvalonia：根据其他行是否可见调整网格行的大小
【发布时间】：2023-01-19 18:13:03
【问题描述】：

我有一个包含三 (3) 行的网格，根据切换按钮的值，我希望最后两 (2) 行不可见（我将这两 (2) 行的内容设置为：IsVisible="{Binding #ToggleButton.IsChecked}) 和第零行 (0) 的内容将被拉伸到整个网格。

由于我第一行的内容设置为VerticalAlignment="Stretch"，我曾期望当其他两行的内容设置为'invisible'时，我的第一行内容会自动调整为全高网格。

我已经为行定义尝试了所有可能的值，但从未得到预期的结果。

代码如下：

<Grid.RowDefinitions>
    <RowDefinition /> <!-- Upper panel -->
    <RowDefinition Height="5"/> <!-- Splitter -->
    <RowDefinition /> <!-- Lower panel -->
</Grid.RowDefinitions>
<!-- Upper panel -->
<Grid Grid.Row="0" VerticalAlignment="Stretch">
    <Image Source="../Assets/Image01.png"/>
</Grid>
<!-- Splitter -->
<GridSplitter Grid.Row="1" 
    IsVisible="{Binding #ToggleButton.IsChecked}"/>
<!-- Lower panel -->
<Grid Grid.Row="2" 
    IsVisible="{Binding #ToggleButton.IsChecked}"
    VerticalAlignment="Stretch">
    <Image Source="../Assets/Image02.png"/>
</Grid>

【问题讨论】：

标签： grid avalonia

【解决方案1】：

首先，我没有找到仅在 XAML 中执行此操作的方法。

因此，对于其他有同样问题的人，我是这样解决的：

为网格命名（“grGrid”），以便我可以通过代码访问行定义。

像这样为我的原始代码的下面板设置 RowDefinition：

<RowDefinition Height="0"/> <!-- Lower panel -->

在 XAML 和后面的代码中，为 ToggleButton 添加“点击”事件，如下所示：

private void TbToggleButton_OnClick(object? sender, RoutedEventArgs e)
{
    if (_tbToggleButton.IsChecked.Value)
    {
        _grGrid.RowDefinitions[0].Height = new GridLength(1, GridUnitType.Star);
        _grGrid.RowDefinitions[0].MinHeight = 150;
        _grGrid.RowDefinitions[2].Height = new GridLength(1, GridUnitType.Star);
        _grGrid.RowDefinitions[2].MinHeight = 150;
    }
    else
    {
        _grGrid.RowDefinitions[0] = new RowDefinition();
        _grGrid.RowDefinitions[2].MinHeight = 0;
        _grGrid.RowDefinitions[2].Height = new GridLength(0);
    }
}

这很好用。

如果您希望保存拆分器（并在重启时加载）（在这种情况下我不需要），我建议查看下面的解决方案（它适用于 WPF，但应该很容易适应 Avalonia）。

WPF GridSplitter - saving and restoring location AND splitting proportionately

【讨论】：