首页 > 解决方案 > 如何在 xamarin 表单的 Flex 布局中从头开始对齐项目?

问题描述

我正在使用 xamarin 表单 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>

看这里的图片

标签: formsxamarinxamarin.forms

解决方案


对于最后一行的这些项目,JustifyContent="Center"所有项目都被移到中心。

您可以尝试JustifyContent="Start"改用:

在此处输入图像描述


推荐阅读