如何在ViewModel中使用MVVM Prism和ReactiveCommand滚动到项目?

Question

Xamarin Forms 4.0最近发布了一个CollectionView，允许我们滚动到collectionView中的特定项目。

我有一个集合视图，其中包含 10 个未填满屏幕的项目。(Microsoft示例图片(。我正在使用ReactiveUI和MVVM Prism来处理ViewModel中的所有逻辑。

到目前为止，我能够使用SelectedItem和SelectionChangedCommand处理基于单击的导航。我想处理的下一个功能是滚动到我选择的项目。我搜索了论坛，但没有运气。该示例仅向您展示如何在代码隐藏中执行此操作，而不是通过 MVVM Prism/ReactiveUI。提前感谢！

<CollectionView x:Name="ScrollButtons"
ItemsSource="{Binding MenuItems}"
SelectedItem="{Binding SelectedMenuItem}"
Grid.Row="2" 
Grid.Column="0"
Grid.ColumnSpan="2" 
HeightRequest="90"
SelectionMode="Single"
SelectionChangedCommand="{Binding MenuItemSelectedCommand}"
BackgroundColor="{DynamicResource BackgroundColorShell}">

Answer 1

我将向您展示如何将CollectionView传递给ViewModel。
首先，定义 2 个接口，例如

public interface IHasCollectionViewModel{
IHasCollectionView View {get;set;}
}
public interface IHasCollectionView{
CollectionView CollectionView {get;}
}

接下来，在您的视图上实现IHasCollection

public class YourView: ContentPage, IHasCollectionView {
CollectionView CollectionView => ScrollButtons; // your CollectionView x:Name
protected override void OnBindingContextChanged()
{
if (this.BindingContext is IHasCollectionViewModel hasCollectionViewModel)
{
hasCollectionViewModel.View = this;
}
base.OnBindingContextChanged();
}
}

接下来，在您的视图模型上实现IHasCollectionViewModel

public class YourViewModel: IHasCollectionViewModel {
public IHasCollectionView View { get; set; }
// use CollectionView like
private void ScrollToItem(int index){
View.CollectionView.ScrollTo(index); // don't forget check null
}
}

希望这有帮助。

Answer 2

将项目滚动到视图中时，可以使用 ScrollTo 方法的位置参数指定滚动完成后项目的确切位置。此参数接受 ScrollToPosition 枚举成员。

集合视图定义属性，这些属性由可绑定属性支持

控制滚动位置 - Microsoft文档