如何让VerticalStackLayout实现StackLayout的子控件AndExpand效果?
VerticalStackLayout怎么实现StackLayout的AndExpand垂直展开效果?
问题根源
VerticalStackLayout虽然是StackLayout的高性能替代,但它的布局逻辑是全新重构的,完全不支持StartAndExpand这类带AndExpand后缀的布局选项。这些带Expand的选项是旧StackLayout独有的布局逻辑,VerticalStackLayout采用了更高效的约束布局模型,默认只会按子控件自身的固有大小排列,不会自动分配容器的剩余空间。
解决办法
要达到和原StackLayout中AndExpand相同的均分剩余空间效果,有两种实用方案:
方案1:用Grid替代(最推荐)
Grid的行定义使用*可以自动均分可用空间,完美匹配原StackLayout的展开效果:
<Grid BackgroundColor="Yellow"> <Grid.RowDefinitions> <RowDefinition Height="*" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <BoxView BackgroundColor="White" Grid.Row="0" /> <BoxView BackgroundColor="Red" Grid.Row="1" /> </Grid>
方案2:结合Fill布局选项使用VerticalStackLayout
如果坚持使用VerticalStackLayout,需要给子控件设置VerticalOptions="Fill",同时确保VerticalStackLayout本身占据父容器的全部可用空间(给它也设置VerticalOptions="Fill")。但这种方式下子控件会直接填充整个VerticalStackLayout空间,若要均分需手动控制高度,不如Grid方案简洁:
<VerticalStackLayout BackgroundColor="Yellow" VerticalOptions="Fill"> <BoxView BackgroundColor="White" VerticalOptions="Fill" /> <BoxView BackgroundColor="Red" VerticalOptions="Fill" /> </VerticalStackLayout>
注:此写法中两个BoxView会重叠填满整个布局,若要实现均分高度,需手动给每个BoxView设置相同的
HeightRequest,或通过绑定动态计算。
补充说明
VerticalStackLayout的设计目标是高性能线性排列子控件,复杂的空间分配逻辑,MAUI官方更推荐使用Grid或FlexLayout实现,这是新布局体系的设计导向。
内容的提问来源于stack exchange,提问作者Miroslav
相关产品推荐
相关产品推荐

