我用的是xamarin forms V3.3.0。我无法从一开始就对齐flex布局最后一行中的项目。我尝试使用这些属性组合,Direction=“Row”Wrap=“Wrap”JustifyContent=“Center”AlignContent=“Start”AlignItems=“Start”。在下面添加代码和图像。
<FlexLayout Direction="Row" Wrap="Wrap" Margin="5" JustifyContent="Center" AlignContent="Start" AlignItems="Start">
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
<BoxView HeightRequest="100" WidthRequest="100" BackgroundColor="Blue" Margin="5"></BoxView>
</FlexLayout>
3条答案
按热度按时间vlju58qv1#
对于最后一行的这些项,
JustifyContent="Center"
是将所有项移动到中心。您可以尝试使用
JustifyContent="Start"
:pvcm50d12#
您需要将flexlayout更改为:
jyztefdp3#
JustifyContent="Start"
导致右侧出现空格。我解决了空格问题,如下所示:首先,你需要确定你想要在屏幕上显示多少帧,例如,假设有3列,然后我们可以根据screenWidht/3来安排帧宽度,这样我们就可以使用Xamarin.Essentials来计算。你可以在构造函数中将FrameWidthValue绑定到FrameWidth。通过这种方式,产生了类似于网格但比网格更响应的解决方案。