https://github.com/dwarry/ReactiveUiMahAppsDialog

Minimal application demonstrating how to open a MahApps custom dialog from a ReactiveUi Interaction.
https://github.com/dwarry/ReactiveUiMahAppsDialog

mahapps reactiveui

Last synced: 16 days ago
JSON representation

Minimal application demonstrating how to open a MahApps custom dialog from a ReactiveUi Interaction.

• Host: GitHub
• URL: https://github.com/dwarry/ReactiveUiMahAppsDialog
• Owner: dwarry
• License: mit
• Created: 2018-05-12T15:54:43.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2018-05-12T16:48:38.000Z (over 6 years ago)
• Last Synced: 2024-10-10T23:43:54.724Z (29 days ago)
• Topics: mahapps, reactiveui
• Language: C#
• Size: 21.5 KB
• Stars: 10
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: Readme.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# ReactiveUiMahAppsDialog

This is a minimal project which just demonstrates how to open a custom MahApps dialog using ReactiveUi's Interaction infrastructure. 

## MainWindow / MainWindowViewModel

This is just a MetroWindow shell to host the TestView

## TestDialog / TestDialogViewModel

The custom dialog window with a couple of editable fields. The "OK" button only becomes enabled when both fields contain non-whitespace values.

## TestView / TestViewModel

TestView just contains a button to trigger the dialog. TestViewModel uses ReactiveUi's Interaction class to trigger the dialog and collect the entered data. The TestView declares the handler for this interaction, and uses MahApp's DialogCoordinator to display the dialog. 

The interesting part is in TestView's WhenActivated block in its constructor: 

```csharp

    new DialogParticipationRegistration(this).DisposeWith(d);

    

    this.ViewModel.Interaction.RegisterHandler(async interaction =>

    {

        var dlg = new CustomDialog {Title = interaction.Input};

        var dlgvm = new TestDialogViewModel((TestDialogViewModel vm, bool wasAccepted) =>

            {

                DialogCoordinator.Instance.HideMetroDialogAsync(this, dlg);

                if (wasAccepted)

                {

                    interaction.SetOutput(new DialogData{Foo = vm.Foo, BarBaz = vm.BarBaz});

                }

                else

                {

                     interaction.SetOutput(null);

                }

            });

        dlg.Content = new ViewModelViewHost {ViewModel = dlgvm};

            

        await DialogCoordinator.Instance.ShowMetroDialogAsync(this, dlg);

        await dlg.WaitUntilUnloadedAsync();

    }).DisposeWith(d);

```

The important bits:

* The view has to register itself with the DialogParticipation class - the MahApps docs show how to do this from the ViewModel, but I prefer ReactiveUi's approach of keeping this in the View. This is dealt with by the nested `DialogParticipationRegistration` class that also unregisters it when the TestView is unloaded. 

* The content of the Dialog is set to be a `ViewModelViewHost` that is initialized with a `TestDialogViewModel` instance, so that ReactiveUi can wire everything up in the normal way. 

* Once we have asked the DialogCoordinator to show the dialog, we have to explicitly wait for it to be unloaded, otherwise ReactiveUi will throw an `UnhandledInteractionException` because the interaction handler will end before the dialog has been closed.