CollectionView Xamarin 网格视图调整大小

CollectionView Xamarin grid view sizing

我正在使用 GridItemsLayout orientation=“Vertical” Span=“2” 处理集合视图。 当我单击展开网格项目下部的按钮时。目前只能通过使用 ItemSizingStrategy.MeasureAllItems 我才能使下部展开。我想知道是否有一种方法可以控制项目在图像上的定位,以便图像始终对齐并且只有下半部分均匀展开。 我知道每个项目都有自己的布局,但这看起来很乱。我读过文档提到这种类型的尺寸。

    <StackLayout>
       <CollectionView x:Name="CollectionList"
                       VerticalOptions="FillAndExpand"
                       ItemsSource="{Binding Shares}"
                       IsGrouped="True"
ItemSizingStrategy="MeasureAllItems">

           <!--HEADER-->
           <CollectionView.GroupHeaderTemplate>
               <DataTemplate>
                   <StackLayout Orientation="Horizontal"
                                Padding="5"
                                BackgroundColor="#f7f7fb">

                       <Label x:Name="labelname"
                              Text="{Binding GroupKey}"
                            />

                       <Button Text=" More"
                               FontSize="16"
                               Clicked="OpenButton_Clicked"/>
                      
                   </StackLayout>
               </DataTemplate>
           </CollectionView.GroupHeaderTemplate>

            <!--TEMPLATING-->
        <CollectionView.ItemsLayout>
            <GridItemsLayout Orientation="Vertical" Span="2" />
        </CollectionView.ItemsLayout>
           <!--BODY-->
        <CollectionView.ItemTemplate>
            <DataTemplate x:DataType="viewmodels:ShareViewModel">
                <Grid Padding="5" Margin="1,0,1,0" >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="50" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <ImageButton x:Name="image"
                           Source="{Binding ImageLink}"
                           WidthRequest="150"
                           Clicked="FullImageView"
                           Grid.ColumnSpan="2"
                           Aspect="AspectFill"
                           Grid.Row="0"
                           Grid.Column="0"/>
                    
                    <Label FontSize="16"
                           Text="{Binding Name}"
                           Grid.Row="1"
                           Grid.Column="0"/>

                     <Label x:Name="label_more"
                            Text="More"
                            Grid.Row="1"
                            Grid.Column="1"
                            HorizontalTextAlignment="End"/>

                    <Label 
                           Text="{Binding CreateDate}"
                           Grid.Row="2"
                           Grid.Column="0"/>
                    <ImageButton IsVisible="{Binding TVNImageSet}"
                                Command="{Binding BindingContext.ToggleTVNCommand, Source={x:Reference Name=sharepage}}"
                                CommandParameter="{Binding .}"
                                Source="addresscard.png"
                                Grid.Row="2"
                                Grid.Column="1">
                    </ImageButton>

                    <!--Lower Section if the card is tapped (EXPAND)-->
                    <StackLayout
                        IsVisible="{Binding TVNVisible}"
                        Grid.Row="3"
                        Grid.ColumnSpan="2">
                        <StackLayout Orientation="Horizontal"
                                     IsVisible="{Binding PhoneVisible}"
                                     ClassId="{Binding Phone}">
                            <StackLayout.GestureRecognizers>
                                <TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped"
                                                      NumberOfTapsRequired="1"
                                                      />
                            </StackLayout.GestureRecognizers>
                            <Image Source="call.png"
                                   WidthRequest="15"/>
                             <Label 
                               FontSize="12"
                               Text="{Binding Phone}" />
                        </StackLayout>
                         <Label 
                                FontSize="12"
                                Text="{Binding Address}"
                                IsVisible="{Binding  AddressVisible}">
                             <Label.GestureRecognizers>
                                 <TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped_1" NumberOfTapsRequired="1"/>
                             </Label.GestureRecognizers>
                         </Label>
                    </StackLayout>
                </Grid>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>

所有 BindingContext.ToggleTVNCommand 所做的就是将 TVNVisible 设置为 true,这会显示“膨胀药水”的下半部分。如果有更简单的方法来显示此数据,我不需要使用集合视图,但 CollectionVView 似乎是我想要的布局和项目源的最佳选择。

在 GitHub 论坛上挖掘关于 Xamarin 的错误和更新后,有人提到只使用 SyncFusion 的 sfListview,会员资格还不错,如果我的公司能够使用 Xamarin,愿意为此付费更轻松。 这不是我所希望的解决方案,但它确实有效,而且他们的客户支持也很棒。 以下是参考 https://help.syncfusion.com/xamarin/listview/working-with-sflistview