在Xamarin iOS中基于MVVMCross自定义TableViewCell及实现行跳转
嘿,你已经在MVVMCross里把TableView的数据展示搞定了,接下来要实现自定义Cell加accessory和选中跳转,咱们一步步来:
一、自定义TableViewCell并添加Accessory
首先咱们需要创建一个自定义的MvxTableViewCell子类,用来控制accessory的显示,两种方式可选:固定显示或者通过ViewModel绑定动态控制。
1. 创建自定义Cell类
先新建一个SchoolTableViewCell(可以用XIB或者Storyboard设计布局,也可以纯代码实现):
public partial class SchoolTableViewCell : MvxTableViewCell { // 定义Cell的复用标识和Nib引用 public static readonly NSString ReuseIdentifier = new NSString("SchoolTableViewCell"); public static readonly UINib Nib = UINib.FromName("SchoolTableViewCell", NSBundle.MainBundle); protected SchoolTableViewCell(IntPtr handle) : base(handle) { // 方式1:固定显示accessory(比如箭头),直接在这里设置 Accessory = UITableViewCellAccessory.DisclosureIndicator; } // 方式2:如果需要通过ViewModel动态控制accessory,添加可绑定属性 public UITableViewCellAccessory CellAccessory { get => Accessory; set => Accessory = value; } }
2. 在ViewController中注册Cell并配置Source
修改你现有的ViewDidLoad代码,注册自定义Cell,然后更新MvxStandardTableViewSource的配置:
public override void ViewDidLoad() { base.ViewDidLoad(); this.NavigationController.SetNavigationBarHidden(true,true); // 先注册自定义Cell tblSchoolSelection.RegisterNibForCellReuse(SchoolTableViewCell.Nib, SchoolTableViewCell.ReuseIdentifier); // 配置MvxStandardTableViewSource,指定自定义Cell和绑定规则 // 如果用固定accessory,只绑定TitleText即可;如果是动态绑定,加上CellAccessory的绑定 var source = new MvxStandardTableViewSource(tblSchoolSelection, SchoolTableViewCell.ReuseIdentifier, "TitleText Name; CellAccessory AccessoryType"); // 假设你的Item模型有AccessoryType属性 // 绑定数据源和选中命令 this.CreateBinding(source).To<SchoolSelectionViewModel>(vm => vm.Items).Apply(); this.CreateBinding(source).For(s => s.SelectionChangedCommand).To<SchoolSelectionViewModel>(vm => vm.ItemSelectedCommand).Apply(); tblSchoolSelection.Source = source; tblSchoolSelection.ReloadData(); }
二、实现选中行跳转至下一界面
你已经绑定了SelectionChangedCommand到ViewModel的ItemSelectedCommand,接下来只需要在ViewModel里实现这个命令,用MVVMCross的导航服务完成跳转即可。
1. 在ViewModel中实现选中命令和导航逻辑
public class SchoolSelectionViewModel : MvxViewModel { private readonly IMvxNavigationService _navigationService; // 你的数据源 public ObservableCollection<SchoolItem> Items { get; set; } // 选中命令 public ICommand ItemSelectedCommand { get; } // 构造函数注入导航服务 public SchoolSelectionViewModel(IMvxNavigationService navigationService) { _navigationService = navigationService; Items = new ObservableCollection<SchoolItem>(/* 初始化你的数据 */); // 初始化选中命令,接收选中的Item作为参数 ItemSelectedCommand = new MvxCommand<SchoolItem>(async selectedItem => await NavigateToDetailPage(selectedItem)); } // 跳转逻辑 private async Task NavigateToDetailPage(SchoolItem selectedItem) { // 跳转到目标ViewModel(比如SchoolDetailViewModel),并传递选中的Item作为参数 await _navigationService.Navigate<SchoolDetailViewModel, SchoolItem>(selectedItem); // 如果不需要传参,直接用:await _navigationService.Navigate<SchoolDetailViewModel>(); } }
2. 配置目标ViewModel接收参数
如果需要传递选中的Item给下一个页面,目标ViewModel要实现IMvxViewModel<T>接口:
public class SchoolDetailViewModel : MvxViewModel<SchoolItem> { public SchoolItem SelectedSchool { get; private set; } // 接收参数的方法 public override void Prepare(SchoolItem parameter) { SelectedSchool = parameter; // 这里可以用参数初始化页面数据 } }
3. 确保导航服务已注册
在你的App.cs里要确保导航服务和ViewModel都正确注册:
public class App : MvxApplication { public override void Initialize() { // 设置启动页面 RegisterNavigationServiceAppStart<SchoolSelectionViewModel>(); // 注册所有ViewModel为单例 CreatableTypes() .EndingWith("ViewModel") .AsInterfaces() .RegisterAsLazySingleton(); } }
额外小提示
- 选中行后记得取消选中状态,如果用
MvxStandardTableViewSource,它已经帮你处理了这个逻辑;如果是自定义Source,需要在RowSelected方法里加tableView.DeselectRow(indexPath, true);。 - 如果不想用
MvxStandardTableViewSource,也可以自己写一个继承MvxTableViewSource的自定义Source,重写GetOrCreateCellFor和RowSelected方法,逻辑更灵活。
内容的提问来源于stack exchange,提问作者pankaj
相关产品推荐
相关产品推荐

