TreeDataGridDemo, GitHub snapshot to ReactiveUI to CommunityToolKit.Mvvm in proper MVVM form

[KentSwan]

Using GitHub download of TreeDataGrid as of 2024-02-23 as a base I have rebuilt separate versions of TreeDataGridDemo in proper Mvvm format. Separate projects one using ReactiveUI and the other CommunityToolkit.Mvvm are operationally identical to the sample demo from the Avalonia.TreeDataGrid snapshot downloaded from the Github repository. Both of the derivative demo projects use net8.0 and all required Nuget packages are updated to their most current versions. This reference information is documented in the MainWindowViewModel.cs file of each variant.

These implement correctly constructed View-ViewModel pairing such that the views are completely independent. These independent views are then individually inserted into TabItems of a TabControl in MainView.axaml.

The conversion process was first from the GitHub version to a standalone ReactiveUI MVVM variant. Once this version was operating properly, it provided the base for the CommunityToolkit.Mvvm variant. Each project has notes embedded relating to that aspect of the conversion.

This attached sample code is intended to be a rosetta stone accessible by anyone. Feel free to review and comment on anything.

Avalonia.Controls.TreeDataGridDemo 2024-02-23.zip

[KentSwan]

In some derivative testing, I found that in the CommunityToolkit.Mvvm variant view would not be initialized when the tab was selected the first time. This was because the load function for the ViewModel's drive data had not been set up before the view was initialized. Adding setting the view DataContext in the View's constructor solves this issue. See the code below.

namespace TreeDataGridDemo.Views
{
    public partial class WikipediaPageView : UserControl
    {
        public WikipediaPageView()
        {
            InitializeComponent();

            this.DataContext = new WikipediaPageViewModel();
        }
    }
}

[KentSwan]

Avalonia.Controls.TreeDataGridDemo.2024-02-26.zip file attached contains working ReactiveUI and CommunityToolkit.MVVM MVVM form projects as an alternative to the equivalent in the GitHub TreeDataGrid distribution. This new code base has been updated to include the initialization update noted above as well as removing the use of stack panel in MainWindow.axaml as the TabControl Views container for TreeDataGrid views. (See issues and solutions found posted separately relating to the TreeDataGrid scroll bars being functional and visible).

I hope this work provides a Rosetta Stone-like capability for other developers. Going through this code normalization, transformation, and evolution exercise for the two Avalonia MVVM support systems has been an eye-opening learning experience.

Avalonia.Controls.TreeDataGridDemo 2024-02-26.zip