【问题标题】:ContentPage containing list view display very slow on Android包含列表视图的 ContentPage 在 Android 上显示非常慢
【发布时间】:2017-08-14 05:49:24
【问题描述】:

我不确定这是我的问题还是 Xamarin 的问题。 在 iPad 上,我的应用程序可以加载包含 ListView 中数据列表的页面。 ListView 中的 View Cell 可能会稍微复杂一些。它包含一个配置文件图像,一些较小的图标使用,它们正在使用 FFImageLoading。

在 iPad 上,当我点击第一页的一个单元格以进入包含数据列表的下一页时,它加载非常顺利。 在Android上,当我点击一个单元格进入下一页时,点击检测很慢,ListView的加载时间也很慢。

还有没有提升性能?我以为是我从 SQLite 加载的数据。但是,我在 ListView 上注释掉 ItemsSource 后,加载时间很好。

这是我用来显示单元格的数据模板。

<ViewCell>
               <ViewCell.View>
                    <StackLayout Spacing="0" Padding="0" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
                        <StackLayout Orientation="Horizontal" Spacing="10" Padding="0" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
                            <StackLayout Orientation="Horizontal" HorizontalOptions="StartAndExpand">
                                <controls:CircleImage 
                                    Style="{StaticResource profileImageStyle}"
                                    Margin="10, 10, 10, 10"
                                    Source="{Binding Source}"
                                    BorderColor="White"
                                    BorderThickness="2"
                                    VerticalOptions="Center"
                                    HorizontalOptions="Center">

                                    <controls:CircleImage.GestureRecognizers>
                                        <TapGestureRecognizer  Tapped="OnChildDetailTapped" />
                                    </controls:CircleImage.GestureRecognizers>
                                </controls:CircleImage>

                                <StackLayout VerticalOptions="Fill" Spacing="1" Padding="0,20,0,10" HorizontalOptions="StartAndExpand">
                                    <StackLayout.GestureRecognizers>
                                        <TapGestureRecognizer  Tapped="OnChildDetailTapped" /> 
                                    </StackLayout.GestureRecognizers>
                                    <StackLayout
                                        Orientation="Vertical"
                                        VerticalOptions="Center"
                                        HorizontalOptions="StartAndExpand"> 
                                        <Label x:Name="childName" Text="{Binding DisplayName}" Style="{StaticResource normalFont}"> </Label>
                                        <local:ChildInfoIconsView 
                                            Child="{Binding .}"
                                            VerticalOptions="Fill">
                                        </local:ChildInfoIconsView>


                                        <Label 
                                            x:Name="childNotes"
                                            Style="{StaticResource footnoteFont}"
                                            Text="{Binding ChildNotes, StringFormat={x:Static local:AppResources.formatNotes}}" 
                                            IsVisible="{Binding HasChildNotes}">
                                        </Label>
                                        <Label 
                                            x:Name="noPickupReason" 
                                            Style="{StaticResource footnoteFont}"
                                            Text="{Binding NoPickupReason, StringFormat={x:Static local:AppResources.formatNoPickupReason}}" 
                                            IsVisible="{Binding HasNoPickupReason}">
                                        </Label>
                                        <Label 
                                            x:Name="absentReason" 
                                            Style="{StaticResource footnoteFont}"
                                            Text="{Binding AbsentReason, StringFormat={x:Static local:AppResources.formatAbsentReason}}"
                                            IsVisible="{Binding HasAbsentReason}">
                                        </Label> 
                                    </StackLayout>  
                                </StackLayout>
                            </StackLayout>

                            <StackLayout Orientation="Horizontal" VerticalOptions="FillAndExpand" HorizontalOptions="End">

                                <StackLayout.Padding>
                                    <OnIdiom x:TypeArguments="Thickness">
                                        <OnIdiom.Phone>5, 20, 10, 20</OnIdiom.Phone>
                                        <OnIdiom.Tablet>10, 30, 30, 30</OnIdiom.Tablet>
                                    </OnIdiom>
                                </StackLayout.Padding>

                                <Image 
                                    Style="{StaticResource listviewButtonStyle}"
                                    IsVisible="{Binding EnabledSigning, Source={x:Reference page}}" 
                                    Source="ic_action_yes.png"
                                    VerticalOptions="FillAndExpand"
                                    HorizontalOptions="End">
                                    <Image.GestureRecognizers>
                                        <TapGestureRecognizer  Tapped="OnAttend" />
                                    </Image.GestureRecognizers>
                                    <Image.Margin>
                                        <OnIdiom x:TypeArguments="Thickness">
                                            <OnIdiom.Phone>0, 0, 5, 0</OnIdiom.Phone>
                                            <OnIdiom.Tablet>5, 5, 20, 5</OnIdiom.Tablet>
                                        </OnIdiom>
                                    </Image.Margin>
                                </Image>
                                <Image 
                                    Style="{StaticResource listviewButtonStyle}"
                                    IsVisible="{Binding EnabledSigning, Source={x:Reference page}}" 
                                    Source="ic_action_no.png"
                                    VerticalOptions="FillAndExpand"
                                    HorizontalOptions="End">
                                    <Image.GestureRecognizers>
                                        <TapGestureRecognizer  Tapped="OnAbsent" />
                                    </Image.GestureRecognizers>
                                    <Image.Margin>
                                        <OnIdiom x:TypeArguments="Thickness">
                                            <OnIdiom.Phone>5, 0, 0, 0</OnIdiom.Phone>
                                            <OnIdiom.Tablet>20, 5, 5, 5</OnIdiom.Tablet>
                                        </OnIdiom>
                                    </Image.Margin>
                                </Image>
                            </StackLayout>
                        </StackLayout>

                    </StackLayout>
                </ViewCell.View>
            </ViewCell>

【问题讨论】:

  • 如果数据很多,可以试试懒加载
  • 数据不是9行数据,但视图单元格需要显示配置文件和小图标。小图标只有 24dp
  • 您是否尝试对图像进行下采样?
  • 是的......我在回收元素属性设置后滚动列表视图没有问题。就在我第一次加载时,加载显示缓慢的页面。

标签: xamarin xamarin.android xamarin.forms ffimageloading


【解决方案1】:

尝试设置列表视图缓存策略以提高性能。

See here了解更多详情

请注意,您可能需要跳过一些障碍才能将 RecycleElement 与 FFImageLoading 一起使用。问题描述为here

另外,请发布您的数据模板,以便我们查看是否可以简化。

【讨论】:

  • 是的,当我意识到滚动速度太慢时,我使用了这个 RecycleElement。但这并不能帮助我导航到包含列表视图的页面。
  • 只需将一个 TapGestureRecogniser 放在顶层堆栈布局上,而不是在单元格内放置几个。您也可以尝试在列表视图上绑定 SelectedItem 而不是使用手势识别器。
  • 您的数据模板中的布局非常复杂,并且使用了大量的堆栈布局。您应该能够通过使用具有 5 列的网格来大量简化它。第二列中的标签可以保留在堆栈布局中。
  • 您在图像中看到的图标。也可以是网格。目前也在使用 stacklayout ......使用网格时有多快?
  • 如果你看性能文章,它建议在嵌套堆栈布局上使用网格developer.xamarin.com/guides/xamarin-forms/deployment-testing/…
【解决方案2】:
猜你喜欢
  • 1970-01-01
  • 2018-07-25
  • 1970-01-01
  • 1970-01-01
  • 2011-11-02
  • 1970-01-01
  • 1970-01-01
  • 2020-07-27
  • 1970-01-01
相关资源
最近更新 更多