首页 > 解决方案 > Xamarin:具有回收元素和动态行高的 Listview

问题描述

我目前正在开发一个像whatsapp这样的聊天应用程序。

一切正常,除了缓存策略。我想使用回收元素,因为它似乎在我的场景中工作得最顺利。

我使用日期模板选择器,并且我的列表视图设置为 hasunevenrows = true (由于更改消息长度)。

问题是,只要我向上滚动列表视图然后再向下滚动,较长的多行消息就会被截断。我认为这与我的视图单元(回收元素)的重用有关,但我只是不明白为什么列表视图不重新计算高度以适应消息内容。

我正在使用绑定,这是我的列表视图:

<ListView CachingStrategy="RetainElement" Grid.Row="0" Grid.Column="0" x:Name="ChatListView" IsVisible="{Binding ChatVisible}" ItemsSource="{Binding ChatList, Mode=TwoWay}" ItemTemplate="{StaticResource ChatSelectorTemplate}" HasUnevenRows="True" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" SeparatorVisibility="None">
                    <ListView.Behaviors>
                        <behavior:EventToCommandBehavior EventName="ItemTapped" Command="{Binding ChatTap}" Converter="{StaticResource TappedItemConverter}" />
                        <behavior:EventToCommandBehavior EventName="ItemAppearing" Command="{Binding ItemAppearingEvent}" Converter="{StaticResource ItemAppearingConverter} " />
                    </ListView.Behaviors>
                </ListView>

有问题的数据模板:

<DataTemplate x:Key="OtherTemplate">
            <local:CustomViewCell>
                <Grid ColumnSpacing="5" Padding="0,5,0,5" HorizontalOptions="FillAndExpand">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="50" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="40" />
                    </Grid.ColumnDefinitions>
                    <ff:CachedImage LoadingPlaceholder="nopic.png" Grid.Row="0" Grid.Column="0" DownsampleToViewSize="True" WidthRequest="50" HeightRequest="50" Aspect="AspectFit" Source="{Binding ProfilePic}" VerticalOptions="StartAndExpand">
                        <ff:CachedImage.Transformations>
                            <ffTransformations:CircleTransformation />
                        </ff:CachedImage.Transformations>
                    </ff:CachedImage>
                    <Frame Grid.Row="0" Grid.Column="1" HorizontalOptions="FillAndExpand" Padding="15,10,15,10" BackgroundColor="#eaeaea" CornerRadius="20" HasShadow="False">
                        <StackLayout Orientation="Vertical" HorizontalOptions="FillAndExpand" Spacing="3">
                            <Label TextColor="#616161" FontSize="14" Text="{Binding Name}">
                                <Label.FontFamily>
                                    <OnPlatform x:TypeArguments="x:String">
                                        <On Platform="iOS" Value="SourceSansPro-Semibold"/>
                                        <On Platform="Android" Value="Fonts/SourceSansPro-Semibold.ttf#SourceSansPro-Semibold"/>
                                    </OnPlatform>
                                </Label.FontFamily>
                            </Label>
                            <Label LineBreakMode="WordWrap" TextColor="#828282" FontSize="14" Text="{Binding Text}">
                                <Label.FontFamily>
                                    <OnPlatform x:TypeArguments="x:String">
                                        <On Platform="iOS" Value="SourceSansPro-Regular"/>
                                        <On Platform="Android" Value="Fonts/SourceSansPro-Regular.ttf#SourceSansPro-Regular"/>
                                    </OnPlatform>
                                </Label.FontFamily>
                            </Label>
                        </StackLayout>
                    </Frame>
                    <StackLayout Grid.Row="0" Grid.Column="2" Orientation="Vertical" Spacing="3" WidthRequest="40" VerticalOptions="CenterAndExpand" HorizontalOptions="EndAndExpand">
                        <Label TextColor="#828282" FontSize="14" Text="{Binding Time}" HorizontalOptions="EndAndExpand" HorizontalTextAlignment="End">
                            <Label.FontFamily>
                                <OnPlatform x:TypeArguments="x:String">
                                    <On Platform="iOS" Value="SouceSansPro-Regular"/>
                                    <On Platform="Android" Value="Fonts/SourceSansPro-Regular.ttf#SourceSansPro-Regular"/>
                                </OnPlatform>
                            </Label.FontFamily>
                        </Label>
                    </StackLayout>
                </Grid>
            </local:CustomViewCell>
        </DataTemplate>

感谢任何帮助,因为我真的不想坚持使用“RetainElement”。

PS:我在安卓上测试过

谢谢 :)

标签: listviewxamarincaching

解决方案


推荐阅读