MAUI应用中刷新集合后如何让ListView滚动至顶部？

下面提供几种实用的实现方式，适配MVVM模式，避免ViewModel直接操作View：

方法一：通过ViewModel事件通知页面滚动 #

1. 在ViewModel中添加刷新完成事件，刷新集合后触发该事件：

public event Action OnCollectionRefreshed;

private void Refresh(IEnumerable<MyType> paramItems)
{
    MyCollection.Clear();

    foreach (MyType iterator in paramItems.OrderByDescending(x => x.MyDate))
    {
        MyCollection.Add(iterator);
    }

    // 通知页面集合已刷新
    OnCollectionRefreshed?.Invoke();
}

2. 在页面代码后台订阅该事件，调用ListView的滚动方法：

public YourPage(YourViewModel viewModel)
{
    InitializeComponent();
    BindingContext = viewModel;

    viewModel.OnCollectionRefreshed += () =>
    {
        // 滚动至顶部，第三个参数控制是否启用动画
        MyListView.ScrollToAsync(0, 0, true);
        
        // 也可以直接滚动到第一个数据项（适合需要定位到具体Item的场景）
        // if (viewModel.MyCollection.Any())
        // {
        //     MyListView.ScrollToAsync(viewModel.MyCollection.First(), ScrollToPosition.Start, true);
        // }
    };
}

方法二：使用自定义行为（Behavior）解耦View与ViewModel #

创建一个自动监听集合变化的行为，当集合刷新时自动滚动到顶部：

using Microsoft.Maui.Controls;
using System.Collections.Specialized;

public class ScrollToTopOnCollectionRefreshBehavior : Behavior<ListView>
{
    protected override void OnAttachedTo(ListView bindable)
    {
        base.OnAttachedTo(bindable);
        if (bindable.ItemsSource is INotifyCollectionChanged collection)
        {
            collection.CollectionChanged += OnCollectionChanged;
        }
    }

    private void OnCollectionChanged(object sender, NotifyCollectionChangedEventArgs e)
    {
        // 当集合被重置或批量添加数据时，触发滚动
        if (e.Action == NotifyCollectionChangedAction.Reset || 
            (e.Action == NotifyCollectionChangedAction.Add && e.NewItems?.Count > 0))
        {
            AssociatedObject?.ScrollToAsync(0, 0, true);
        }
    }

    protected override void OnDetachingFrom(ListView bindable)
    {
        base.OnDetachingFrom(bindable);
        if (bindable.ItemsSource is INotifyCollectionChanged collection)
        {
            collection.CollectionChanged -= OnCollectionChanged;
        }
    }
}

在XAML中给ListView绑定该行为：

<ListView x:Name="MyListView" ItemsSource="{Binding MyCollection}">
    <ListView.Behaviors>
        <local:ScrollToTopOnCollectionRefreshBehavior />
    </ListView.Behaviors>
    <!-- ListView的ItemTemplate等配置 -->
</ListView>

方法三：使用消息中心（MessagingCenter）传递刷新信号 #

1. ViewModel刷新完成后发送消息：

private void Refresh(IEnumerable<MyType> paramItems)
{
    MyCollection.Clear();

    foreach (MyType iterator in paramItems.OrderByDescending(x => x.MyDate))
    {
        MyCollection.Add(iterator);
    }

    // 发送集合刷新完成的消息
    MessagingCenter.Send(this, "CollectionRefreshed");
}

2. 在页面中订阅消息并执行滚动：

protected override void OnAppearing()
{
    base.OnAppearing();
    MessagingCenter.Subscribe<YourViewModel>(this, "CollectionRefreshed", (sender) =>
    {
        MyListView.ScrollToAsync(0, 0, true);
    });
}

protected override void OnDisappearing()
{
    base.OnDisappearing();
    // 页面消失时取消订阅，避免内存泄漏
    MessagingCenter.Unsubscribe<YourViewModel>(this, "CollectionRefreshed");
}

注意事项 #

• 如果刷新后集合为空，可添加判断跳过滚动操作，避免异常
• ScrollToAsync的第三个布尔参数控制是否启用滚动动画，可根据需求调整

内容的提问来源于stack exchange，提问作者Álvaro García