C# Customized Dialog Box

Customized dialog box. MessageBox doesn't adhere to some UI guidelines. Here we have example code for a customized dialog box. And you can use the new dialog in your programs just as easily as you can use MessageBox.Show.
ShowDialog. Here we can use a special static method. It has a private constructor. We call its public method called ShowDialog. This code example is part of the code of the custom dialog. Here we implement ShowDialog, and then call it.

Arguments: The first arguments are for the title, heading, text and buttons. If you want a button not to appear, pass in null instead of a string.

Button: It has a default button. In my implementation, the first button is always the default and it is also the confirm button.

Implementation of ShowDialog: C# /// <summary> /// This method is part of the dialog. /// </summary> static public DialogResult ShowDialog(string title, string largeHeading, string smallExplanation, string leftButton, string rightButton, Image iconSet) { // Call the private constructor so the users only need to call this // function, which is similar to MessageBox.Show. // Returns a standard DialogResult. using (BetterDialog dialog = new BetterDialog(title, largeHeading, smallExplanation, leftButton, rightButton, iconSet)) { DialogResult result = dialog.ShowDialog(); return result; } } /// <summary> /// This is the calling convention of the above method. /// Use this to show a custom dialog in your source code. /// </summary> private void ExampleCall() { DialogResult result = BetterDialog.ShowDialog("Reset Journal Settings", "Settings will be erased permanently", "This will not affect any of the text content in the database.", "Reset", "Cancel", Properties.Resources.DialogWarningXP); if (result == DialogResult.OK) { Console.WriteLine("User accepted the dialog"); } }
Custom image usage. It shows a custom Image. The last argument is an Image resource called DialogWarningXP. You can use an Image from your program's resources, and BetterDialog will use that as its icon.

Finally: It returns a standard DialogResult, which you can test as normally by using DialogResult.OK or other enums on DialogResult.

Logic. This code implements the basic logic, but lacks many of the details in my implementation. If you are writing your own dialog, you can see some of the logic and method calls used and the general technique.

CreateGraphics: It uses this.CreateGraphics to get a Graphics object on the form. It useslogic with MeasureString and attempts to lay out the dialog.

Note: I had to find values that would lay out and position the elements properly. It also has a table layout, which simplifies the design.

TableLayoutPanel: The layout is done with 2 TableLayoutPanels, with a white background so that it can better match Windows' themes.


Hiding: It can hide or show various parts. It will hide buttons you specify as null, and it will collapse and hide the text if you don't supply it.

Implementation of BetterDialog constructor: C# /// <summary> /// Use this with the above static method. /// </summary> private BetterDialog(string title, string largeHeading, string smallExplanation, string leftButton, string rightButton, Image iconSet) { // Set up some properties. this.Font = SystemFonts.MessageBoxFont; this.ForeColor = SystemColors.WindowText; InitializeComponent(); this.Width = 350; this.Height = 150; // Do some measurements with Graphics. using (Graphics graphics = this.CreateGraphics()) { SizeF smallSize; SizeF bigSize; if (string.IsNullOrEmpty(smallExplanation) == false) { // Note: at this point, we could detect that the OS is Vista // and do some customizations. That logic is in the download. // The code here does some measurements. label1.Font = new Font(SystemFonts.MessageBoxFont.FontFamily.Name, 8.0f, FontStyle.Bold, GraphicsUnit.Point); smallSize = graphics.MeasureString(smallExplanation, this.Font, this.label2.Width); bigSize = graphics.MeasureString(largeHeading, label1.Font, this.label1.Width); this.Height = (int)smallSize.Height + 166; double bigger = (smallSize.Width > bigSize.Width) ? smallSize.Width : bigSize.Width; this.Width = (int)bigger + 100; } else { // We have a null "smallExplanation", so we have a single message // dialog. Do some different changes. Code omitted for brevity (you // can find the logic in the download if you want to see it). } } // Establish a minimum width. if (this.Width < 260) { this.Width = 260; } // Set the title, and some Text properties. this.Text = title; label1.Text = largeHeading; label2.Text = string.IsNullOrEmpty(smallExplanation) ? string.Empty : smallExplanation; // Set the left button, which is optional. if (string.IsNullOrEmpty(leftButton) == false) { this.buttonLeft.Text = leftButton; } else { this.AcceptButton = buttonRight; this.buttonLeft.Visible = false; } this.buttonRight.Text = rightButton; // Set the PictureBox and the icon. pictureBox1.Image = iconSet; }
Properties. This dialog has some special attributes. The custom dialog has these properties, many of which are not in the default MessageBox in Windows Forms. It is simpler to use: you can just pass in different arguments.
It uses the proper fonts. It uses Segoe UI font on Vista, and Tahoma on XP. Header text and layout is precisely equal to the Vista standard, which says you should have larger header text on the dialog.
It allows custom button text. Supports action verbs as its confirm button, and also 1 or 2 buttons. It allows custom icons. Can use custom icons—pass in an Image resource and it will displayed as the alert message.
Designer. Here is a picture of the form in the Visual Studio 2008 Designer. You can see the basic layout, with two TableLayoutPanel controls and the PictureBox. This is the basic skeleton of the custom dialog.
Summary. Here we saw an example of a custom dialog in the C# language. Unfortunately, there are some weaknesses here. It can look odd in edge cases, such as when displaying the text of a long book.

Tip: Rigorously test your code to make sure it doesn't embarrass you down the line.

Dot Net Perls
© 2007-2020 Sam Allen. Every person is special and unique. Send bug reports to