You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

在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

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.15 03:36:24