在ListView模板MvvMCross中单击绑定按钮

本文关键字:单击 绑定 按钮 MvvMCross ListView 模板 | 更新日期: 2023-09-27 18:26:31

我有一个列表视图,其中有一个包含按钮的模板。当点击按钮时,我希望触发一个事件并返回listview行的值,这样我就可以使用它将其添加到数据库中。我的问题是,我不知道如何将我的buttonevent绑定到itemtemplate。我尝试了几种方法,但到目前为止都没有成功。

我的列表视图:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:local="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <Mvx.MvxListView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:divider="#aeaeae"
        android:dividerHeight="1px"
        local:MvxBind="ItemsSource MenuCollection; ItemClick OrderBtnClick"        
        local:MvxItemTemplate="@layout/listitem_menuitem" />
</LinearLayout>

我的项目模板:

<?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:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <Mvx.MvxImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_margin="10dp"
        local:MvxBind="ImageUrl ImageUrl" />
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1">
        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="30dp"
            android:textSize="40dp"
            local:MvxBind="Text Name" />
        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="50dp"
            android:textSize="20dp"
            local:MvxBind="Text ShortDescription" />
    </LinearLayout>
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:minWidth="25px"
        android:minHeight="25px">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="70dip"
            android:layout_alignParentRight="true"
            android:layout_marginTop="20dip"
            android:layout_marginRight="20dip"
            android:layout_gravity="right|center_vertical"
            android:text="Bestel"            
            android:id="@+id/button1" />
    </LinearLayout>
</LinearLayout>

我的视图模型:

public class ListPresentationViewModel: MvxViewModel    
    {    
        private readonly ISQLService _sqlSvc;   
        public ListPresentationViewModel (ISQLService sqlService)    
        {    
            _sqlSvc = sqlService;    
            MenuCollection = _sqlSvc.MenuItemGetAll ();    
        }   

        private List<MenuItem> _menuCollection = new List<MenuItem> ();    
        public List<MenuItem> MenuCollection {    
            get{ return _menuCollection;}    
            set {    
                _menuCollection = value;
                RaisePropertyChanged (() => MenuCollection);    
            }    
        }    

        private IMvxCommand _orderBtnClick;    
        public IMvxCommand OrderBtnClick{    
            get{    
                _orderBtnClick = _orderBtnClick ?? new MvxCommand(btnClick);
                return _orderBtnClick;}    
        }  

        private void btnClick()    
        {    
            //Do Something    
        }
    }

我在模板和列表视图中的按钮上放置了local:MvxBind="Click OrderBtClick"。当我从项目模板中删除按钮时,ItemClick似乎可以工作,但这不是我想要的。我希望按钮触发事件。有人能给我指正确的方向吗?


更新

我试过了斯图亚特旅馆张贴在这里的第二个建议。这是我的包装类:

public class MenuItemWrap
    {
        MenuItem _mnuItem;
        ListPresentationViewModel _parent;

        public MenuItemWrap ()
        {           
        }
        public MenuItemWrap (MenuItem item, ListPresentationViewModel parent)
        {
            _mnuItem = item;
            _parent = parent;
        }
        public IMvxCommand Click {
            get {
                return new MvxRelayCommand (() => _parent.btnClick(WrapConverter.ConvertToWrapMenuItem(_mnuItem, _parent)));
            }
        }
        public MenuItem Item{ get { return _mnuItem; } }
    }

我的视图模型:

public class ListPresentationViewModel: MvxViewModel
    {
        private readonly ISQLService _sqlSvc;
        public ListPresentationViewModel (ISQLService sqlService)
        {
            _sqlSvc = sqlService;
            MenuCollection = WrapConverter.ConvertToWrapperClass(_sqlSvc.MenuItemGetAll (), this);
        }
        private List<MenuItemWrap> _menuCollection = new List<MenuItemWrap> ();
        public List<MenuItemWrap> MenuCollection {
            get{ return _menuCollection;}
            set {
                _menuCollection = value;
                RaisePropertyChanged (() => MenuCollection);
            }
        }
        private IMvxCommand _orderBtnClick;
        public IMvxCommand OrderBtnClick{
            get{
                _orderBtnClick = _orderBtnClick ?? new MvxCommand<MenuItemWrap> (btnClick);
                return _orderBtnClick;
            }
        }
        public void btnClick(MenuItemWrap item)
        {
            MenuCollection.Clear ();
        }
    }

这是我的模板

<?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:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <Mvx.MvxImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_margin="10dp"
        local:MvxBind="ImageUrl Item.ImageUrl" />
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1">
        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="30dp"
            android:textSize="40dp"
            local:MvxBind="Text Item.Name" />
        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="50dp"
            android:textSize="20dp"
            local:MvxBind="Text Item.ShortDescription" />
    </LinearLayout>
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:minWidth="25px"
        android:minHeight="25px">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="70dip"
            android:layout_alignParentRight="true"
            android:layout_marginTop="20dip"
            android:layout_marginRight="20dip"
            android:layout_gravity="right|center_vertical"
            android:text="Bestel"
            local:MvxBind="Click btnClick.OrderBtnClick"
            android:id="@+id/button1" />
    </LinearLayout>
</LinearLayout>

我的列表视图运行得很好。所有属性都正确绑定,我可以看到名称、简短描述和图像。不起作用的是按钮点击。在我的应用程序输出中,我收到一个错误,说:MvxBind:警告:76.06无法绑定:在MenuItemWrap上找不到源属性源Circyly.MvvvmCross.Binding.Parse.PropertyPath.PropertyTokens.MvxPropertyNamePropertyToken

我试过几种方法来解决它,但都没有成功。我要提到的是,我在MvvvMCross程序集中没有找到RelayCommand类,所以我将代码从这里复制粘贴到我的项目中。

在ListView模板MvvMCross中单击绑定按钮

我找到了解决方案。问题出在点击绑定上。您应该只引用包装类中的操作,而不是同时引用这两个操作。这是我的包装类&listview项目模板。

项目模板:

 <LinearLayout
            android:orientation="vertical"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:minWidth="25px"
            android:minHeight="25px">
            <Button
                android:layout_width="wrap_content"
                android:layout_height="70dip"
                android:layout_alignParentRight="true"
                android:layout_marginTop="20dip"
                android:layout_marginRight="20dip"
                android:layout_gravity="right|center_vertical"
                android:text="Bestel"
                local:MvxBind="Click OrderClick" />
        </LinearLayout>

包装类别:

public class MenuItemWrap
    {
        MenuItem _mnuItem;
        ListPresentationViewModel _parent;      
        public MenuItemWrap (MenuItem item, ListPresentationViewModel parent)
        {
            _mnuItem = item;
            _parent = parent;
        }

        public IMvxCommand OrderClick {
            get {
                return new MvxCommand (() => _parent.btnClick (_mnuItem));
            }
        }
        public MenuItem Item{ get { return _mnuItem; } }    
    }

我的视图模型:

public class ListPresentationViewModel: MvxViewModel 
{
    private readonly ISQLService _sqlSvc;
    public ListPresentationViewModel (ISQLService sqlService)
    {
        _sqlSvc = sqlService;
        MenuCollection = WrapConverter.ConvertToWrapperClass (_sqlSvc.MenuItemGetAll(), this);
    }
    private int _catId;
    public int CategorieId { 
        get{ return _catId;} 
        set{ 
            _catId = value;
            ChangeMenuCollection ();
        }
    }
    private void ChangeMenuCollection()
    {
        MenuCollection = WrapConverter.ConvertToWrapperClass (_sqlSvc.MenuItemByCategorie (_catId), this);
    }
    private List<MenuItemWrap> _menuCollection = new List<MenuItemWrap> ();
    public List<MenuItemWrap> MenuCollection {
        get{ return _menuCollection;}
        set {
            _menuCollection = value;
            RaisePropertyChanged (() => MenuCollection);
        }
    }
    private IMvxCommand _orderBtnClick;
    public IMvxCommand OrderBtnClick {
        get {
            _orderBtnClick = _orderBtnClick ?? new MvxCommand<MenuItem> (btnClick);
            return _orderBtnClick;
        }
    }
    public void btnClick (MenuItem item)
    {
        //Do Something
    }
}       
  1. vNext中的MvxRelayCommand在v3中被缩短为MvxCommand——只是为了节省键入
  2. 最后一个问题似乎是您正在绑定Click btnClick.OrderBtnClick,但您的MenuItemWrap类没有btnClick属性,所以您真的想绑定Click Click