GUI Programming: Designing a Simple Program

Study Notes

Graphical User Interface (GUI) Concepts

GUI allows users to interact with a program visually
GUI gives a program a distinctive "look" and "feel"
GUI is built from GUI controls, which are objects that can display information on the screen or enable users to interact with an application
GUI controls implement the IComponent interface

Windows Forms

Windows Forms are used to create GUIs for programs
A Form is a graphical element that appears on your computer's desktop
A Form is a container for controls and components
In visual programming, Visual Studio generates much of the GUI-related code
When a control is dragged from the Toolbox onto the form, Visual Studio generates the code for us
When a user interacts with a control, events are generated, and event handlers process those events
Method InitializeComponent sets the properties of the controls added to the form

Designing a Simple Program

Step 1: Create the GUI by dragging the components (a Button, a Label, and a TextBox) onto the form
Step 2: Change the names of the components to meaningful names (e.g., textBox1 -> inputPasswordTextBox)
Step 3: Change the autosize of the label from true to false
Step 4: Set the Text property of the label to "Show Me" and clear the Text of the label and TextBox
Step 5: Set the BorderStyle property of the label to Fixed3D to give it a three-dimensional appearance
Step 6: Set the password character of the TextBox to the asterisk character (*)
Step 7: Double-click on the Button to create the Click event
Step 8: Add the following code to the body of the button method: displayPasswordLabel.Text = inputPasswordTextBox.Text;

Another Example: Add Program

Step 1: Create the GUI by dragging the components (a Button, three Labels, and three TextBoxes) onto the form
Step 2: Change the names of the components to meaningful names (e.g., textBox1 -> NumTextBox1)
Step 3: Change the text properties of the labels and button as follows:
- Label1 -> Number1:
- Label2 -> Number2:
- Label3 -> Sum:
- Button1 -> Add
Step 4: Double-click on the AddButton to create the Click event
Step 5: Add the following code to the body of the AddButton method:

double num1, num2, sum;
string output = "";
num1 = double.Parse(NumTextBox1.Text);
num2 = double.Parse(NumTextBox2.Text);
sum = num1 + num2;
output += sum;
SumTextBox.Text = output;

Homework

Please do all the operations.

Description

Design and implement a simple graphical user interface (GUI) program using a Button, Label, and TextBox components. Set properties and adjust settings to achieve the desired functionality. Follow step-by-step instructions to complete the task.