A One-Stop Solution for Creating a C# GUI

The direct manipulation of graphical icons, such as buttons, scroll bars, windows, tabs, menus, cursors, and the mouse pointing device, is becoming the standard for user-centered design in software application programming. Graphical user interfaces (GUIs) allow users to operate computers and other electronic devices intuitively. Many current graphical user interfaces have a touchscreen and voice-command feature. "

This tutorial on C# GUI is focused on guiding you through the features of C# GUI. You will learn the implementation of C# GUI through the practical examples in this tutorial.

Here's How to Land a Top Software Developer Job

Full Stack Developer - MERN StackExplore Program

What Is a C# GUI?

The graphical user interface (GUI) is a user interface that allows users to interact with technology via the use of graphical icons rather than complex code. The graphical user interface was invented in the late 1970s by the Xerox Palo Alto research lab. 

GUI was initially offered commercially for Apple's Macintosh, and Microsoft's Windows operating systems. The model–view–controller software architecture decouples internal data representations from the display of data to the user.

Now, go ahead and get started with the project creation itself.

Project Creation for C# GUI in Visual Studio

You will use visual studio 2019 for this project. You will follow the following steps to create a project:

• You must click on “Create a New Project.”

• Then you must search “Windows Forms App (.NET Framework).”

• Then you must give this project a name like “GUIDemo”

Now, you will try different features of GUI.

Learn the Ins & Outs of Software Development

Caltech Coding BootcampExplore Program

GUI Creation of Calculator in C#

• You must change the window label from form1 to the “GUI Demo”. You can find this in the solution explorer tab.
• Now, you will check out different features of the GUI one by one.

• Start with a button. You can find it in the Toolbox. You can name it “Click Here”. Now, you must double-click on it to write up code to give it some functionality.

Code:

private void button1_Click(object sender, EventArgs e)

        {

            MessageBox.Show("Welcome To Simplilearn!!");

        }

Now, when you click this button it gives a message box with an OK button. When you click the ok button it just closes this message box. 

Now, =add some more interactivity to it. You must use dialogResult and an enum “MessageBoxButtons.YesNo”

Code: 

private void button1_Click(object sender, EventArgs e)

        {

            DialogResult dr =  MessageBox.Show("Do you want to close this window?", "Confirm", MessageBoxButtons.YesNo, MessageBoxIcon.Question);

            if (dr == DialogResult.Yes)

                this.Close();

        }

Learn the Ins & Outs of Software Development

Caltech Coding BootcampExplore Program

Now, when you click the button, it gives us a ‘Yes No’ prompt. Where if you click yes then it will terminate the program and on no, it will just close the message box. 

Let’s use some labels and textboxes. 

• You must name the first label as “User Name” and place a textbox in front of it.
• Name another label as “Password” and place a textbox in front of it. 
• Now, add a button and name it “Sign Up”.
• You must now rename the “Click here” button to “Close”. 
• By default, when you type anything in a textbox, it is in a readable format. 
• But for passwords, you need some kind of visual protection. So you will toggle “UseSystemPasswordChar” from false to true. 
• This will convert all character types in the password textbox from regular characters to bold dot symbols.

Now, use some radio buttons, you will take a label and name it “Gender” and name the radio buttons as “Male” and “Female”. 

Now you must use a Checkbox, and you can name it “I Understand And I Accept the Terms and Conditions”.

Now say you want the “Sign Up” button to be available only when the checkbox is checked. So you will now toggle the “Enabled” property of the “Sign Up” Button. Now, you must write code for the checkbox.

Code: 

private void checkBox1_CheckedChanged(object sender, EventArgs e)

        {

            button2.Enabled = checkBox1.Checked;

        }

Learn the Ins & Outs of Software Development

Caltech Coding BootcampExplore Program

As you can see now “Sign Up” button is only available when you check the checkbox.

Now suppose you have another set of radio buttons, let's say, payment method. Now, you need to separate the gender set and payment set. Otherwise, you won't be able to select different choices. So, you must use group containers to separate them. 

Now, add a code for the “Sign Up” Button.

Code:

 private void button2_Click(object sender, EventArgs e)

        {

            MessageBox.Show("Account is Created");

            this.Close();

        }

And this was all for this tutorial on “C# GUI”.

Our Free Courses with Certificate

Introduction to C#	Enroll Now
Introduction to Front End Development	Enroll Now!
C Programming Basics	Enroll Now!
JavaScript for Beginners	Enroll Now!
Introduction to C++	Enroll Now!

Next Steps

To sum up, developing a C# GUI doesn't have to be a difficult task. You can create practical and user-friendly interfaces with the necessary resources and expertise. The Full Stack Developer - MERN Stack course is a good option for individuals wanting to develop their skill set further. It provides thorough instruction to enhance your C# proficiency and lead to new web development prospects.

If you have any queries about this "C# GUI" tutorial, please drop them in the comment section below. Our 24/7 expert team will promptly respond to your queries.