.NET MAUI如何兼顾控件自动折叠与CollectionView局部滚动

最优方案：Grid 搭配 Auto + * 行定义 #

这是.NET MAUI原生支持、跨平台稳定性最高的实现，不需要额外自定义逻辑，可同时满足自动折叠和局部滚动两个需求：

• 放置可折叠控件（如示例中的Button）的行设置为Auto高度：行高完全由内部内容决定，当控件IsVisible设为False时，该行高度会自动收缩为0，无空白占位
• 放置CollectionView的行设置为*（Star）高度：自动占满父容器剩余的全部可用空间，CollectionView能拿到明确的高度约束，默认即可支持内部局部滚动，页面整体不会产生滚动

对应XAML代码：

<ContentPage>
    <Grid RowDefinitions="Auto,*">
        <Button Grid.Row="0"
                x:Name="ToggleBtn"
                Text="测试按钮" />
        <CollectionView Grid.Row="1"
                        ItemsSource="{Binding TestList}">
            <!-- 自定义集合项模板 -->
        </CollectionView>
    </Grid>
</ContentPage>

显隐切换只需要直接修改控件的IsVisible属性即可，不需要手动调整行高参数：

// 切换按钮显隐的逻辑
ToggleBtn.IsVisible = !ToggleBtn.IsVisible;

之前Grid方案未生效的原因：使用固定行高50或双*行定义时，行高分配规则和内部控件显隐状态完全无关——固定行会永久保留设定高度，*行只会按比例切分可用空间，两种配置都不会因为内部控件隐藏自动收缩高度，只有Auto行原生支持内容驱动的高度自适应。

如果页面顶部有多个可折叠的固定控件，只需要对应增加Auto行即可，最后一行保留*放置CollectionView，效果完全一致。

备选方案：FlexLayout 搭配 Grow 附加属性 #

如果偏好FlexLayout布局，不需要写死HeightRequest，给CollectionView添加FlexLayout.Grow="1"附加属性，即可让CollectionView自动占满剩余空间，同时支持顶部控件自动折叠：

<ContentPage>
    <FlexLayout Direction="Column">
        <Button x:Name="ToggleBtn"
                Text="测试按钮" />
        <CollectionView FlexLayout.Grow="1"
                        ItemsSource="{Binding TestList}">
            <!-- 自定义集合项模板 -->
        </CollectionView>
    </FlexLayout>
</ContentPage>

该方案在部分低版本安卓系统上存在CollectionView高度偶发计算异常的问题，稳定性弱于Grid方案，优先推荐使用Grid实现。

其他布局不适用的原因 #

• VerticalStackLayout属于内容自适应高度容器，不会给子元素传递明确的高度约束，CollectionView在其中会默认展开所有项的高度，无法触发内部滚动
• 写死HeightRequest的方案无法适配不同尺寸的屏幕，会出现内容截断或者留白问题，.NET MAUI不支持XAML中直接写比例值的HeightRequest写法

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