点击列表视图项目上的手势

Question

我在点击列表视图中的项目后尝试打开另一个视图.我尝试过添加一个TapGestureRegonizer甚至添加ViewCell网格等等.这些似乎都不起作用.我已经为标签添加了一个轻击手势,这似乎有效,但同样不适用于列表视图项目.这似乎是列表视图之类的简单问题,但似乎没有内置的功能.

Xaml:

<ListView x:Name="dataList"
      ItemsSource="{Binding routeLabels}"
      HasUnevenRows="True"
      Grid.Row="1"
      Grid.Column="0"
      Grid.ColumnSpan="3">
</ListView>

背后的代码:

var listviewgesture = new TapGestureRecognizer();
listviewgesture.SetBinding(TapGestureRecognizer.CommandProperty,"LoadRoutePage");
dataList.GestureRecognizers.Add(listviewgesture);

视图模型:

public ICommand LoadRoutePage { get; protected set; }



public DriverDashboardViewModel(INavigation navigation,MessagDatabase database)
    {
        this._database = database;
        this.Navigation = navigation;
        this.LoadNotifications = new Command(async () => await OpenNotificationsPage());
        this.LoadRoutePage = new Command(async () => await OpenRoutePage());

    }

public async Task OpenRoutePage()
    {

        await Navigation.PushAsync(new RoutePageView());
    }

要明确的是,该LoadNotifications方法确实可以打开页面,但却LoadRoutePage没有.所以我知道视图和视图模型之间存在某种程度的通信.

Answer 1

你不应该添加TapGestureRecognizer一个ListView.每个单元格都有可以处理它们的事件,而GestureRecognizer可能只会混淆ListView有关敲击应该做的事情.有几种方法可以解决这个问题.

1. SelectedItem绑定

将SelectedItem属性绑定到ListView并在该属性的setter中处理方法调用.

<ListView x:Name="dataList" ItemsSource="{Binding routeLabels}"
          HasUnevenRows="True" Grid.Row="1" Grid.Column="0"        
          Grid.ColumnSpan="3" SelectedItem="{Binding SelectedItem}">
</ListView>

并在您的viewmodel中:

string _selectedItem;

public string SelectedItem {
    get {return _selectedItem; } 
    set 
    { 
        _selectedItem = value;
        // Additional code
    }
}

2.使用内置事件ItemSelected或ItemTapped

A ListView有一些你可以挂钩的事件命名ItemSelected和ItemTapped.这些可以在代码隐藏中捕获并且可以处理您正在尝试实现的内容.

<ListView x:Name="dataList" ItemsSource="{Binding routeLabels}"
          HasUnevenRows="True" Grid.Row="1" Grid.Column="0"        
          Grid.ColumnSpan="3" ItemSelected="Handle_ItemSelected" ItemTapped="Handle_ItemTapped">
</ListView>

3.使用event来命令绑定行为

由于您使用的是视图模型,因此理想情况下不需要这些事件,因为它们是在UI端处理的.有一些NuGet包可以将事件转换为您可以在viewmodel中处理的Command.以Corcav.Behaviors为例.

4.创建自己的行为

我有一个我经常使用的,看起来像这样:

public class ListViewSelectedItemBehavior : Behavior<ListView>
{
    public static readonly BindableProperty CommandProperty = BindableProperty.Create(nameof(Command), typeof(ICommand), typeof(ListViewSelectedItemBehavior));

    public ICommand Command
    {
        get { return (ICommand)GetValue(CommandProperty); }
        set { SetValue(CommandProperty, value); }
    }

    public ListView AssociatedObject { get; private set; }

    protected override void OnAttachedTo(ListView bindable)
    {
        base.OnAttachedTo(bindable);
        AssociatedObject = bindable;
        bindable.BindingContextChanged += OnBindingContextChanged;
        bindable.ItemSelected += OnListViewItemSelected;
    }

    protected override void OnDetachingFrom(ListView bindable)
    {
        base.OnDetachingFrom(bindable);
        bindable.BindingContextChanged -= OnBindingContextChanged;
        bindable.ItemSelected -= OnListViewItemSelected;
        AssociatedObject = null;
    }

    private void OnBindingContextChanged(object sender, EventArgs e)
    {
        OnBindingContextChanged();
    }

    private void OnListViewItemSelected(object sender, SelectedItemChangedEventArgs e)
    {
        if (Command == null)
            return;

        if (Command.CanExecute(e.SelectedItem))
            Command.Execute(e.SelectedItem);
    }

    protected override void OnBindingContextChanged()
    {
        base.OnBindingContextChanged();
        BindingContext = AssociatedObject.BindingContext;
    }
}

要将此添加到您的ListView只需添加一个行为:

<ListView x:Name="dataList" ItemsSource="{Binding routeLabels}"
          HasUnevenRows="True" Grid.Row="1" Grid.Column="0"        
          Grid.ColumnSpan="3">
    <ListView.Behaviors>
        <behaviors:ListViewSelectedItemBehavior Command="{Binding ItemSelectedCommand}" />
    </ListView.Behaviors>
</ListView>

在这种情况下ItemSelectedCommand,ViewModel中是一个Command对象.