# ObservableCollections ObservableCollections is a high performance observable collections(`ObservableList`, `ObservableDictionary`, `ObservableHashSet`, `ObservableQueue`, `ObservableStack`, `ObservableRingBuffer`, `ObservableFixedSizeRingBuffer`) with synchronized views and Observe Extension for [R3](https://github.com/Cysharp/R3). .NET has [`ObservableCollection`](https://docs.microsoft.com/en-us/dotnet/api/system.collections.objectmodel.observablecollection-1), however it has many lacks of features. It based `INotifyCollectionChanged`, `NotifyCollectionChangedEventHandler` and `NotifyCollectionChangedEventArgs`. There are no generics so everything boxed, allocate memory every time. Also `NotifyCollectionChangedEventArgs` holds all values to `IList` even if it is single value, this also causes allocations. `ObservableCollection` has no Range feature so a lot of wastage occurs when adding multiple values, because it is a single value notification. Also, it is not thread-safe is hard to do linkage with the notifier. ObservableCollections introduces there generics version, `NotifyCollectionChangedEventHandler` and `NotifyCollectionChangedEventArgs`, it using latest C# features(`in`, `readonly ref struct`, `ReadOnlySpan`). Also, Sort and Reverse will now be notified. ```csharp public delegate void NotifyCollectionChangedEventHandler(in NotifyCollectionChangedEventArgs e); public readonly ref struct NotifyCollectionChangedEventArgs { public readonly NotifyCollectionChangedAction Action; public readonly bool IsSingleItem; public readonly T NewItem; public readonly T OldItem; public readonly ReadOnlySpan NewItems; public readonly ReadOnlySpan OldItems; public readonly int NewStartingIndex; public readonly int OldStartingIndex; public readonly SortOperation SortOperation; } ``` Also, use the interface `IObservableCollection` instead of `INotifyCollectionChanged`. This is guaranteed to be thread-safe and can produce a View that is fully synchronized with the collection. ```csharp public interface IObservableCollection : IReadOnlyCollection { event NotifyCollectionChangedEventHandler? CollectionChanged; object SyncRoot { get; } ISynchronizedView CreateView(Func transform); } ``` SynchronizedView helps to separate between Model and View (ViewModel). We will use ObservableCollections as the Model and generate SynchronizedView as the View (ViewModel). This architecture can be applied not only to WPF, but also to Blazor, Unity, etc. ![image](https://user-images.githubusercontent.com/46207/131979264-2463403b-0fba-474b-8f49-277c2abe1b05.png) The View retains the transformed values. The transform function is called only once during Add, so costly objects that are linked can also be instantiated. Additionally, it has a feature to dynamically show or hide values using filters. Observable Collections themselves do not implement `INotifyCollectionChanged`, so they cannot be bound on XAML platforms and the like. However, they can be converted to collections that implement `INotifyCollectionChanged` using `ToNotifyCollectionChanged()`, making them suitable for binding. ![image](https://github.com/user-attachments/assets/b5590bb8-16d6-4f9c-be07-1288a6801e68) ObservableCollections has not just a simple list, there are many more data structures. `ObservableList`, `ObservableDictionary`, `ObservableHashSet`, `ObservableQueue`, `ObservableStack`, `ObservableRingBuffer`, `ObservableFixedSizeRingBuffer`. `RingBuffer`, especially `FixedSizeRingBuffer`, can be achieved with efficient performance when there is rotation (e.g., displaying up to 1000 logs, where old ones are deleted when new ones are added). Of course, the AddRange allows for efficient batch processing of large numbers of additions. If you want to handle each change event with Rx, you can monitor it with the following method by combining it with [R3](https://github.com/Cysharp/R3): ```csharp Observable> IObservableCollection.ObserveChanged() Observable> IObservableCollection.ObserveAdd() Observable> IObservableCollection.ObserveRemove() Observable> IObservableCollection.ObserveReplace() Observable> IObservableCollection.ObserveMove() Observable> IObservableCollection.ObserveReset() Observable IObservableCollection.ObserveClear() Observable<(int Index, int Count)> IObservableCollection.ObserveReverse() Observable<(int Index, int Count, IComparer? Comparer)> IObservableCollection.ObserveSort() Observable IObservableCollection.ObserveCountChanged() ``` Getting Started --- For .NET, use NuGet. For Unity, please read [Unity](https://github.com/Cysharp/ObservableCollections/raw/master/#unity) section. > dotnet add package [ObservableCollections](https://www.nuget.org/packages/ObservableCollections) create new `ObservableList`, `ObservableDictionary`, `ObservableHashSet`, `ObservableQueue`, `ObservableStack`, `ObservableRingBuffer`, `ObservableFixedSizeRingBuffer`. ```csharp // Basic sample, use like ObservableCollection. // CollectionChanged observes all collection modification var list = new ObservableList(); list.CollectionChanged += List_CollectionChanged; list.Add(10); list.Add(20); list.AddRange(new[] { 10, 20, 30 }); static void List_CollectionChanged(in NotifyCollectionChangedEventArgs e) { switch (e.Action) { case NotifyCollectionChangedAction.Add: if (e.IsSingleItem) { Console.WriteLine(e.NewItem); } else { foreach (var item in e.NewItems) { Console.WriteLine(item); } } break; // Remove, Replace, Move, Reset default: break; } } ``` While it is possible to manually handle the `CollectionChanged` event as shown in the example above, you can also create a `SynchronizedView` as a collection that holds a separate synchronized value. ```csharp var list = new ObservableList(); var view = list.CreateView(x => x.ToString() + "$"); list.Add(10); list.Add(20); list.AddRange(new[] { 30, 40, 50 }); list[1] = 60; list.RemoveAt(3); foreach (var v in view) { // 10$, 60$, 30$, 50$ Console.WriteLine(v); } // Dispose view is unsubscribe collection changed event. view.Dispose(); ``` The view can modify the objects being enumerated by attaching a Filter. ```csharp var list = new ObservableList(); using var view = list.CreateView(x => x.ToString() + "$"); list.Add(1); list.Add(20); list.AddRange(new[] { 30, 31, 32 }); // attach filter view.AttachFilter(x => x % 2 == 0); foreach (var v in view) { // 20$, 30$, 32$ Console.WriteLine(v); } // attach other filter(removed previous filter) view.AttachFilter(x => x % 2 == 1); foreach (var v in view) { // 1$, 31$ Console.WriteLine(v); } // Count shows filtered length Console.WriteLine(view.Count); // 2 ``` The View only allows iteration and Count; it cannot be accessed via an indexer. If indexer access is required, you need to convert it using `ToViewList()`. Additionally, `ToNotifyCollectionChanged()` converts it to a synchronized view that implements `INotifyCollectionChanged`, which is necessary for XAML binding, in addition to providing indexer access. ```csharp // Queue <-> List Synchronization var queue = new ObservableQueue(); queue.Enqueue(1); queue.Enqueue(10); queue.Enqueue(100); queue.Enqueue(1000); queue.Enqueue(10000); using var view = queue.CreateView(x => x.ToString() + "$"); using var viewList = view.ToViewList(); Console.WriteLine(viewList[2]); // 100$ ``` In the case of ObservableList, calls to `Sort` and `Reverse` can also be synchronized with the view. ```csharp var list = new ObservableList { 1, 301, 20, 50001, 4000 }; using var view = list.CreateView(x => x.ToString() + "$"); view.AttachFilter(x => x % 2 == 0); foreach (var v in view) { // 20$, 4000$ Console.WriteLine(v); } // Reverse operations on the list will affect the view list.Reverse(); foreach (var v in view) { // 4000$, 20$ Console.WriteLine(v); } // remove filter view.ResetFilter(); // The reverse operation is also reflected in the values hidden by the filter foreach (var v in view) { // 4000$, 50001$, 20$, 301$, 1$ Console.WriteLine(v); } // also affect Sort Operations list.Sort(); foreach (var v in view) { // 1$, 20$, 301$, 4000$, 50001$ Console.WriteLine(v); } // you can use custom comparer list.Sort(new DescendantComaprer()); foreach (var v in view) { // 50001$, 4000$, 301$, 20$, 1$ Console.WriteLine(v); } class DescendantComaprer : IComparer { public int Compare(int x, int y) { return y.CompareTo(x); } } ``` Reactive Extensions with R3 --- Once the R3 extension package is installed, you can subscribe to `ObserveChanged`, `ObserveAdd`, `ObserveRemove`, `ObserveReplace`, `ObserveMove`, `ObserveReset`, `ObserveClear`, `ObserveReverse`, `ObserveSort`, `ObserveCounteChanged` events as Rx, allowing you to compose events individually. > dotnet add package [ObservableCollections.R3](https://www.nuget.org/packages/ObservableCollections.R3) ```csharp using R3; using ObservableCollections; var list = new ObservableList(); list.ObserveAdd() .Subscribe(x => { Console.WriteLine(x); }); list.Add(10); list.Add(20); list.AddRange(new[] { 10, 20, 30 }); ``` Note that `ObserveReset` is used to subscribe to Clear, Reverse, and Sort operations in bulk. In addition to `IObservableCollection`, there is also a subscription event for `ISynchronizedView`. In the case of View, `ObserveRejected` is also added. Since it is not supported by dotnet/reactive, please use the Rx library [R3](https://github.com/Cysharp/R3). Blazor --- In the case of Blazor, `StateHasChanged` is called and re-enumeration occurs in response to changes in the collection. It's advisable to use the `CollectionStateChanged` event for this purpose. ```csharp public partial class Index : IDisposable { ObservableList list; public ISynchronizedView ItemsView { get; set; } int count = 0; protected override void OnInitialized() { list = new ObservableList(); ItemsView = list.CreateView(x => x); ItemsView.CollectionStateChanged += action => { InvokeAsync(StateHasChanged); }; } void OnClick() { list.Add(count++); } public void Dispose() { ItemsView.Dispose(); } } // .razor, iterate view @page "/" @foreach (var item in ItemsView) { }

@item

``` WPF/Avalonia/WinUI (XAML based UI platforms) --- Because of data binding in WPF, it is important that the collection is Observable. ObservableCollections high-performance `IObservableCollection` cannot be bind to WPF. Call `ToNotifyCollectionChanged()` to convert it to `INotifyCollectionChanged`. Also, although ObservableCollections and Views are thread-safe, the WPF UI does not support change notifications from different threads. To`ToNotifyCollectionChanged(IColllectionEventDispatcher)` allows multi thread changed. ```csharp // WPF simple sample. ObservableList list; public NotifyCollectionChangedSynchronizedViewList ItemsView { get; set; } public MainWindow() { InitializeComponent(); this.DataContext = this; list = new ObservableList(); // for ui synchronization safety of viewmodel ItemsView = list.ToNotifyCollectionChanged(SynchronizationContextCollectionEventDispatcher.Current); // if collection is changed only from ui-thread, can use this overload // ItemsView = list.ToNotifyCollectionChanged(); } protected override void OnClosed(EventArgs e) { ItemsView.Dispose(); } ``` `SynchronizationContextCollectionEventDispatcher.Current` is default implementation of `IColllectionEventDispatcher`, it is used `SynchronizationContext.Current` for dispatche ui thread. You can create custom `ICollectionEventDispatcher` to use custom dispatcher object. For example use WPF Dispatcher: ```csharp public class WpfDispatcherCollection(Dispatcher dispatcher) : ICollectionEventDispatcher { public void Post(CollectionEventDispatcherEventArgs ev) { dispatcher.InvokeAsync(() => { // notify in dispatcher ev.Invoke(); }); } } ``` `ToNotifyCollectionChanged()` can also be called without going through a View. In this case, it's guaranteed that no filters will be applied, making it faster. If you want to apply filters, please generate a View before calling it. Additionally, `ObservableList` has a variation called `ToNotifyCollectionChangedSlim()`. This option doesn't generate a list for the View and shares the actual data, making it the fastest and most memory-efficient option. However, range operations such as `AddRange`, `InsertRange` and `RemoveRange` are not supported by WPF (or Avalonia), so they will throw runtime exceptions. Views and ToNotifyCollectionChanged are internally connected by events, so they need to be `Dispose` to release those connections. Standard Views are readonly. If you want to reflect the results of binding back to the original collection, use `CreateWritableView` to generate an `IWritableSynchronizedView`, and then use `ToWritableNotifyCollectionChanged` to create an `INotifyCollectionChanged` collection from it. ```csharp public delegate T WritableViewChangedEventHandler(TView newView, T originalValue, ref bool setValue); public interface IWritableSynchronizedView : ISynchronizedView { NotifyCollectionChangedSynchronizedViewList ToWritableNotifyCollectionChanged(WritableViewChangedEventHandler converter); NotifyCollectionChangedSynchronizedViewList ToWritableNotifyCollectionChanged(WritableViewChangedEventHandler converter, ICollectionEventDispatcher? collectionEventDispatcher); } ``` `ToWritableNotifyCollectionChanged` accepts a delegate called `WritableViewChangedEventHandler`. `newView` receives the newly bound value. If `setValue` is true, it sets a new value to the original collection, triggering notification propagation. The View is also regenerated. If `T originalValue` is a reference type, you can prevent such propagation by setting `setValue` to `false`. ```csharp var list = new ObservableList() { new (){ Age = 10, Name = "John" }, new (){ Age = 22, Name = "Jeyne" }, new (){ Age = 30, Name = "Mike" }, }; var view = list.CreateWritableView(x => x.Name); view.AttachFilter(x => x.Age >= 20); IList bindable = view.ToWritableNotifyCollectionChanged((string? newView, Person original, ref bool setValue) => { if (setValue) { // default setValue == true is Set operation original.Name = newView; // You can modify setValue to false, it does not set original collection to new value. // For mutable reference types, when there is only a single, // bound View and to avoid recreating the View, setting false is effective. // Otherwise, keeping it true will set the value in the original collection as well, // and change notifications will be sent to lower-level Views(the delegate for View generation will also be called anew). setValue = false; return original; } else { // default setValue == false is Add operation return new Person { Age = null, Name = newView }; } }); bindable[1] = "Bob"; // change Mike(filtered view's [1]) to Bob. bindable.Add("Ken"); // Show Views foreach (var item in view) { Console.WriteLine(item); } Console.WriteLine("---"); // Show Originals foreach (var item in list) { Console.WriteLine((item.Age, item.Name)); } public class Person { public int? Age { get; set; } public string? Name { get; set; } } ``` Unity --- In Unity projects, you can installing `ObservableCollections` with [NugetForUnity](https://github.com/GlitchEnzo/NuGetForUnity). If R3 integration is required, similarly install `ObservableCollections.R3` via NuGetForUnity. In Unity, ObservableCollections and Views are useful as CollectionManagers, since they need to convert T to Prefab for display. Since View objects are generated only once, it's possible to complement GameObjects tied to the collection. ```csharp public class SampleScript : MonoBehaviour { public Button prefab; public GameObject root; ObservableRingBuffer collection; ISynchronizedView view; void Start() { collection = new ObservableRingBuffer(); view = collection.CreateView(x => { var item = GameObject.Instantiate(prefab); item.GetComponentInChildren().text = x.ToString(); // add to root item.transform.SetParent(root.transform); return item.gameObject; }); view.ViewChanged += View_ViewChanged; } void View_ViewChanged(in SynchronizedViewChangedEventArgs eventArgs) { // hook remove event if (eventArgs.Action == NotifyCollectionChangedAction.Remove) { GameObject.Destroy(eventArgs.OldItem.View); } // hook for Filter attached, clear, etc... // if (NotifyCollectionChangedAction.Reset) { } } void OnDestroy() { view.Dispose(); } } ``` Reference --- ObservableCollections provides these collections. ```csharp class ObservableList : IList, IReadOnlyList, IObservableCollection, IReadOnlyObservableList class ObservableDictionary : IDictionary, IReadOnlyDictionary, IObservableCollection>, IReadOnlyObservableDictionary where TKey : notnull class ObservableHashSet : IReadOnlySet, IReadOnlyCollection, IObservableCollection where T : notnull class ObservableQueue : IReadOnlyCollection, IObservableCollection class ObservableStack : IReadOnlyCollection, IObservableCollection class ObservableRingBuffer : IList, IReadOnlyList, IObservableCollection class RingBuffer : IList, IReadOnlyList class ObservableFixedSizeRingBuffer : IList, IReadOnlyList, IObservableCollection class AlternateIndexList : IEnumerable ``` The `IObservableCollection` is the base interface for all, containing the `CollectionChanged` event and the `CreateView` method. ```csharp public delegate void NotifyCollectionChangedEventHandler(in NotifyCollectionChangedEventArgs e); public interface IObservableCollection : IReadOnlyCollection { object SyncRoot { get; } event NotifyCollectionChangedEventHandler? CollectionChanged; ISynchronizedView CreateView(Func transform); } ``` The notification event `NotifyCollectionChangedEventArgs` has the following definition: ```csharp ///

/// Contract: /// IsSingleItem ? (NewItem, OldItem) : (NewItems, OldItems) /// Action.Add /// NewItem, NewItems, NewStartingIndex /// Action.Remove /// OldItem, OldItems, OldStartingIndex /// Action.Replace /// NewItem, NewItems, OldItem, OldItems, (NewStartingIndex, OldStartingIndex = samevalue) /// Action.Move /// NewStartingIndex, OldStartingIndex /// Action.Reset /// SortOperation(IsClear, IsReverse, IsSort) ///

[StructLayout(LayoutKind.Auto)] public readonly ref struct NotifyCollectionChangedEventArgs { public readonly NotifyCollectionChangedAction Action; public readonly bool IsSingleItem; public readonly T NewItem; public readonly T OldItem; public readonly ReadOnlySpan NewItems; public readonly ReadOnlySpan OldItems; public readonly int NewStartingIndex; public readonly int OldStartingIndex; public readonly SortOperation SortOperation; } ``` This is the interface for View: ```csharp public delegate void NotifyViewChangedEventHandler(in SynchronizedViewChangedEventArgs e); public enum RejectedViewChangedAction { Add, Remove, Move } public interface ISynchronizedView : IReadOnlyCollection, IDisposable { object SyncRoot { get; } ISynchronizedViewFilter Filter { get; } IEnumerable<(T Value, TView View)> Filtered { get; } IEnumerable<(T Value, TView View)> Unfiltered { get; } int UnfilteredCount { get; } event NotifyViewChangedEventHandler? ViewChanged; event Action? RejectedViewChanged; // int index, int oldIndex(when RejectedViewChangedAction is Move) event Action? CollectionStateChanged; void AttachFilter(ISynchronizedViewFilter filter); void ResetFilter(); ISynchronizedViewList ToViewList(); NotifyCollectionChangedSynchronizedViewList ToNotifyCollectionChanged(); NotifyCollectionChangedSynchronizedViewList ToNotifyCollectionChanged(ICollectionEventDispatcher? collectionEventDispatcher); } ``` The `Count` of the View returns the filtered value, but if you need the unfiltered value, use `UnfilteredCount`. Also, normal enumeration returns only `TView`, but if you need `T` or want to enumerate pre-filtered values, you can get them with `Filtered` and `Unfiltered`. The View's notification event `SynchronizedViewChangedEventArgs` has the following definition: ```csharp public readonly ref struct SynchronizedViewChangedEventArgs { public readonly NotifyCollectionChangedAction Action; public readonly bool IsSingleItem; public readonly (T Value, TView View) NewItem; public readonly (T Value, TView View) OldItem; public readonly ReadOnlySpan NewValues; public readonly ReadOnlySpan NewViews; public readonly ReadOnlySpan OldValues; public readonly ReadOnlySpan OldViews; public readonly int NewStartingIndex; public readonly int OldStartingIndex; public readonly SortOperation SortOperation; } ``` When `NotifyCollectionChangedAction` is `Reset`, additional determination can be made with `SortOperation`. ```csharp public readonly struct SortOperation { public readonly int Index; public readonly int Count; public readonly IComparer? Comparer; public bool IsReverse { get; } public bool IsClear { get; } public bool IsSort { get; } } ``` When `IsReverse` is true, you need to use `Index` and `Count`. When `IsSort` is true, you need to use `Index`, `Count`, and `Comparer` values. For Filter, you can either create one that implements this interface or generate one from a lambda expression using extension methods. ```csharp public interface ISynchronizedViewFilter { bool IsMatch(T value, TView view); } public static class SynchronizedViewExtensions { public static void AttachFilter(this ISynchronizedView source, Func filter) { } public static void AttachFilter(this ISynchronizedView source, Func filter) { } } ``` `ObservableList` has writable view. ```csharp public sealed partial class ObservableList { public IWritableSynchronizedView CreateWritableView(Func transform); public NotifyCollectionChangedSynchronizedViewList ToWritableNotifyCollectionChanged(); public NotifyCollectionChangedSynchronizedViewList ToWritableNotifyCollectionChanged(ICollectionEventDispatcher? collectionEventDispatcher); public NotifyCollectionChangedSynchronizedViewList ToWritableNotifyCollectionChanged(Func transform, WritableViewChangedEventHandler? converter); public NotifyCollectionChangedSynchronizedViewList ToWritableNotifyCollectionChanged(Func transform, ICollectionEventDispatcher? collectionEventDispatcher, WritableViewChangedEventHandler? converter); } public delegate T WritableViewChangedEventHandler(TView newView, T originalValue, ref bool setValue); public interface IWritableSynchronizedView : ISynchronizedView { (T Value, TView View) GetAt(int index); void SetViewAt(int index, TView view); void SetToSourceCollection(int index, T value); void AddToSourceCollection(T value); void InsertIntoSourceCollection(int index, T value); bool RemoveFromSourceCollection(T value); void RemoveAtSourceCollection(int index); void ClearSourceCollection(); IWritableSynchronizedViewList ToWritableViewList(WritableViewChangedEventHandler converter); INotifyCollectionChangedSynchronizedViewList ToWritableNotifyCollectionChanged(WritableViewChangedEventHandler converter); INotifyCollectionChangedSynchronizedViewList ToWritableNotifyCollectionChanged(WritableViewChangedEventHandler converter, ICollectionEventDispatcher? collectionEventDispatcher); } public interface IWritableSynchronizedViewList : ISynchronizedViewList { new TView this[int index] { get; set; } } ``` Here are definitions for other collections: ```csharp public interface IReadOnlyObservableList : IReadOnlyList, IObservableCollection { } public interface IReadOnlyObservableDictionary : IReadOnlyDictionary, IObservableCollection> { } public interface ISynchronizedViewList : IReadOnlyList, IDisposable { } // Obsolete for public use public interface INotifyCollectionChangedSynchronizedViewList : IList, IList, ISynchronizedViewList, INotifyCollectionChanged, INotifyPropertyChanged { } public abstract class NotifyCollectionChangedSynchronizedViewList : INotifyCollectionChangedSynchronizedViewList, IWritableSynchronizedViewList, IList, IList { } ``` License --- This library is licensed under the MIT License.