Xamarin C#中ObservableCollection绑定的CollectionView如何自动滚动到选中项

方案1：MVVM模式下通过消息通知实现（低耦合推荐） #

步骤1：ViewModel中选中项变更时发送通知 #

修改SelectedFlock的set块，选中变更时发送滚动通知，示例用MAUI/Xamarin的MessagingCenter，其他框架可替换为对应事件聚合器：

public WorkerFlock SelectedFlock
{
    get => selectedFlock;
    set
    {
        if (selectedFlock != value)
        {
            try
            {
                selectedFlock = value;
                // 新增：选中项非空时发送滚动通知
                if (value != null)
                {
                    MessagingCenter.Send(this, "ScrollToSelectedFlock", value);
                }
            }
            catch
            {
                // 原有异常处理逻辑保留
            }
            finally
            {
                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(SelectedFlock)));
            }
        }
    }
}

步骤2：视图层订阅消息执行滚动 #

在对应页面的xaml.cs文件中订阅消息，调用CollectionView的滚动方法，假设你的CollectionView在XAML中定义的x:Name为FlockCollectionView：

protected override void OnAppearing()
{
    base.OnAppearing();
    // 订阅滚动通知
    MessagingCenter.Subscribe<HomeWorkerViewModel, WorkerFlock>(this, "ScrollToSelectedFlock", (sender, item) =>
    {
        if (item != null && FlockCollectionView.ItemsSource != null)
        {
            // 滚动参数说明：第二个参数为分组（无分组传null），position控制滚动位置，animate控制是否开启动画
            FlockCollectionView.ScrollTo(item, position: ScrollToPosition.Visible, animate: true);
        }
    });
}

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

步骤3：处理首次加载预选中项的滚动 #

页面首次加载时CollectionView可能未完成渲染，直接调用滚动方法会失效，需要等布局完成后执行首次滚动：

// 在页面构造函数中添加布局完成监听
public YourPage()
{
    InitializeComponent();
    this.Loaded += (s, e) =>
    {
        var vm = BindingContext as HomeWorkerViewModel;
        if (vm?.SelectedFlock != null)
        {
            FlockCollectionView.ScrollTo(vm.SelectedFlock, position: ScrollToPosition.Visible, animate: false);
        }
    };
}

方案2：自定义Behavior实现（零后台代码推荐） #

如果不想在xaml.cs中写逻辑，可以自定义Behavior绑定选中项自动触发滚动：

public class CollectionViewScrollToSelectedItemBehavior : Behavior<CollectionView>
{
    public static readonly BindableProperty SelectedItemProperty =
        BindableProperty.Create(nameof(SelectedItem), typeof(object), typeof(CollectionViewScrollToSelectedItemBehavior), propertyChanged: OnSelectedItemChanged);

    public object SelectedItem
    {
        get => GetValue(SelectedItemProperty);
        set => SetValue(SelectedItemProperty, value);
    }

    private static void OnSelectedItemChanged(BindableObject bindable, object oldValue, object newValue)
    {
        if (bindable is CollectionViewScrollToSelectedItemBehavior behavior && behavior.AssociatedObject != null && newValue != null)
        {
            behavior.AssociatedObject.ScrollTo(newValue, position: ScrollToPosition.Visible, animate: true);
        }
    }

    public CollectionView AssociatedObject { get; private set; }

    protected override void OnAttachedTo(CollectionView bindable)
    {
        base.OnAttachedTo(bindable);
        AssociatedObject = bindable;
    }

    protected override void OnDetachingFrom(CollectionView bindable)
    {
        base.OnDetachingFrom(bindable);
        AssociatedObject = null;
    }
}

在XAML中给CollectionView添加该Behavior即可：

<CollectionView ItemsSource="{Binding WorkerFlockDetails}" SelectedItem="{Binding SelectedFlock}">
    <CollectionView.Behaviors>
        <local:CollectionViewScrollToSelectedItemBehavior SelectedItem="{Binding SelectedFlock}" />
    </CollectionView.Behaviors>
</CollectionView>

注意事项 #

如果你使用的是WPF框架，将上述代码中的ScrollTo方法替换为ScrollIntoView即可，调用方式为FlockCollectionView.ScrollIntoView(item)

• 滚动操作必须在UI线程执行，如果选中项是在异步线程变更的，需要将滚动逻辑调度到UI线程执行
• ScrollToPosition参数可按需调整：Visible表示仅滚动到可见区域即可，Start为滚动到可视区顶部，Center为滚动到可视区中间，End为滚动到可视区底部

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