The Hello World Program
In this tutorial we will have a look at creating a simple MessageBox application that displays the message "Hello World". It has been the traditional first lesson in programming since long before I was coding and so why break from tradition. So, first of all if you haven't got Visual Studio installed then have a look at my first video and once installed start the program.
We will want to create a new project and there are two ways to do this: 1 - go to File/New/Project or click on "Create new project..." on the Start Page, as shown below.
Click on the link shown above to create a new project...
The language we want is Visual C# and then Windows Classic Desktop. From the options shown in the main section select Windows Forms App (.NET Framework). This option will allow us to use the System.Windows.Forms namespace which is necessary for creating a MessageBox. If the default folder for the project location is not what you want, press Browse and select the folder you do want. Type in a name for the project where it says name, I have used HelloWorld02, you should always try to name your project something that will remind you of the purpose of the project when you come back to it in the future. Once you are happy with the settings press OK.
In the window that appears we see our main form named Form1, this is the main application window that will appear when we double-click on the exe file or start the debug process. I have colour-coded a few important sections in the main window. The blue box holds the designer window where we add and configure the physical properties of any controls that we want to use in our application. The red window is the solution explorer that hold all the files and references that are included in our project. The green box shows the properties window that displays all the different things that can be configured for whatever object we have currently selected and the yellow box on the left is the ToolBox tab from which we select the controls that we want to add to our app. The first thing we are going to do is have a look at the code as it stands by default when the application is first created. So go over to the solution explorer, left click on Form1.cs and press F7.
As you can see there isn't much there right now which is good as it means it is simple at the beginning which is good. I will explain what is there though. The code at the top is called the using statements and the are calls to external code that will be inserted in place of the using statement when the code is compiled before being turned into an exe file. This is essentially code that Microsoft has written that makes our job a lot easier because it means that we don't have to write out every line of code each time, we just use and reuse Microsoft's code whenever we need to do something that they have already done. An example of this is the Form1 code. Visual Studio automatically knows what a form or window does and what it should look like because the coders at Microsoft have already written that code and we just implement what they have given us. You will find with C# that a lot of things that we might need are already provided for us in convenient 'objects' that we can just reference and use in our code. This is one of the reasons why I like C# so much. As you can see some of the text in the using statements is gray, this is because they have not yet been used in the code, once they have their text will turn white just like System.Windows.Forms.
Next we have the namespace HelloWorld02. A namespace is a way of compartmentalizing your code so that you can avoid naming conflicts between different code sections and also to control access to portions of your code from other places. A particular namespace contains all the objects, classes and their associated variables and methods that you want to be accessed from where you want them to be accessed from. In fact a using statement is in fact inserting a namespace into your code and making its contents available to your code, so if I was to delete the System.Windows.Forms using statement from my code then its contents would not be available to my application. Namepaces are added by inserting using statements as above.
Next we have the Form1 class declaration. A class is another form of container that holds any number of variables, constants, functions and things like that. These objects are accessed by creating an instance of the class and then they become available through that class instance. In this particular example the class Form1 is described as having two important aspects: 1 - It 'Inherits' from the class Form through the code Form1 : Form which means that Form1 inherits all the properties and functions seen in Form and so the code in Form does not have to be written out again in Fomr1. And 2 - it has only one object: a function called a constructor:
This simply says that when an instance of Form1 is created run the function InitializeComponent. This function sets up the positioning of controls, the colour of texts and stuff and any other physical attributes of the main app window. All forms have this constructor by default. And that is it for the default code, now if we go back to the design window by clicking on Form1.cs [Design} we will now place a button control on our main window.
By clicking on the ToolBox tab and after it initialises the various controls that are available to us will appear. We are looking for a Button control so click "Common Controls" and double left click on Button. This will place a Button control onto our main window. Once there resize the Button to something a little bigger and then resize the main window using the control points at each corner. Click on the button to select it and go to the properties window.
Scroll through the different properties until you get to the one called Text. In the box to the right it should say button1, change this to Test and press Enter. Scroll up to the Font property and change the value of the font size to 22. this should give the appearance seen above. Now we need to add the code to the application to show the MessageBox, so to do this double left click on the button and it should go to the code window again with the appropriate code added. This new code is the Click Event for Button1.
All you need to know about this new section of code is that it runs everytime Button1 is clicked and it is therefore the place where we will put our MessageBox code. So on the space between the curly brackets type the following code:
You may notice things popping up as you type, don't worry about that, it's called intellisense and it is designed to help you understand the various methods, objects and stuff as you type. We will go over that later, right now just save the project once you have written the code by clicking the two floppy disks icon in the control bar. The code is now ready to run so press the green triangle with Start next to it or press F5.
There will be a little wait as Visual Studio compiles and builds the exe file for our application, once done the window you saw in the designer should appear. Feel free to press Test whenever you feel like it.
As you can see a MessageBox appears with the "Hello World" message. Congratulations you have just created your first C# application but before we go lets change the look of the MessageBox a little so we can see more of the available options. So, press OK on the MessageBox and close the app either by clicking on the X at the top right of the window or by pressing the orange square in the Visual Studio window to stop the debugging process and lets have another look at the code.
Now replace the line of code we added:
With the following:
MessageBox.Show("Hello World", "Message", MessageBoxButtons.YesNo, MessageBoxIcon,Stop);
It may be the case that as you were typing you noticed that intellisense was offering you suggestions on what to use, if so then you may be beginning to understand what it is for and how useful it is, if not then don't worry we will discuss it more later. The important point to understand here is MessageBox is a class that has a function or method Show. This Function is what produces the MessageBox window and it takes a certain number of parameters. In the first example it took a single parameter: the text "Hello World". In the second example it takes four parameters. 1 - The main message "Hello World", 2 - a caption for the title bar "Message", 3 - the type of buttons to put on the MessageBox, in this case Yes and No buttons and 4 - The Icon to use which we have chosen to be the Stop Icon. Once ready press Start again and hit Test when the application starts.
And here we have the finished article. A MessageBox configured with the text, buttons and icon just as we chosen. I hope you are happy with your first step into the world of C# windows development. In the next tutorial we will have a look at the basic program structure of a windows form application, so until then, enjoy.