Create custom ICollectionView object for UWP XAML that implements grouping

Question

I need something like this: AdvancedCollectionViewControl which is from the UWP community toolkit and I can get it all working for a custom ICollectionView except they don't have Grouping implemented.

I need an ICollectionView that does Filtering, Sorting and Grouping so I can Bind it to a UWP ListView that does grouping and has a SemanticZoom control. This does not exist in UWP

How could I take the UWP toolkit example and get the "public IObservableVector CollectionGroups property working so it will do grouping? I would just use CollectionViewSource except I need the added sorting and filtering capabilities.

The documentation says to use the ICollectionViewGroup interface on items that will be stored in the IObservableVector CollectionGroups property; I can't find any example or how to implement this. Here is all the documentation Microsoft has: https://learn.microsoft.com/en-us/uwp/api/Windows.UI.Xaml.Data.ICollectionViewGroup?view=winrt-18362

Put simply as I can, I need an example on how to implement the ICollectionView interface with grouping. If you don't know how to do this then please, don't comment.

Answer 1

Taking the source code from the UWP Toolkit AdvancedCollectionObject I added the grouping based on a lot of trial and error. (couldn't find anything online how to do it) and it seems to be working. I don't know if I did it correctly but here is what I had to do:

For the IObservableVector GroupItems property I had to make my own List and IVectorChangedEventArgs:

  internal class VectorChangedEventArgs : IVectorChangedEventArgs
    {
        public VectorChangedEventArgs(CollectionChange cc, int index = -1, object item = null)
        {
            CollectionChange = cc;
            Index = (uint)index;
        }

        public CollectionChange CollectionChange { get; }

        public uint Index { get; }
    }

public class GroupList<T> : Collection<T>, IObservableVector<T>
    {
        public event VectorChangedEventHandler<T> VectorChanged;

        public GroupList() : base()
        {
        }

        public GroupList(IList<T> list) : base(list)
        {
        }

        protected override void ClearItems()
        {
            base.ClearItems();
            this.OnVectorChanged(new VectorChangedEventArgs(CollectionChange.Reset, 0));
        }

        protected override void InsertItem(int index, T item)
        {
            base.InsertItem(index, item);
            this.OnVectorChanged(new VectorChangedEventArgs(CollectionChange.ItemInserted, index));
        }

        protected override void RemoveItem(int index)
        {
            base.RemoveItem(index);
            this.OnVectorChanged(new VectorChangedEventArgs(CollectionChange.ItemRemoved, index));
        }

        protected override void SetItem(int index, T item)
        {
            base.SetItem(index, item);
            this.OnVectorChanged(new VectorChangedEventArgs(CollectionChange.ItemChanged, index));
        }

        private void OnVectorChanged(IVectorChangedEventArgs e)
        {
            VectorChanged?.Invoke(this, e);
        }
    }

And according to Microsoft, you should have the group items inherit ICollectionViewGroup:

public class GroupItem : DependencyObject, ICollectionViewGroup
    {
        private IGrouping<object, object> _group;

        public GroupItem(IGrouping<object, object> group)
        {
            _group = group;
        }

        public object Group => _group;

        public IObservableVector<object> GroupItems => new GroupList<object>(_group.ToList());
    }

Now when the source changes to a collection that is using Linq.IGrouping it knows to create the GroupList of GroupItems and UWP ListView and Semantic controls work just fine. Please let me know if you have anything to add to this or corections