Customized dialog box

For better UI design, we can implement a customized dialog box. And we can use the new dialog in programs just as easily as MessageBox.Show.

The customized dialog box here is implemented in Windows Forms with a TableLayoutPanel. It hides and shows buttons based on the arguments to ShowDialog.

ShowDialog

This code example is part of the code of the custom dialog. Here we implement ShowDialog, and then call it. The class has a private constructor.

/// <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");
    }
}

Logic

This code implements the basic logic, but lacks some details. We can see some of the logic and method calls used and the general technique.

/// <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.

We saw an example of a custom C# dialog box. It can look odd in edge cases, such as when the dialog text is far too long to fit.