.NET MAUI iOS中CollectionView项Grid*高度不生效问题求助

问题重现 #

在.NET MAUI iOS平台下，使用Expanded布尔值控制CollectionView列表项内Grid第三行（Height设为*）的显示时，该行无法自动适配内容完整高度；设置父元素固定HeightRequest无效，仅热重载时布局临时恢复正常，属于MAUI布局更新机制的特定问题。

解决方案 #

以下方案均支持iOS+Android跨平台，按推荐优先级排序：

方案1：用动态行高替代IsVisible控制 #

通过绑定Grid行高替代IsVisible，强制布局系统重新计算高度：

1. 创建布尔值转Grid行高的转换器：

public class BoolToGridRowHeightConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return (bool)value ? GridLength.Auto : GridLength.Zero;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

2. 在XAML资源中注册转换器：

<ContentPage.Resources>
    <local:BoolToGridRowHeightConverter x:Key="BoolToGridRowHeightConverter" />
</ContentPage.Resources>

3. 修改列表项内的Grid行定义与内部CollectionView：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="40"/>
        <RowDefinition Height="10"/>
        <!-- 用绑定替代固定*高度 -->
        <RowDefinition Height="{Binding Expanded, Converter={StaticResource BoolToGridRowHeightConverter}}"/>
    </Grid.RowDefinitions>
    <!-- 移除内部CollectionView的IsVisible绑定，由行高控制显示 -->
    <CollectionView Grid.Row="2" Grid.Column="0" 
                    ItemsSource="{Binding SectionItems}" 
                    ItemTemplate="{StaticResource SectionSelector}" 
                    EmptyView="No items to display" 
                    BackgroundColor="White"/>
    <!-- 其他元素保持不变 -->
</Grid>

方案2：手动触发布局刷新 #

在切换Expanded状态后，强制CollectionView重新计算布局：

1. 确保SessionSummarySection实现INotifyPropertyChanged接口，修改Expanded属性时触发通知：

public class SessionSummarySection : INotifyPropertyChanged
{
    private bool _expanded;
    public bool Expanded
    {
        get => _expanded;
        set
        {
            _expanded = value;
            OnPropertyChanged(nameof(Expanded));
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }

    // 其他属性...
}

2. 在页面代码中获取CollectionView实例，在命令回调中触发布局刷新：

// 在ContentPage的代码-behind中
private void OnSectionTapped(SessionSummarySection sessionSummarySection)
{
    sessionSummarySection.Expanded = !sessionSummarySection.Expanded;
    // 强制CollectionView重新计算布局
    sessionSummaryList.InvalidateMeasure();
}

注：若使用MVVM架构，可通过MessagingCenter或弱引用在ViewModel中通知页面执行刷新操作。

方案3：替换嵌套CollectionView为BindableLayout #

嵌套CollectionView在MAUI中易引发布局计算问题，改用VerticalStackLayout结合BindableLayout实现相同效果：

<VerticalStackLayout Grid.Row="2" Grid.Column="0" 
                     IsVisible="{Binding Expanded}"
                     BindableLayout.ItemsSource="{Binding SectionItems}"
                     BindableLayout.ItemTemplate="{StaticResource SectionSelector}"
                     BackgroundColor="White">
    <VerticalStackLayout.EmptyView>
        <Label Text="No items to display" Margin="10"/>
    </VerticalStackLayout.EmptyView>
</VerticalStackLayout>

商业项目可用性说明 #

所有方案均基于.NET MAUI原生API开发，无第三方依赖，完全可用于商业项目。若需署名，可标注解决方案提供者信息（如自定义署名内容）。

内容的提问来源于stack exchange，提问作者mbai