Sunday, November 22, 2015

How to make a GUI program with C#

Today, I will explain how to make a Graphical User Interface (GUI) program with C#. We will make a simple program with a button.

Go to microsoft's website to download for Integrated Development Environment called Visual Studio:
https://www.visualstudio.com/vs/

Visual Studio community version is a free & useful IDE for C#. Please note, Enterprise version and Professional version are not free but only community version is free.
(Actually not only for C#. Visual Studio can be used to develop other language's programs like C, C++, Visual Basic and so on).


After downloading the Visual Studio, start it. You will be asked to log into your Microsoft account. Log in with your information.

After logging in, Start page like below will show up. Choose "File" --> "New" --> "Project".


A window like below will show up now. Choose "Visual C#" --> "WPF application". You can name it as you like, so you can use the default name "WpfApplication1" as it is. I named it as "WpfApplication2" because WpfApplication1 is already existing. By the way, this style of capitalization is called "PascalCasing". See here for the design detail.

Then this window like below will show up. This is the place where you fix and edit your program design.You will define how the program will look like here. We will add a button to our program.


Choose "button" from the toolbox and drag & drop it in the window as follows:


After adding the button, double-click the button on the window.

You will be brought to a window where you write codes for the program. You will define what your program will do. (not for design now!) There are two sections; one is named MainWindow(), and the other is button_click(). "MainWindow()" is a constructor, which is called everytime the program starts, so usually codes for initialization are written here.

Second one "button_click()" is a method. Method is used to define a certain routine that produces a certain return. This is called "Function" in C or C++. This "button_click" method defines what will happen when the button is clicked.

Write "MessageBox.Show("Hello World!!");" inside button_click() method as follows:

MassageBox.Show("Anything to show inside the message box") is also a method, but this method is called from other place of the program and is prepared from the beginning automatically by the visual studio. What you need to do to use this MessageBox.show is just call it like above.

After writing the code, click "Start" from the menu bar.

Then your program will appear....


Click the button at the center. You will see the Message box you defined.