web-dev-qa-db-ja.com

ビューモデルからListView項目タッププロパティへのバインド

Itemtappedプロパティを使用して、メニューページのイベントをListViewにバインドしようとしています。現在、アプリでMVVM（Xamarin form labs）フレームワークを使用しています。私が達成しようとしているのは、ユーザーがメニュー項目をタップすると、アプリが正しいビューに移動することです。

以下は、xamlコードです。

<ListView x:Name="list"
        ItemsSource="{Binding MenuItems}" 
        SelectedItem="{Binding SelectedItem}" 
        ItemTapped= SET-BINDING-HERE >
  <ListView.ItemTemplate>
    <DataTemplate>
      <ViewCell>
        <ViewCell.View>
          //setup template here
        </ViewCell.View>
      </ViewCell>
    </DataTemplate>
  </ListView.ItemTemplate> 
</ListView>

Itemtappedイベントをこの関数にバインドしたい：

public void NavigateTo(object sender, ItemTappedEventArgs args)
  {
      var test = args.Item as MenuModel;
      cPageTypes.GetByKey(test.CommandParameter)
                .SwitchRootPage(AIMCore.ViewModels.ElliottBaseViewModel.MasterPage);
      list.SelectedItem = null;
      AIMCore.ViewModels.BaseViewModel.MasterPage.IsPresented = false;
  }

現在、ビューのコードビハインドに関数を追加してItemTapped = 'NavigatTo'を設定すると、これを機能させることができますが、MVVMの概念に反するため、これは間違っているようです。私が本当にやりたいことは、ViewModelで同じ機能をイベントにバインドすることです。

<ListView x:Name="list"
        ItemsSource="{Binding MenuItems}" 
        SelectedItem="{Binding SelectedItem}" 
        ItemTapped= "{Binding NavigateTo}" > // this binding is to the ViewModel

ただし、これは機能していないか、正しく機能していません。この方法で実装しようとすると、コードでエラーが発生します。

Error： Xamarin.Forms.Xaml.XamlParseException：No ItemTappedのプロパティがXamarin.Forms.Xaml.BaseValueNode.SetPropertyValueに見つかりません

c#xamlmvvmxamarinxamarin.forms
16
Jared Reeves

同じアーキテクチャに従って、カスタムリストコントロールを作成し、コマンドを使用して1つのバインド可能なプロパティを作成しました。これは、以下のコードを使用してビューモデルでオーバーライドしました。

PCLのカスタムコントロール[.cs]ページ

using System;
using System.Windows.Input;
using Xamarin.Forms;


namespace YourNS {

    public class ListView : Xamarin.Forms.ListView {

        public static BindableProperty ItemClickCommandProperty = BindableProperty.Create<ListView, ICommand>(x => x.ItemClickCommand, null);


        public ListView() {
            this.ItemTapped += this.OnItemTapped;
        }


        public ICommand ItemClickCommand {
            get { return (ICommand)this.GetValue(ItemClickCommandProperty); }
            set { this.SetValue(ItemClickCommandProperty, value); }
        }


        private void OnItemTapped(object sender, ItemTappedEventArgs e) {
            if (e.Item != null && this.ItemClickCommand != null && this.ItemClickCommand.CanExecute(e)) {
                this.ItemClickCommand.Execute(e.Item);
                this.SelectedItem = null;
            }
        }
    }
}

私のXAMLページ

<ContentPage ...
             xmlns:local="clr-namespace:Samples.Views;Assembly=Your Assebly Name">

<local:ListView ItemClickCommand="{Binding Select}" 
        ItemsSource="{Binding List}">

そして私のビューモデルでは[この例では、ダイアログアクションシートのみを開いています

private Command<Signature> selectCmd;
        public Command<Signature> Select {
            get {
                this.selectCmd = this.selectCmd ?? new Command<Signature>(s => 
                    this.dialogs.ActionSheet(new ActionSheetConfig()
                        .Add("View", () => {
                            if (!this.fileViewer.Open(s.FilePath))
                                this.dialogs.Alert(String.Format("Could not open file {0}", s.FileName));
                        })
                        .Add("Cancel")
                    )
                );
                return this.selectCmd;
            }
        }
26
Nirav Mehta

または、添付された動作を使用できます

public static class ListViewAttachedBehavior
{
    public static readonly BindableProperty CommandProperty =
        BindableProperty.CreateAttached (
            "Command",
            typeof(ICommand),
            typeof(ListViewAttachedBehavior),
            null,
            propertyChanged:OnCommandChanged);

    static void OnCommandChanged (BindableObject view, object oldValue, object newValue)
    {
        var entry = view as ListView;
        if (entry == null) 
            return;

        entry.ItemTapped += (sender, e) => 
            {
                var command = (newValue as ICommand);
                if(command == null)
                    return;

                if(command.CanExecute(e.Item))
                {
                    command.Execute(e.Item);
                }

            };
    }
}

次に、それをリストビューで呼び出します

 <ListView
        RowHeight="70"
        x:Name="AcquaintanceListView"
        b:ListViewAttachedBehavior.Command="{Binding ItemSelectedCommand}"
        ItemsSource="{Binding Acquaintances}">
8
Chris Lamothe