Difference in between Show And Show Dialog To Open A Child Window From View Model In WPF With MVVM Using Prism

Show

Generally show is useful when you want to focus both on a child as well as a parent window where you can perform any action on parent page.

Show Dialog

Show dialog is useful when you don’t want to focus on parent page after child window is opened and you can’t perform any action on parent page, like disable the parent page.

If you are new in MVVM pattern using Prism Library, then you can follow my very first article to start the MVVM and add the dlls into the project from the following link,

• Getting Started: MVVM Pattern Using Prism Library in WPF

Now, I will show you a demo on how the show dialogue differs from show to open a popup window on the view via the click event of a button from the view in view model.

Note: In this article I am using Visual Studio 2013 and ‘Prism.Unity’ via nugget Packages.

Step 1: Create a project named ‘PrismMVVMTestProject’ of WPF application.

Step 2: It’s a better approach to create the 3 different folders in the project for Model, View and View model respectively.

Step 3: Create pages in all folders

i. Create a View Named ‘TestView.xaml’ as a parent page in the Views folder.

ii. Also create a View Named ‘PopUpWindow.xaml’ as a child page in the Views folder.

iii. Create a Model Named ‘TestModel.cs’ in the Models folder.

Note: We don’t not need Model in this article, I have just created it for the best practices.

iv. Create a ViewModel Named ‘TestViewModel.cs’ in the ViewModels folder.

Step 4: Add a label on the child window page named ‘PopupWindow.xaml’,

<Label Content="This is Pop Up window" HorizontalAlignment="Left" VerticalAlignment="Top"

Margin="67,113,0,0"/>

Step 5:

a. Add the below namespaces on the TestViewModel page,

• ‘Prism.MVVM’ To inherit the class named ‘Bindable Base’.
• ‘PrismMVVMTestProject.Views’ To accessing child window in this page.
• System.Windows.Input To add ICommand.
• Prism.Commands To Use DelegateCommand.

b. Create a command named ‘ShowCommand’.

c. Attach that command to the method named ‘ShowMethod’ which will act like event where will add the show the child window from the view model.

d. Create a object of child window and show it via ‘show’ method.

using PrismMVVMTestProject.Views;
using Prism.Mvvm;
using System.Windows.Input;
using Prism.Commands;
using System.Windows.Data;

namespace PrismMVVMTestProject.ViewModels
{
    class TestViewModel : BindableBase
    {
        public ICommand ShowCommand { get; private set; }
        public TestViewModel()
        {
            ShowCommand = new DelegateCommand(ShowMethod);
        }
        private void ShowMethod()
        {
            PopUpWindow objPopupwindow = new PopUpWindow();
            objPopupwindow.Show();
        }
    }
}

 

Step 6:

Add a button to show the child window with ShowCommand property and bind it that command which we have created in view model.

<Button Content="Show Popup" Command="{Binding ShowCommand}" HorizontalAlignment="Left"

VerticalAlignment="Top" Width="75" Margin="31,21,0,0"/>

Step 7:
 
Add ‘PrismMVVMTestProject.ViewModels’ namespace and bind Data Context of TestView Page to the ViewModel named ‘TestViewModel’.

using System.Windows;
using PrismMVVMTestProject.ViewModels;
namespace PrismMVVMTestProject.Views
{
    /// <summary>
    /// Interaction logic for TestView.xaml
    /// </summary>
    public partial class TestView : Window
    {
        public TestView()
        {
            InitializeComponent();
            this.DataContext = new TestViewModel();
        }
    }
}

 

Step 8: Change the ‘StartupUri’ from default page ‘MainWindow’ to ‘TestView’ page,

Run the page and See the Output:

After click on the ‘Show PopUp’ button, it will show the child window.

Even you can open multiple child windows because you can also perform the action on parent page.

If you want to use show dialog just go to ‘d’ point of ‘Step5’ and use ‘showDialog’ in place of ‘show’ method.

using PrismMVVMTestProject.Views;
using Prism.Mvvm;
using System.Windows.Input;
using Prism.Commands;
using System.Windows.Data;

namespace PrismMVVMTestProject.ViewModels
{
    class TestViewModel : BindableBase
    {
        public ICommand ShowCommand { get; private set; }
        public TestViewModel()
        {
            ShowCommand = new DelegateCommand(ShowMethod);
        }
        private void ShowMethod()
        {
            PopUpWindow objPopupwindow = new PopUpWindow();
            objPopupwindow.ShowDialog();
        }
    }
}

 

Now you can’t perform action on parent page.

Read more articles on WPF: 

• Simple WPF TreeView Control Programmatically
• Getting Started: MVVM Pattern Using Prism Library in WPF