Xamarin Forms中FlowListView条目无限加载导致应用卡顿问题求助

问题诱因 #

• 最核心的原因是布局容器使用错误：你将FlowListView放在了垂直方向的StackLayout中，StackLayout会为内部的滚动类控件提供无限制的垂直布局空间，导致FlowListView无法识别自身的显示边界，不会触发条目回收机制，会持续渲染所有数据源条目，哪怕超出屏幕可视范围也不会销毁已滚出的条目，最终表现为条目无限加载、应用卡顿。
• 次要诱因包括未开启条目复用缓存、使用存在已知bug的低版本包等。

修复方案 #

1. 替换外层布局容器
   将包裹FlowListView的StackLayout替换为Grid，Grid会自动限制子控件的尺寸为父容器可用大小，让FlowListView正确识别显示边界，触发回收机制，修改后的XAML布局如下：

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:flv="clr-namespace:DLToolkit.Forms.Controls;assembly=DLToolkit.Forms.Controls.FlowListView"
             xmlns:vm="clr-namespace:FlowDemo.ViewModels"
             x:Class="FlowDemo.MainPage">

    <ContentPage.BindingContext>
        <vm:MainViewModel />
    </ContentPage.BindingContext>
    
    <Grid>
        <flv:FlowListView FlowColumnCount="2"
                          RowHeight="50"
                          SeparatorVisibility="Default"
                          HasUnevenRows="false"
                          CachingStrategy="RecycleElement"
                          FlowItemsSource="{Binding Items}" >

            <flv:FlowListView.FlowColumnTemplate>
                <DataTemplate>
                    <Frame Margin="10" Padding="0" CornerRadius="6" HasShadow="True">
                        <Label Text="{Binding}" HorizontalOptions="Center" VerticalOptions="Center" />
                    </Frame>
                </DataTemplate>
            </flv:FlowListView.FlowColumnTemplate>
        </flv:FlowListView>
    </Grid>
</ContentPage>

2. 开启条目复用缓存
   如上方代码所示，为FlowListView添加CachingStrategy="RecycleElement"属性，开启条目复用机制，大幅降低渲染消耗。
3. 升级NuGet包到最新稳定版
   低版本的FlowListView存在已知的无限加载兼容bug，将DLToolkit.Forms.Controls.FlowListView升级到2.0.11及以上的稳定版即可修复相关原生适配问题。

内容的提问来源于stack exchange，提问作者Eddie