Tuesday, January 4, 2011

Lecture 2 & 3: Basic Windows Application using Visual Basic in Visual Studio

Note: Uploading screenshots is taking time... I will upload soon
Learning Objectives:
• To understand the basics of Visual Basic Language
• To develop simple windows based application through visual studio
Learning outcomes
• Understanding of multi-language support in .Net
• Understanding of syntax of visual basic
• Familiarity with the environment of Visual Studio
Multi-Language Support:
As mentioned in previous lecture that the compiler of every language in .NET generates the same MSIL code. This also leads to language independence, as any compiled code is in the common format thus understandable by compilers of other languages (within) as well.
In addition it must be recalled that the assembly executed by CLR also contains MSIL which implies that CLR is not concerned or aware of the actual language in which code was written and treats the compiled code of all languages in the same way
Integrated Development Environment:
An Integrated Development Environment (IDE) brings all of the programmers tool’s into one convenient place. There was a time when programmers had to edit files, save the files out, run the compiler, then the linker, build the application then run it through a debugger.
Today's IDEs bring editor, compiler, linker and debugger into one place along with project management tools to increase programmer productivity.
Visual Studio
Visual Studio is an IDE for building ASP.NET Web applications, XML Web Services, desktop applications, and mobile applications. Visual Basic, Visual C++, Visual C#, and Visual J# all use the same integrated development environment (IDE), which allows them to share tools and facilitates in the creation of mixed-language solutions

For creating new projects navigate to the menu and on clicking the New Project option following screen will be displayed from which you will have to select the project type and language. The figure 2.1 shows selection of “windows application” using Visual Basic language. After choosing the appropriate template i.e. “Windows Application” give a name to the project which will be store by default in Documents if Express edition of visual studio is used.


Fig 2.1

Once you create the application a screen similar to the following will be created.


Fig 2.2

As can be observed that the IDE consists of a number of menus and windows. Let’s see the purpose of each window that can be seen on the screen. On the top left is the solution explorer. Figure 2.4 focuses on solution explorer only.



Fig 2.3

Solution Explorer allows you to view items and perform item management tasks in a solution or a project. It also allows you to use the Visual Studio editors to work on files outside the context of a solution or project. A single solution and its projects appear in a hierarchical display of solution explorer that provides updated information about the status of your solution, projects, and items. This allows you to work on several projects at the same time. Because the selected project and item determines the toolbar icons, this list is a partial representation of those you might encounter while working in Solution Explorer.

(Icon Image will come here)Displays the appropriate property user interface for the selected item in the tree view.
(Icon Image)Shows all project items, including those that have been excluded and those that are normally hidden.
(Icon Image)Refreshes the state of the items in the selected project or solution.
(Icon Image)Launches Class Designer to display a diagram of the classes in the current project. (Icon Image)Opens the selected file for editing in the Code Editor.
(Icon Image)Opens the selected file for editing in the designer mode of the Code Editor.
(Icon Image)Adds a Solution Folder to the selected item. You can add a Solution Folder to the solution or to an existing Solution Folder.

Apart from solution explores you can also see a properties window and a toolbox shown in the figure that are following.

Fig 2.4


Fig 2.5

The details of the above mentioned windows will be discussed later.

In figure 2.2 you must have observed the following at the center. This is the designer of form.


Fig 2.6

Before continuing the discussion lets first see what is a Windows Form.

Windows Forms: are the base unit of your windows application. It is actually a blank slate that you, as a developer, enhance with controls to create a user interface and with code to manipulate data. Controls are actually graphical user interface components through which end-users communicate with your application. Visual Studio displays the set of controls that can be used by the programmer in toolbox (displayed on figure 2.4).
Recall the definition of software frameworks that they consist of collection of items and plug-in points where users can insert instructions/code. The controls are basically the items that programmers can use to quickly develop graphical user interface and you can also associate code/instructions with each control. These instructions get executed when the end-user interact with the user-interface. For example, you may want a message box to be displayed to the user when the user clicks a button (control) on the form

Developing the First Application:

Let’s create a simple application consisting of a button which when clicked will display a message box consisting of message “Hello World”. The learning outcome of this will be that you will learn how to add controls to form, associate code with the control and execute the code. In addition the objective is to also let you know about the structure of instruction and the basics of the grammar of C# technically known as syntax.
To develop the application, open a new project. (Read the beginning of notes for lecture # 2). The designer (refer to Fig 2.6) will be displayed at the center, on the left solution explorer (Fig 2.3) and properties window (Fig 2.5) will be displayed. On the right side toolbar will be displayed (Fig. 2.4). Click “Button” on toolbar and then click on the form being displayed on the designer. This will cause a new button to be created. Congratulations you have created your first object belonging to the category/class Button. As discussed that each class/category has certain characteristics (data/methods) that all the objects possess. If you want to see the data associated with the newly created button object. Right-click the button and click properties from the menu displayed. Observe that the properties window will become activated. The properties window consist of data associated with the object and the values stored in each data field. If you want to modify the data you can simply change the value.
Lets change the “Text” displayed on the new button object. For that go to the text property in the property window and type “Click Me”. (You can enter any message of your choice).
In order to associate code with the button, double click the button and you will go into the code view. The code view allows you to write instructions or in other words do the programming for the form. Type the following line at the location where cursor is blinking.

After writing this line, go to the debug menu and click start debugging. This will cause your application to execute.

Adding More Controls:

Let’s add another control which is known as TextBox. Again follow the same procedure i.e. click TextBox on the toolbox and click on the form. This will create a text box. The textbox also consists of a property known as Text. Whatever is written in the text property will be displayed in textbox.

The next task is to display the contents of the TextBox in the MessageBox when the button is clicked. As mentioned that text property stores the contents of the textbox, therefore in order to get the contents of the textbox, we will write the following instruction

In order to display the contents in the message box we will modify the above code as follows.


The above line states that the contents of textBox1.Text should be given to MsgBox which, as we have already seen, will display whatever that has been passed in brackets.
Label Control:
Currently the form does not contain any indication about what should be entered in the textbox. For such a purpose, Label control is used and the process of adding it is same. As in other controls studied so far “Text” property here is also used for indicating what should be displayed in the Label
String constant:
When you observe the above codes regarding message box you will identify that when displaying a predetermined set of characters (also known as String) in the message box, we used double quotes (“”). However when we wanted the contents of textbox which obviously depends upon the input of the user, we didn’t use the double quotes. Actually when any thing is written outside double quote it is considered to be something that the compiler/runtime should evaluate however things that are written in double quotes are considered as string constants
Variables:
Variables are place holders that can hold data values. For example age can be stored in a variable for further processing. Similarly Text property of TextBox is also a variable as it stores string values that are typed in the textbox.
The process of creating a variable is known as declaration. Following is an example of declaring and integer variable. The example also includes statement to store a value in the declared variable which is known as assignment. When the variable is assigned a value first time, it is known as initialization.


The above statements can be combined into a single one which is indicated as follows


Variables are also created in classes but when created in classes they are known as properties. For example Microsoft created a variable named Text in class Label which is termed as property of label.
Data Type:
As mentioned that while creating a variable you must mention a data type of that variable. Languages provide data types so that space is effectively utilized and the operations that can be performed are easily identified. The importance of data types is easily understood when it is taken into consideration that in real life the data that is stored has various types, for example salary or price may consist of a decimal point however, age and population do not. In addition to this if you consider age and population age will store a maximum value of probably 150 however population can store an exponentially large value. Therefore it won’t be effective if a language provides a single data type for both age and population. In such case the data type should be large enough to hold population, however when the same data-type will be assigned to age a lot space will be unnecessarily wasted. Therefore Microsoft has provided a range of data types in visual basic.

No comments:

Post a Comment