Binding a Grouped Table View using Xamarin.iOS and MvvmCross

Question

I am trying to create a Grouped Table View using Xamarin.iOS and MvvmCross. But can't get the binding part right, my ItemSource is always null and RaisePropertyChanged in the ViewModel won't trigger the the setter of my ItemsSource. I have looked at the conference sample Stuart refers to in Creating UITable with section using Mono touch and slodge mvvmcross , but I am currently stuck where I am.

This is the TableSource I am using:

public class VoiceMessagesTableSource : MvxTableViewSource
{
    private List<VoiceMessagesTableItemGroup> _itemsSource;

    private const string _cellNibName = "MessagesTableCell";
    private static readonly NSString _cellIdentifier = new NSString(_cellNibName);

    public VoiceMessagesTableSource(UITableView tableView) : base(tableView)
    {
        tableView.RegisterNibForCellReuse(UINib.FromName(_cellNibName, NSBundle.MainBundle), _cellIdentifier);
    }

    public List<VoiceMessagesTableItemGroup> ItemsSource
    {
        get
        {
            return _itemsSource;
        }

        set
        {
            _itemsSource = value;
            ReloadTableData();
        }
    }

    public override int NumberOfSections(UITableView tableView)
    {
        if (_itemsSource == null)
        {
            return 0;
        }

        return _itemsSource.Count;
    }

    public override int RowsInSection(UITableView tableview, int section)
    {
        if (_itemsSource == null)
        {
            return 0;
        }

        return _itemsSource[section].Count;
    }

    protected override UITableViewCell GetOrCreateCellFor(UITableView tableView, NSIndexPath indexPath, object item)
    {
        return (UITableViewCell)TableView.DequeueReusableCell(_cellIdentifier, indexPath);
    }

    protected override object GetItemAt(NSIndexPath indexPath)
    {
        if (_itemsSource == null)
        {
            return null;
        }

        return _itemsSource[indexPath.Section][indexPath.Row];
    }
}

This is how I bind it in the view:

private void BindMessagesTable()
{
    var data_source = new VoiceMessagesTableSource(MessagesTable);

    MvxFluentBindingDescriptionSet<MessagesView, MessagesViewModel> set = this.CreateBindingSet<MessagesView, MessagesViewModel>();
    //set.Bind(data_source).To(viewModel => viewModel.GroupedVoiceMessages);
    set.Bind(data_source.ItemsSource).To(viewModel => viewModel.GroupedVoiceMessages);
    set.Bind(data_source).For(s => s.SelectionChangedCommand).To(viewModel => viewModel.DisplayVoiceMessageCommand);
    set.Apply();

    MessagesTable.Source = data_source;
    MessagesTable.ReloadData();
}

And this is the ItemGroup class I am using as my items source:

public class VoiceMessagesTableItemGroup : List<MessageEntryViewModel>
{
    public VoiceMessagesTableItemGroup(string key, IEnumerable<MessageEntryViewModel> items) : base(items)
    {
        Key = key;
    }

    public string Key { get; set; }
}

Answer 1

I've not analysed all the code in the question, but one issue I can see is that it looks like you are trying to Bind the wrong target.

When you write:

set.Bind(foo).To(viewModel => viewModel.Bar);

then this tries to bind the default binding property on foo to the ViewModel's Bar property.

When you write:

set.Bind(foo).For(view => view.Zippy).To(viewModel => viewModel.Bar);

then this tries to bind the Zippy property on foo to the ViewModel's Bar property.

So, your line:

set.Bind(data_source.ItemsSource).To(viewModel => viewModel.GroupedVoiceMessages);

tries to bind an unknown property on the null ItemsSource to GroupedVoiceMessages

This obviously won't work - and there should be some warnings shown about the null in the trace.

Instead try:

set.Bind(data_source).For(v => v.ItemsSource).To(viewModel => viewModel.GroupedVoiceMessages);