c# - Dialog using Caliburn.Micro 4.0.x and WPF

Question

I'm using Caliburn.Micro 4.0.136-rc and want to display a dialog, asking for user input.

All I find is answers from several years ago, using classes which are not available in CM anymore. Others link to solutions on dead websites.

I'm using a ViewModel, which inherits from Screen. How can I create and display a Dialog using CM and MVVM?

question from:https://stackoverflow.com/questions/65940554/dialog-using-caliburn-micro-4-0-x-and-wpf

Answer 1

I found 2 possible ways of displaying a dialog with Caliburn.Micro

IWindowManager

Based on this page https://csharp.hotexamples.com/examples/Caliburn.Micro/WindowManager/ShowDialog/php-windowmanager-showdialog-method-examples.html

I'm using IoC, so I injected IWindowManager to the ViewModel via constructor.

With this reference it's possible to call ShowDialogAsync() and point to the ViewModel from the dialog. Here is the important part:

        private readonly IWindowManager _windowManager;

        public ShellViewModel(IWindowManager windowManager)
        {
            _windowManager = windowManager;
        }

        protected override async void OnViewLoaded(object view)
        {
            await Task.Delay(1500);
            await _windowManager.ShowDialogAsync(new UsrControlViewModel());
        }

MaterialDesignInXAML

In my project the package MaterialDesignInXAML was already used, so this may not be acceptable for everyone.

Here is the documentation part for dialogs: https://github.com/MaterialDesignInXAML/MaterialDesignInXamlToolkit/wiki/Dialogs

I found an issue describing how to show a dialog with MaterialDesignInXAML and that binding fails in Caliburn.Micro. While it seems to be an issue from Caliburn.Micro, Keboo provides a solution with a workaround.

Thread: https://github.com/MaterialDesignInXAML/MaterialDesignInXamlToolkit/issues/1085

From that thread, the important bit is:

ViewModel

public async Task OpenDialog()
{
    var viewModel = new UsrControlViewModel();
    UIElement uiElement = ViewLocator.LocateForModel(viewModel, null, null);
    ViewModelBinder.Bind(viewModel, uiElement, null);
    await DialogHost.Show(uiElement, 
    new DialogOpenedEventHandler((sender, args) => viewModel.WithDialogSession(args.Session)));
    var result = viewModel.Text;
}

View

    <materialDesign:DialogHost>
        <materialDesign:DialogHost.DialogContent>
            <ContentControl />
        </materialDesign:DialogHost.DialogContent>
        <!-- rest of my view -->
    </materialDesign:DialogHost>

I will go with the second approach, since MaterialDesignInXAML is already in use in this project.