在.net MAUI/Xamarin.Forms中使用MVVM的手势识别器

Question

我想用ViewModel而不是后面的代码来使用带有iccommand含义的Tap Gesture recognizer。

我正在使手势识别器通过后面的代码工作，如下所示

HomePage.xaml

<CollectionView Margin="10,0,10,0"
ItemSizingStrategy="MeasureAllItems"
ItemsLayout="VerticalList"
VerticalScrollBarVisibility="Always"
ItemsSource="{Binding QuestionPacks}">
<CollectionView.ItemTemplate>
<DataTemplate x:DataType="model:QuestionPack">
<Frame Margin="5"
CornerRadius="10">
<Frame.GestureRecognizers>
<TapGestureRecognizer 
Tapped="TapGestureRecognizer_Tapped"/>
<TapGestureRecognizer 
NumberOfTapsRequired="2"
Tapped="TapGestureRecognizer_Tapped_1"/>
</Frame.GestureRecognizers>
<VerticalStackLayout Margin="5">

<Label Text="{Binding Topic}" />
<Label Text="{Binding TopicId}" />
</VerticalStackLayout>
</Frame>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>

请注意DataTemplate中的x:DataType=model:QuestionPack。

HomePage.xaml.cs

private async void TapGestureRecognizer_Tapped(object sender, EventArgs e)
{
var selectedItem = ((VisualElement)sender).BindingContext as QuestionPack;
if (selectedItem == null)
return;

LoadingQuestions.IsRunning = true;
LoadingQuestions.IsEnabled = true;
await Shell.Current.GoToAsync($"{nameof(QuestionsPage)}?topicSelected={selectedItem.TopicId}");
LoadingQuestions.IsRunning = false;
LoadingQuestions.IsEnabled = false;
}

这是工作很好，但我想知道如何实现这在我的ViewModel。我在尝试这样做时遇到了两个挑战。

1. 我应该在TapGestureRecognizer下使用Command而不是tap。每当我在后台代码中将Command字段绑定到Command时，x:DataType="model:QuestionPack">就会引发一个问题，因为该命令没有在数据模板的模型中定义。

2. 即使将Command应用于点击手势识别器不会导致构建应用程序失败，我如何将被选中的对象传递到后面的代码中?在后面的代码中，我使用对象发送器检索它，但在ViewModel中，我不知道。我猜这就是CommandParameters发挥作用的地方，但如何实现它们是我不知道的地方。

如果有人能解释CommandParameter="{Binding .}"的意思，那就不要麻烦了。

任何帮助都是非常感谢的。

Answer 1

创建ViewModel文件并定义为BindingContext示例

<ContentPage.BindingContext>
<vm:MyViewModel />
</ContentPage.BindingContext>

然后在ViewModel中定义Command和ICommand(假设你知道怎么做)

在xaml文件中，可以这样写

<Frame.GestureRecognizers>
<TapGestureRecognizer NumberOfTapsRequired="1" 
CommandParameter="{Binding .}"
Command="{Binding 
Source={RelativeSource AncestorType={x:Type vm:MyViewModel}}, Path=TapGestureRecognizer_Tapped}"/>                  
</Frame.GestureRecognizers>

告诉我更多的细节