MvxBind点击按钮在MvxGridView中不起作用

Question

我对Xamarin的Android应用有问题。我有MenuCardView.axml，MvxGridView在哪里，ItemSource在哪里，但我不想在这里使用ItemClick。我要用MvxBind点击按钮上的MvxItemTemplate键。但是Click在这里不管用。

这里是我的MenuCardView.axml:

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:local="http://schemas.android.com/apk/res-auto"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:stretchColumns="0">
    <TableRow>
         <LinearLayout
                android:orientation="vertical"
                android:layout_weight="1"
                android:background="@color/white"
                android:layout_width="match_parent"
                android:layout_height="match_parent">
                <MvxGridView
                    android:id="@+id/menuCardDetailGrid"
                    android:layout_weight="1"
                    android:background="@android:color/transparent"
                    local:MvxBind="ItemsSource MenuItems"
                    local:MvxItemTemplate="@layout/menucarddetailitemview"
                    android:numColumns="1"
                    android:verticalSpacing="5dp"
                    android:horizontalSpacing="5dp"
                    android:stretchMode="columnWidth"
                    android:gravity="center"
                    android:divider="@android:color/transparent"
                    android:dividerHeight="0dp"
                    android:choiceMode="singleChoice"
                    android:listSelector="@drawable/list_color_selector"
                    android:layout_width="match_parent"
                    android:layout_height="300dp"
                    android:layout_marginBottom="25dp" />
         </LinearLayout>
    </TableRow>
</TableLayout>

这里是我的MenuCardDetailItemView.axml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:local="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_weight="1"
    android:layout_height="match_parent"
    android:background="@android:color/white"
    android:orientation="vertical"
    android:gravity="center_horizontal"
    android:id="@+id/menucarddetailitemview">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_gravity="fill"
        android:orientation="horizontal">
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_marginLeft="10dp">
            <TextView
                local:MvxBind="Text Name"
                android:textSize="15dp"
                android:layout_height="wrap_content"
                android:textColor="@android:color/black"
                android:layout_gravity="center_vertical"
                android:lines="2"
                android:maxLines="2"
                android:layout_width="185dp" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="60dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center_horizontal">
            <TextView
                local:MvxBind="Text Price"
                android:textSize="15dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@android:color/black"
                android:layout_gravity="center_vertical" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="50dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center_horizontal"
            android:layout_marginRight="10dp"
            android:layout_marginLeft="10dp">
            <Button
                local:MvxBind="Click MenuItemClickCommand"
                android:background="@color/red"
                android:text="CLICK"
                android:layout_width="60dp"
                android:layout_height="20dp"
                android:id="@+id/buttonMenuDetail"
                android:layout_gravity="center_vertical"
                android:textSize="13dp"
                android:textColor="@color/white"/>
        </LinearLayout>
    </LinearLayout>
    </LinearLayout>
</LinearLayout>

，这是我的MenuCardViewModel.cs:

public class MenuCardViewModel : BaseViewModel
{
    public MenuCardViewModel(IMvxMessenger messenger) : base(messenger)
    {
    }

    public void Init(Menu menu)
    {
        Header = menu.Header;
        InitializeMenuItems(menu);
    }

    private void InitializeMenuItems(Menu menu)
    {
        if (menu.MenuItemsList == null)
        {
            var offline = Mvx.Resolve<IOfflineContent>();
            var loadedMenu = offline.GetMenuDetailFromApi(menu.Id);
            MenuItems = loadedMenu.MenuItemsList;
        }
        else
        {
            MenuItems = menu.MenuItemsList;
        }
    }

    private string _header;
    public string Header
    {
        get { return _header; }
        set
        {
            _header = value;
            RaisePropertyChanged(() => Header);
        }
    }

    private List<MenuItem> _menuItems;
    public List<MenuItem> MenuItems
    {
        get { return _menuItems; }
        set
        {
            _menuItems = value;
            RaisePropertyChanged(() => MenuItems);
        }
    }

    private ICommand _menuItemClickCommand;
    public ICommand MenuItemClickCommand
    {
        get
        {
            _menuItemClickCommand = _menuItemClickCommand ?? new MvxCommand(DoMenuItemClickCommand);
            return _menuItemClickCommand;
        }
    }

    private void DoMenuItemClickCommand()
    {
        // code here...
    }
}

我要把MenuItemClickCommand绑定在MenuCardVideDetailView的按钮上。一些技巧如何解决这个问题？

更新：

我试过了，但我不知道这是否是一个好的解决方案：

    public class MenuCardViewModel : BaseViewModel
    {
        public MenuCardViewModel(IMvxMessenger messenger) : base(messenger)
        {
        }

        public void Init(Menu menu)
        {
            Header = menu.Header;
            InitializeMenuItems(menu);
        }

        private void InitializeMenuItems(Menu menu)
        {
            if (menu.MenuItemsList == null)
            {
                var offline = Mvx.Resolve<IOfflineContent>();
                var loadedMenu = offline.GetMenuDetailFromApi(menu.Id);
                //MenuItems = loadedMenu.MenuItemsList;
                MenuItems = new List<MenuItemHolder>();

                foreach(var item in loadedMenu.MenuItemsList)
                {
                    MenuItems.Add(new MenuItemHolder(item, this));
                }

            }
            else
            {
                //MenuItems = menu.MenuItemsList;
            }

        }

        private string _header;
        public string Header
        {
            get { return _header; }
            set
            {
                _header = value;
                RaisePropertyChanged(() => Header);
            }
        }

        private List<MenuItemHolder> _menuItems;
        public List<MenuItemHolder> MenuItems
        {
            get { return _menuItems; }
            set
            {
                _menuItems = value;
                RaisePropertyChanged(() => MenuItems);
            }
        }
    }

    public class MenuItemHolder
    {
        MenuCardViewModel _parent;

        public int Id { get; set; }

        private string _name;
        public string Name
        {
            get { return _name; }
            set
            {
                _name = value;
            }
        }

        private string _price;
        public string Price
        {
            get { return _price; }
            set
            {
                _price = value;
            }
        }

        public MenuItemHolder(MenuItem item, MenuCardViewModel parent)
        {
            _parent = parent;
            Id = item.Id;
            Name = item.Name;
            Price = item.Price;
        }

        private ICommand _menuItemClickCommand;
        public ICommand MenuItemClickCommand
        {
            get
            {
                _menuItemClickCommand = _menuItemClickCommand ?? new MvxCommand(DoMenuItemClickCommand);
                return _menuItemClickCommand;
            }
        }

        private void DoMenuItemClickCommand()
        {
            var item = this;
            //here I can use BaseViewModel
            _parent.Credit = 1337;
            _parent.Bonus = 68;
        }
    }
}

Answer 1

MvxGridView ItemsSource绑定到MenuItems，这是一个List<MenuItem>，因此每个MvxItemTemplate都绑定到MenuItem。如果要将Button绑定到MenuItemClickCommand，则需要将该命令移动到MenuItem类。

您无法访问子级中的父级DataContext。您可以实现一些方法，您可以使用MvvmCross Messenger plugin进行通信，并从父级请求对象。或您可以将父级(MenuCardViewModel)封装在MenuItem中，例如：

public class MenuItem 
{
  MenuCardViewModel parent;
  //// pass parent to menuItem
  public MenuItem(MenuCardViewModel parent)
  {
    this.parent=parent;
  }

   public ICommand MenuItemClickCommand
   {
       get
        {
            return MvxCommand(() -> this.parent.DoMenuItemClickCommand(this));
        }
   }
}

在MenuCardViewModel中

public class MenuCardViewModel
{
  ....
 public MenuCardViewModel(MenuItem menu)
 {
    /// do something
 }
}