How to Create and Display an Input Dialog Box

A pop-up dialog is a perfect way to quickly get required input from your app’s user. Learn how to create one in a Windows Forms app.

It is common for desktop applications to use dialog boxes when requesting information from the user. You can create input dialog boxes in a Windows Forms application by displaying a new window.

You can also add UI elements to the new dialog box. This includes messages, text boxes, and “Ok” and “Cancel” buttons. When the user enters information in the input field, you can save the result and use it in other parts of the app.

How to create an on-click function to trigger the input dialog box

The dialog should not always be visible. You can trigger the dialog box to appear when the user performs an action, e.g. B. clicking a button. You can also learn about other Windows Forms events that you can use in a Windows Forms app.

Add a button to the canvas and create a function that runs when the user clicks the button.

  1. Create a new Windows Forms application in Visual Studio.
  2. Look for a button UI control in the toolbox.
  3. Click a button and drag it onto the canvas.
  4. In the Properties window, change the button’s properties to the following new values:
    Name of the property New value
    Surname dialogButton
    size 400, 100
    text Open input dialog
  5. Click an annotation in the toolbox and drag it onto the canvas. Place the label on the right side of the button.
  6. In the Properties window, change the label’s properties to the following values:
    Name of the property New value
    Surname LabelResponseInput
    Visible NOT CORRECT
  7. Double-click the “New input dialog” button. This generates an on-click function in the code-behind .cs file for the form.
    private void dialogButton_Click(object sender, EventArgs e)

How to create the input dialog box

Create the dialog box in a new function. The function programmatically creates a new form and adds UI elements to it, including a text box with OK and Cancel buttons.

  1. Under the dialogButton_Click() Function, create a new function that creates the input dialog box. The “Title” parameter is displayed in the upper left corner of the window. The value for “promptText” is displayed to the user. The “value” parameter is an out parameter and returns the value that the user entered in the input field.
    public static DialogResult InputBox(string title, string promptText, ref string value)
  2. Inside the Input box() -Function create the UI elements that are displayed on the form.
    Form form = new Form();
    Label label = new Label();
    TextBox textBox = new TextBox();
    Button buttonOk = new Button();
    Button buttonCancel = new Button();
  3. Add the title of the form that will appear in the upper left corner. Also add the main message that will be displayed to the user above the input field.
    form.Text = title;
    label.Text = promptText;
  4. Add values ​​for the “Ok” and “Cancel” buttons. The Text property contains the text that appears above each button. The DialogResult property contains the type of result that the button represents. For more information about DialogResult, see Microsoft’s official documentation.
    buttonOk.Text = "OK";
    buttonCancel.Text = "Cancel";
    buttonOk.DialogResult = DialogResult.OK;
    buttonCancel.DialogResult = DialogResult.Cancel;
  5. Use the SetLimits() -Method for setting the x and y positions of the label, text box and buttons on the form. You can also specify the width and height of each element.
    label.SetBounds(36, 36, 372, 13);
    textBox.SetBounds(36, 86, 700, 20);
    buttonOk.SetBounds(228, 160, 160, 60);
    buttonCancel.SetBounds(400, 160, 160, 60);
  6. Configure some properties for the dialog box itself. These properties determine the form size, border and start position. It also controls the ability to minimize or maximize the window or resize the caption if needed.
    label.AutoSize = true;
    form.ClientSize = new Size(796, 307);
    form.FormBorderStyle = FormBorderStyle.FixedDialog;
    form.StartPosition = FormStartPosition.CenterScreen;
    form.MinimizeBox = false;
    form.MaximizeBox = false;
  7. Add the UI elements to the new form and set the form accept and cancel buttons to the button objects you created earlier.
    form.Controls.AddRange(new Control[] { label, textBox, buttonOk, buttonCancel });
    form.AcceptButton = buttonOk;
    form.CancelButton = buttonCancel;
  8. Show the user the newly created dialog box.
    DialogResult dialogResult = form.ShowDialog();
  9. Save the value that the user entered in the text box. Returns the result of the form, which would be either “Ok” or “Cancel” based on the button the user clicks.
    value = textBox.Text;
    return dialogResult;

How to use the input dialog box

To use the input dialog, call the Input box() function within the dialogButton_Click() Function. When the user clicks the “Open Input Dialog” button, the dialog box appears.

  1. Inside the dialogButton_Click() create a variable to store the value that the user enters in the text box. This value will come from the “value” output parameter.
    string value = "";
  2. Display the dialog box by invoking the Input box() Function. Verify that the user clicks the “Ok” button, and if so, add text to the screen to show the user the response.
    if (InputBox("Dialog Box", "What is your name?", ref value) == DialogResult.OK)
    labelResponseInput.Visible = true;
    labelResponseInput.Text = "Your name: " + value;

How to show the input dialog popup

Run the application and trigger the dialog box.

  1. Click the green play button at the top of the Visual Studio window.
  2. Click on that Open input dialog button to display the dialog box.
  3. Enter a name in the text box and click OK Button. The dialog box closes and displays the results entered in the text box.
  4. Click on that Open input dialog again to reopen the dialog box.
  5. Click on that Cancel button to close the dialog box. This closes the dialog without taking any action or refreshing the UI.

Adding content and UI elements to your Windows Forms application

You can create input dialog boxes in a Windows Forms application and display them to the user when specific events occur. You can create a new dialog box by creating a new form. You can then add new UI elements like labels, text boxes or buttons to it.

After the user enters the required information, you can close the input box and save the information you entered.

If you want to add more content to your UI or dialog box, learn how to add other UI elements. This includes elements such as shapes or images.

Read  A Dish of Brain Cells Figured Out How to Play Pong in 5 Minutes : ScienceAlert

Related Articles

Leave a Reply

Your email address will not be published. Required fields are marked *

Back to top button