GUI design in C-sharp

C# is a vivid example of a modern language that any developer yearns to learn because of its features. Creating a user interface on C# is convenient and rapid when you do it visually, i.e., using the Window Form Application and Toolbox. The window Forms control are reusable components that compress the User Interface efficiency, and it is used in the client-side Window based applications.

How To Create a new Visual Studio C# Project

The first step is creating a new project when you arebeginning to run the Visual Studio. You create a new project by selecting a new project from the File menu. The New Project window will appear, and it contains a range of different types of projects. Ensure that this step is done so that we can create a User Interface by developing a Windows Forms Application. Below the Window, there is a field that you will enter the Name of the project. Here, you can use the default name that is often WindowFormsApplication1, or create the Name of your choice.

Having created the new project, the main Visual Studio will appear. In the middle of that Window, there will be a new form that we will shortly create using the user interface as our example for a C# application.

Adding Components on the Windows Form

Herein, we will create a new Visual Studio project and start the process of adding the user interface components in our application. The Windows Form is still empty. In the next step, we will begin dragging components from the Toolbox to the Form.

To gain access to the Toolbox, you can click on the Toolbox tab located along the left-hand edge of the main Visual Studio window. After that, it will display the Toolbox that has a number of different categories of components that are available to be added in the Form.

Sometimes, you can get the All Common Components category as folded. If you get it folded, simply click on the small + sign to get the list of components unfolded. When the components are visible, you can drag and drop the two Button components and two TextBox components onto the Form canvas position and resize them.

How to Change the Component Names

When the components are added on the Form, the Visual Studio assigns them names by default. Using those names, the C# code will interact with the user interface of the application. It is, therefore, important to specify meaningful names that will make you identify the components that you have referenced in the C# source code.

We recommend that you replace the default name assigned by the Visual Studio to more meaningful names to help you differentiate them. The properties relating to components are specified through the properties panel, which is situated in the bottom right-hand corner of the main Visual Studio window. You will begin by selecting the top TextEditcomponentin the Form area. The panel will display the properties of this component then scroll to the top of the list properties until the Name is visible and change it from textBox1 to the Name of your choice in our case, welcomeText.

Do this task by selecting all the components in the Form and change the name property. On the second textbox, name it nameText, the left- and right-hand buttons helloButton and closeButton, respectively.

Changing the Components Properties

Having known how to change the Name, you can also change the myriad array of the different properties using the properties panel. To illustrate this, we can change the two buttons such that they are ‘Hello’ and ‘Close.’ Select the helloButtonin the Form, scroll down the list of properties to get the Text value, then change it from  button1to Hello. Then also do that for the closeButtonso that it displays Close.

To confirm your progress on the application so far, you can press the F5 button on your PC to build and run the application. Wait for some seconds. Then the application will appear after executing. To prove that it is a live application, you can enter some text in the TextBoxes.

How to Add Behaviour to a Visual Studio C#

Herein, you will add some functionality so that things can happen when you press the buttons in the Form. The behavior is controlled with events. Having used the events, the next task is to read the entered text and use it to display a welcome text. It will take place when the helloButtonis pressed.

Having done the above processes, you can repeat confirming the progress by clicking F%. If it runs successfully, you have built your Use Interface based on a C# application.