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,

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.

application

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

model

Step 3: Create pages in all folders

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

View

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

PopUpWindow

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

TestModel

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.

Create

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

  1. <Label Content="This is Pop Up window" HorizontalAlignment="Left" VerticalAlignment="Top"  
  2.   
  3. Margin="67,113,0,0"/>  

label

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.

  1. using PrismMVVMTestProject.Views;  
  2. using Prism.Mvvm;  
  3. using System.Windows.Input;  
  4. using Prism.Commands;  
  5. using System.Windows.Data;  
  6.   
  7. namespace PrismMVVMTestProject.ViewModels  
  8. {  
  9.     class TestViewModel : BindableBase  
  10.     {         
  11.         public ICommand ShowCommand { getprivate set; }  
  12.         public TestViewModel()  
  13.         {  
  14.             ShowCommand = new DelegateCommand(ShowMethod);  
  15.         }  
  16.         private void ShowMethod()  
  17.         {  
  18.             PopUpWindow objPopupwindow = new PopUpWindow();  
  19.             objPopupwindow.Show();  
  20.         }  
  21.     }  
  22. }  

 

CODE

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.

  1. <Button Content="Show Popup" Command="{Binding ShowCommand}" HorizontalAlignment="Left"  
  2.   
  3. VerticalAlignment="Top" Width="75" Margin="31,21,0,0"/>  

BUTTON

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

  1. using System.Windows;  
  2. using PrismMVVMTestProject.ViewModels;  
  3. namespace PrismMVVMTestProject.Views  
  4. {  
  5.     /// <summary>  
  6.     /// Interaction logic for TestView.xaml  
  7.     /// </summary>  
  8.     public partial class TestView : Window  
  9.     {  
  10.         public TestView()  
  11.         {  
  12.             InitializeComponent();  
  13.             this.DataContext = new TestViewModel();  
  14.         }  
  15.     }  
  16. }  

 

CODE

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

StartupUri

Run the page and See the Output:

OUTPUT

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

Show PopUp

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

PAGE

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

  1. using PrismMVVMTestProject.Views;  
  2. using Prism.Mvvm;  
  3. using System.Windows.Input;  
  4. using Prism.Commands;  
  5. using System.Windows.Data;  
  6.   
  7. namespace PrismMVVMTestProject.ViewModels  
  8. {  
  9.     class TestViewModel : BindableBase  
  10.     {         
  11.         public ICommand ShowCommand { getprivate set; }  
  12.         public TestViewModel()  
  13.         {  
  14.             ShowCommand = new DelegateCommand(ShowMethod);  
  15.         }  
  16.         private void ShowMethod()  
  17.         {  
  18.             PopUpWindow objPopupwindow = new PopUpWindow();  
  19.             objPopupwindow.ShowDialog();  
  20.         }  
  21.     }  
  22. }  

 

Now you can’t perform action on parent page.

PAGE

Read more articles on WPF: