两列中的 Xamarin 表单 CollectionView 数据在 iOs 上未按行对齐

Question

我在 iOs 上有问题。在 android 上，CollectionView 项目对齐完美，但在 iOS 上则不然。截图：
Android 截图：https://i.stack.imgur.com/7v2lK.png
iOs 截图：https://i.stack.imgur.com/YCwsa.jpg

我的代码：

 <CollectionView x:Name="FlowersList" VerticalOptions="EndAndExpand" BackgroundColor="Transparent" >
                    <CollectionView.ItemsLayout>
                        <GridItemsLayout Orientation="Vertical" x:Name="grid_layout" Span="2" />
                    </CollectionView.ItemsLayout>

                    <CollectionView.ItemTemplate>
                        <DataTemplate >
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition x:Name="nuline_row" Height="Auto"/>
                                    <RowDefinition x:Name="pirma_row" Height="Auto"/>
                                    <RowDefinition x:Name="antra_row" Height="*"/>
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition x:Name="nulinis_stulpelis"/>
                                </Grid.ColumnDefinitions>
                                <Image Grid.Row="0" 
                                       Source="{Binding Image, Converter={StaticResource Base64ToImageConverter}}"
                                       Aspect="AspectFill"                                    
                                       VerticalOptions="FillAndExpand" 
                                       HorizontalOptions="FillAndExpand">
                                </Image>
                                <Label Grid.Row="1" 
                                       Text="{Binding Name, Converter={StaticResource caseConverter}, ConverterParameter=u}"
                                       FontSize="16"
                                       TextColor="Black"
                                       LineBreakMode="WordWrap"
                                       HorizontalOptions="Center"
                                       HorizontalTextAlignment="Center"
                                       VerticalOptions="Start" />
                                <Label Grid.Row="2"
                                       Text="{Binding PriceToDisplay, StringFormat='{0} €'}"
                                       FontSize="16"
                                       TextColor="Black"
                                       LineBreakMode="WordWrap"
                                       HorizontalOptions="Center"
                                       VerticalOptions="Start" Padding="0,-5,0,20" />
                                <Grid.GestureRecognizers>
                                    <TapGestureRecognizer Tapped="OnTapGestureRecognizerTapped"
                                                              NumberOfTapsRequired="1" />

                                </Grid.GestureRecognizers>
                            </Grid>

                        </DataTemplate>
                    </CollectionView.ItemTemplate>
                </CollectionView>

我没主意了。也许有人知道如何解决这个问题？

Answer 1

这可能是默认图片大小不同造成的：

解决方法:

1.Give 网格中的特定高度：

 <Grid.RowDefinitions>
        <RowDefinition x:Name="nuline_row" Height="150"/>
        <RowDefinition x:Name="pirma_row" Height="Auto"/>
        <RowDefinition x:Name="antra_row" Height="*"/>
 </Grid.RowDefinitions>

2.Or 给图片一个heightRequest:

<Image Grid.Row="0" 
    Source="{Binding Image, Converter={StaticResource Base64ToImageConverter}}"
    HeightRequest="150"
    Aspect="AspectFill"                                    
    VerticalOptions="FillAndExpand" 
    HorizontalOptions="FillAndExpand">
</Image>

Answer 2

只需升级 xamarin Forms 版本。

Xamarin.Forms CollectionView Introduction

Answer 3

我也运行遇到了在 iOS 上的数据模板中使用这样的网格的类似问题。我无法解释为什么它工作不可靠，但我设法通过切换到 stacklayout + 将 HeightRequest="150" 放在图像上来解决它。鉴于您基本上是将网格用作垂直堆栈，您可能想试试这个。

两列中的 Xamarin 表单 CollectionView 数据在 iOs 上未按行对齐

Xamarin forms CollectionView data in two columns does not align in lines on iOs

xaml

xamarin.forms

xamarin.android

xamarin.ios

collectionview