Modal Dialog Boxes

1. Overview
   1. Dialog boxes are secondary windows used to display specific information to users, gather information, or both
   2. There are two types of dialog boxes:
      1. modal - requires the user to dismiss the dialog box before interacting with the application
      2. modeless (or nonmodal) - user can interact with the application while the dialog box is open
   3. Common dialog boxes (later in notes) are modal
2. MessageBox
   1. The MessageBox class is used to create simple modal dialog boxes with an icon, message, and standard buttons
   2. Example with Information icon and OK button

      MessageBox.Show(this, "You are doing great!", "My Title",
              MessageBoxButtons.OK, MessageBoxIcon.Information);
      

      
      
   3. Show() returns a DialogResult enum, which indicates what button was pressed

      DialogResult result = MessageBox.Show(this, "Are you crazy?", "My Title",
                   MessageBoxButtons.YesNoCancel, MessageBoxIcon.Question);
      if (result == DialogResult.Yes)
      	// Yes clicked
      else if (result == DialogResult.No)
      	// No clicked
      

      
      
   4. More complex modal dialogs must be created as a Form
3. Custom modal dialog box
   1. Create the project
      1. Create a new Windows Forms project
      2. Add a new class to your project called Options, which will hold the app's options
      3. Add public properties that represent the app's options:

         public class Options
         {
             public enum LineType { Solid, Dashed, Dotted };
         
             public LineType SelectedLineType { get; set; }
             public bool IsLineVisible { get; set; }
         }
         

   2. Create a custom dialog box
      1. Add a new Widows Form to your project called OptionsForm
      2. Add buttons that read OK and Cancel
         1. Set the OK button's DialogResult property to OK
         2. Set the Cancel's DialogResult to Cancel
         3. These properties will cause the dialog box to close when pressed, and they will be used by the parent window to determine which button was pressed
      3. Add radio buttons and checkboxes so the dialog box looks like this:
         
         
      4. Add a private Options field to OptionsForm, and make the constructor require an Options object

         public partial class OptionsForm : Form
         {
         	private Options options;
         
         	public OptionsForm(Options options)
         	{
         		InitializeComponent();
         
         		this.options = options;
         
         		// Make dialog box reflect options
         		visibleCheckBox.Checked = options.IsLineVisible;
         
         		switch (options.SelectedLineType)
         		{
         			case Options.LineType.Solid:  solidRadioButton.Checked = true;  break;
         			case Options.LineType.Dashed: dashedRadioButton.Checked = true; break;
         			case Options.LineType.Dotted: dottedRadioButton.Checked = true; break;
         		}
         	}
         	
         	...
         }		
         

      5. Create a Click event handler for the OK button that sets the Option object's properties to the selected options

         private void OkButton_Click(object sender, EventArgs e)
         {
             // Make options reflect what was selected in dialog box
             options.IsLineVisible = visibleCheckBox.Checked;
         
             if (solidRadioButton.Checked)
             {
                 options.SelectedLineType = Options.LineType.Solid;
             }
             else if (dashedRadioButton.Checked)
             {
                 options.SelectedLineType = Options.LineType.Dashed;
             }
             else
             {
                 options.SelectedLineType = Options.LineType.Dotted;
             }                   
         }       
         

   3. Launch the dialog box
      1. Add an Options field to the main form's class and instantiate it in the form's constructor

         public partial class Form1 : Form
         {
         	private Options options;
         
         	public Form1()
         	{
         		InitializeComponent();
         
         		options = new Options { IsLineVisible = true, SelectedLineType = Options.LineType.Solid };
         	}
         	
         	...
         }
         

      2. In your main form, drop a button and a label which will be used for launching the dialog box and determing what was selected
      3. When the button is pressed, launch the dialog box with ShowDialog()

         private void button1_Click(object sender, EventArgs e)
         {
         	var optionsForm = new OptionsForm(options);            
             DialogResult result = optionsForm.ShowDialog();
         	
         	// TODO: Check result
         }
         

      4. ShowDialog() returns back a DialogResult, which will be OK or Cancel, depending on which button was pressed (closing the dialog box will also return Cancel)

         if (result == System.Windows.Forms.DialogResult.OK)
         {
         	if (options.SelectedLineType == Options.LineType.Solid)
         	{
         		label1.Text = "Solid";
         	}
         	else if (options.SelectedLineType == Options.LineType.Dashed)
         	{
         		label1.Text = "Dashed";
         	}
         	else
         	{
         		label1.Text = "Dotted";
         	}
         
         	label1.Visible = options.IsLineVisible;
         }
         

   4. Run the application, press the button to launch the dialog, change the dialog box settings, press OK, and notice the parent window reflecting the settings
   5. Launch dialog, change settings, press Cancel, re-launch dialog and verify settings are reset to previous values
4. Usability principles
   1. Unless the dialog box should be resizable (which is rare), remove the ability to resize the dialog box and remove the maximize button
      1. FormBorderStyle = FixedDialog
      2. MaximizeBox = False
   2. The best starting location for the dialog is centered in the parent form: StartPosition = CenterParent
   3. Always have OK and Cancel buttons available, and make the Cancel button reset the dialog box back to its original configuration
   4. Closing the dialog box via the close button (X) on the title bar should have the same effect as pressing Cancel
   5. In Windows, OK is always on the left, Cancel on the right
   6. Don't use scrollable dialog boxes, menu bars, or status bars
   7. Modal & Nonmodal Dialogs: When (& When Not) to Use Them
   8. Confirmation Dialogs Can Prevent User Errors — If Not Overused
   9. Windows User Experience Interation Guidelines for Dialog Boxes