C# GUI Application



So far we have run only console applications. Console applications are great for initial learning as you need to be stay away from the complexities of the front end jargon so you could understand the language detail.

All real world application has a Graphics User Interfaces. These Interfaces are in the form of windows, buttons, text forms and so on and so forth. In this tutorial we will create a very simple GUI Application - Kind of the hello world equivalent of the Console application.


We will start with a really very simple example. Our Intention is to develop a very simple Windows with two text box and a button. In the first Text Box, the user will be required to enter his name. After entering his name, he is required to press the Button. The Button will have a text that says - "Enter Your Name and then Press Me".
Once the user Enters his name and presses the button, the second text box says - Hello name . Here is the youtube showing what we wish to accomplish.



Start Visual C# Express and Click on File -> New Project. Then select the Windows Forms Application. You will not be prompted with any text window by default Instead it will present you a small window that you need to design and add the different text boxes, buttons etc. It is like a canvas that you need to fill up and add functionality.

Click on View -> Other Window -> Toolbox and a new window with tools will appear. This toolbox contains all the GUI element that you can potentially use in a GUI application. For this application we will use just two of them - text box and button.

Click on the text box in the Tool Window and then take it to the Form and drag it to draw a rectangle. Repeat it once more to draw another rectangle. Now select the first rectangle and a properties window appear on the right. The most important property that you need to know is its name. By default it is textBox1. We can change it, but for the simplicity, we will leave it as it is. Also inpect the same thing for the second text box. It has a name textBox2.

Now click on the button in the tool box and drag it to form. Clicking on the button shows its properties. Look at the property that says - Text. Change that text to "Enter Your name and press me". Double clicking the button shows the following code. It is basically required to add any functionality when the button is pressed.

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace WindowsFormsApplication1
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void button1_Click(object sender, EventArgs e)
        {

        }
    }
}    

  

Now add the followin the function
button1_Click(object sender, EventArgs e) 

        private void button1_Click(object sender, EventArgs e)
        {
		 textBox2.Text = "Hello "+ textBox1.Text;
        }
 

  


Now hit the F5 button to compile and run the program. If you have not done any mistake it show work as in the objective video shown. Here is the complete youtube video for this process ( We know that it is hard for you to understand it in words - but hopefully, youtube will make it easier to learn)