Xamarin Forms XAML 上的 ListView ItemTapped/ItemSelected 命令綁定

Question

如何將我的 ViewModel（當前在 BindingContext 中）中的 ICommand object 綁定到 XAML 中 ListView 中的 ItemTapped 或 ItemSelected？

使用 Button 時這是一項簡單的任務，我只需設置 Command="MyViewModelCommand" 一切正常。

Answer 1

當您可以直接在ViewModel中直接獲取所選/點擊的對象時，我不確定您為什么需要在頁面中提供“項目選定”或“項目點擊”事件：

我認為你已經將listview與以下類型的代碼綁定在一起

<ListView ItemsSource="{Binding PermitDetails}" 
SelectedItem="{Binding objItemSelected, Mode=TwoWay}" x:Name="lst" 
RowHeight="35" HorizontalOptions="FillAndExpand" 
VerticalOptions="Fill">

在您與頁面綁定的視圖模型中，您需要定義屬性objItemSelected如下面的代碼所示

private Permit _ItemSelected;
public Permit objItemSelected {
    get {
        return _ItemSelected;
    }
    set {
        if (_ItemSelected != value) {
            _ItemSelected = value;
            OnPropertyChanged ("ItemSelected");
        }
    }
}

如果要執行任何其他功能（如導航到詳細信息頁面），可以在執行OnPropertyChanged語句后從set屬性執行此操作。

希望這可以幫助！

Answer 2

我的場景是鍵盤，圖像是按鈕，當單擊一個按鈕時，相關字符將顯示在標簽中。

所以..

讓我們說你有跟隨控制（鍵1）：

<Image  x:Name="imgKey1"
        Source="key1.png"
        Aspect="AspectFit" />

並且您希望在輕觸圖像時從您的“viewModel”對象觸發命令。 我的“viewModel”具有以下屬性：

public ICommand AddCharCommand { protected set; get; }

在我的類（視圖模型）構造函數中我有：

  this.AddCharCommand = new Command<string>((key) =>
            {
                // Add the key to the input string.
                this.InputString += key;
            });

“InputString”是一個字符串屬性......

因此，為了綁定視圖和模式，我正在做以下事情：

  imgKey1.GestureRecognizers.Add(new TapGestureRecognizer
        {
            Command = viewModel.AddCharCommand,
            CommandParameter = "1",
        });

我希望我幫助你，如果有人需要什么，我可以提供幫助; 我在這里......在那里。 JJ

在XAML 17-11-14

      <Image  Source="n1normal.png"
              Aspect="AspectFit" >
        <Image.GestureRecognizers>
          <TapGestureRecognizer
            Command="{Binding AddCharCommand}"
            CommandParameter ="1"/>
        </Image.GestureRecognizers>
      </Image>

//-OR-

        <Image Source="magnifyglass.png"
               Aspect="AspectFit"
               HorizontalOptions="End">
          <Image.GestureRecognizers>
            <TapGestureRecognizer Tapped="Search"/>
          </Image.GestureRecognizers>  
        </Image>

//And for the Search create in your ViewModel

 private void Search(object sender, EventArgs e)
 {
      //Your code here
 }

Answer 3

我曾經采用將選定項目綁定到視圖模型的方法，但這往往會導致過濾掉程序化更改與用戶操作之間的麻煩。 我個人最喜歡的是附屬物。

public static readonly BindableProperty ListItemTappedCommandProperty = BindableProperty.CreateAttached<AttachedProperties, ICommand>(
    staticgetter: o => (ICommand) o.GetValue(ListItemTappedCommandProperty), 
    defaultValue: default(ICommand),
    propertyChanged: (o, old, @new) =>
    {
        var lv = o as ListView;
        if (lv == null) return;

        lv.ItemTapped -= ListView_ItemTapped;
        lv.ItemTapped += ListView_ItemTapped;
    });

private static void ListView_ItemTapped(object sender, object item)
{
    var lv = sender as ListView;

    var command = (ICommand) lv?.GetValue(ListItemTappedCommandProperty);
    if (command == null) return;

    if (command.CanExecute(item))
        command.Execute(item);
}

...然后在ListView上設置：

controls:AttachedProperties.ListItemTappedCommand="{Binding ItemSelectedCommand}"

有可能甚至可以將其擴展為采用事件名稱並更普遍地應用，但這是另一次的練習。

Answer 4

這是使用 Xamarin 社區工具包更新的答案

<ContentPage
   xmlns="http://xamarin.com/schemas/2014/forms"
   xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
   xmlns:xct="http://xamarin.com/schemas/2020/toolkit" 
   >

<ListView  .... >
<ListView.Behaviors>
    <xct:EventToCommandBehavior
        EventName="ItemSelected"
        Command="{Binding MyCustomCommand}" />
</ListView.Behaviors>

</ListView >

參考https://learn.microsoft.com/en-us/xamarin/community-toolkit/behaviors/eventtocommandbehavior

Answer 5

為什么不將listview的selectedItem屬性綁定到viewModel屬性（比如說'selectedItem'屬性）; 然后在viewModel中'selectedItem'屬性的setter上執行命令。

Answer 6

這是一個老問題，也許這是一個相當新的開發，但您可以使用任何控件上的行為將事件轉換為ICommand。

一個例子...

<ListView ItemsSource="{Binding Tags}"
            SelectedItem="{Binding SelectedTag}">
    <ListView.Behaviors>
        <behaviors:EventHandlerBehavior EventName="ItemSelected">
            <behaviors:InvokeCommandAction Command="{Binding SelectedTagChanged}" />
        </behaviors:EventHandlerBehavior>
    </ListView.Behaviors>
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <ContentView Padding="8">
                    <Label Text="{Binding DisplayValue}" />
                </ContentView>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

在此示例中，ItemSelected事件將映射到視圖模型中的SelectedTagChanged命令，該命令如下所示...

public Command SelectedTagChanged
{
    get
    {
        return new Command(() =>
        {
            // do something
        });
    }
}