如何在Xamarin Forms CollectionView底部添加活动指示器指示更多数据加载？

• 该方案完全适配你现有代码的上拉触发逻辑，不需要改动已有的RemainingItemsThreshold相关配置，直接复用CollectionView内置的页脚能力实现加载状态展示

XAML代码修改 #

原有列表项的ItemTemplate完全不需要改动，仅需在CollectionView节点内新增FooterTemplate配置，将活动指示器放入页脚模板，通过状态绑定控制显隐即可，修改后的完整代码如下：

<CollectionView 
    Grid.Row="1" 
    x:Name="Posts" 
    SelectionMode="Single" 
    SelectionChanged="Posts_SelectionChanged" 
    RemainingItemsThreshold="5" 
    RemainingItemsThresholdReached="Posts_RemainingItemsThresholdReached">
    
    <!-- 原有ItemTemplate保持不变 -->
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <StackLayout Padding="8, 8, 8, 0">
                <!-- 原有列表项布局内容 -->
            </StackLayout>
        </DataTemplate>
    </CollectionView.ItemTemplate>

    <!-- 新增页脚模板承载加载指示器 -->
    <CollectionView.FooterTemplate>
        <DataTemplate>
            <StackLayout 
                IsVisible="{Binding IsLoadingMore}" 
                Padding="12"
                HorizontalOptions="Center"
                VerticalOptions="Center">
                <ActivityIndicator 
                    IsRunning="{Binding IsLoadingMore}"
                    Color="#2196F3"
                    WidthRequest="30"
                    HeightRequest="30"/>
            </StackLayout>
        </DataTemplate>
    </CollectionView.FooterTemplate>
</CollectionView>

配套逻辑实现 #

• 在视图模型或后台代码中定义可通知属性IsLoadingMore，用来标记当前是否处于拉取服务器数据的状态
• 在Posts_RemainingItemsThresholdReached上拉触发事件中，通过该属性控制指示器的显示隐藏，同时拦截重复触发的加载请求
  参考实现代码：

// 可通知的加载状态属性
private bool _isLoadingMore;
public bool IsLoadingMore
{
    get => _isLoadingMore;
    set
    {
        _isLoadingMore = value;
        OnPropertyChanged(); // 触发属性变更通知，实现绑定自动刷新
    }
}

private async void Posts_RemainingItemsThresholdReached(object sender, EventArgs e)
{
    // 加载中状态下直接返回，避免重复发起网络请求
    if (IsLoadingMore) return;
    
    IsLoadingMore = true;
    // 执行从服务器拉取更多列表项的业务逻辑
    var newPostList = await LoadPostsFromServer();
    // 将新拉取的数据追加到集合绑定源中
    AppendPostsToCollection(newPostList);
    
    IsLoadingMore = false;
}

适配提示 #

• 若项目未使用MVVM绑定模式，可直接给页脚内的ActivityIndicator设置x:Name="LoadingMoreIndicator"，在后台事件中直接修改控件的IsRunning、IsVisible属性实现状态切换，该方式耦合度较高，仅适合快速验证场景
• 当所有列表数据加载完成后，可直接修改页脚模板的绑定值，将加载指示器替换为“已加载全部内容”的提示文本，不需要调整原有布局位置
• 页脚内容会自动适配纵向、横向等不同滚动方向的布局，不需要额外调整位置

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