visual basic ide introduction

INTRODUCTION

Programming in general is the process of making instructions for a computer to follow.

VB.NET

Visual Basic .NET (VB.NET) is an object-oriented computer programming language implemented on the .NET Framework. Although it is an evolution of classic Visual Basic language, it is not backwards-compatible with VB6, and any code written in the old version does not compile under VB.NET.

IDE

IDE stands for Integrated Development Environment. These are tools that are used for programming using a certain programming language. Each programming languages have their own IDE and feature that will help in compiling and checking of errors in your code.

IDE

The .Net framework is a revolutionary platform that helps you to write the following types of applications:

• Windows applications

• Web applications

• Web services

IDE

Microsoft provides the following development tools for VB.NET programming:

• Visual Studio 2010 (VS)

• Visual Basic 2010 Express (VBE)

• Visual Web Developer

PARTS OF THE VB.NET IDE


The Toolbox is the part where every control that can be used in your program is located. Most of the things that are inside the toolbox are arranged alphabetically and you can also arrange it in a way that you like.


• The Solution Explorer is the part that shows every file in your project you can see all the files shown here if you look on the directory of the project.


The Properties is the part that shows every property of the control and events that can be used with it (more on this on the next topic).


The [Design] Window is where you can see what your form looks like and you can arrange the control in it accordingly.


Double Clicking a control on the design window will show a sub for the control in the code-behind file of the form.


• Each form in your solution have a code-behind file where you can put the command that’s going to be associated for the control.


•In case you accidentally closed one of the windows. You can open it again by clicking the “View” tab on the Menu strip on the top of the window.

CONTROLS

The items in the toolbox are the controls. Each control are tools that can be placed in the form to perform various tasks. Here are some of the controls that you can use in your program. In order to put one on your form, you can click and drag the control from the toolbox or click then resize the control

CONTROLS

• The use of a button is to run the code that is assigned when the button click event happened.

• The textbox is one of the ways that your program can accept user input.

CONTROLS

• The picturebox is the control that is used to place images on your forms.

• The use of label is to put text on your form. It is generally used to display some informative text on the GUI which is not changed during runtime.

CONTROLS

• Checkbox are used for multiple selections. An example of using it is on questions like “What three items in a list do you like most on this list of items?”

• Radiobutton are the counterpart of checkbox but in a group of radiobuttons, only one of the will always be selected.

CONTROLS

• ComboBox are like textbox but will accept multiple text using their “Item” property and have a dropdown button to show all its contents.

• Listbox are similar to combobox with their difference is that the items are shown.

CONTROLS

• MenuStrip are the list of intractable buttons that are permanently located of the top part of the form. A pop up version of it is the “ContextMenuStrip”.

PROPERTIES

• Each control has properties that govern how one can interact with it and what it can react to. Also properties define how the control will look like.

PROPERTIES • Most controls have the same properties and if more than one control is selected, all the properties that the selected controls shared will be the only ones that are shown. In order to view the properties of a control, click one and it will show its properties in the property window like these.

PROPERTIES

The icons below on the top of the properties window have different effects.

• The first 2 are for sorting the properties by uses or alphabetically.

• The next 2 are for the properties and events associated with the control.

• The last one is used to show the property page of the whole project.

PROPERTIES

Now here are some of the commonly used properties and their uses:

• (Name) – The use of this property is to give the control a name that is used to call the control on the code. You can use alphanumeric characters in the name of your control but try to name your control with something that will remind you of what that control do.

PROPERTIES

• Text – This property contains the text that will be shown by the control. It is used to get or set the text of the associated control.

• ForeColor, BackColor – This property change the color of the text and the background color of the control respectively.

PROPERTIES

• Enabled - Gets or sets a value indicating whether the control can respond to user interaction.

• Visible - Gets or sets a value indicating whether the control and all its child controls are displayed.

PROPERTIES

• Location – Gets or sets the location of the control from the reference point which is the upper-left corner of the form.

• Size - Gets or sets the height and width of the control.

PROPERTIES

In order to use the property of the control, you must first call the (Name) property of the control then call the respective property that you are using or changing.

EVENTS

The other tab of the Properties window is the Events Window.

EVENTS

When you double click a control on the [Design], the default Event will be selected.

You can choose which event to use by going to the events window and selecting

EVENTS

Here are some of the events that you can find in the Events window:

• Click– This event happens when the control is clicked.

EVENTS

• MouseEnter – This occurs if the mouse pointer enters the visible part of the control.

• TextChanged – Occurs when the text property of the control is changed.

EVENTS

• KeyPress– Occurs when the control receive keyboard input the the key is released.

• Enter– Occurs when the control becomes the active control of the form.

HELLO WORLD

Open the “Microsoft Visual Basic 2010 Express”, create a new project, set it to “Windows Form Application” and name it “HelloWorld”. Click ok.

HELLO WORLD

Save the project on the specified folder given by the trainer.

HELLO WORLD

On the toolbox, select the “Button” and place in the form as shown in the screenshot below.

HELLO WORLD

Double-click the button control and the code behind file will show up. After that, type the following code on the area as shown in the image:

MsgBox(“Hello World!”)

HELLO WORLD

Run the program by pressing the “F5” key and click the button. The result must look like in the picture below.

NAMING CONVENTIONS

Control type prefix

Example

Form frm frmEntry

Label lbl lblHelpMessage

Text box txt txtLastName

Button btn btnConfirm

List box lst lstPolicyCodes

Combo box, drop-down list box

cbo cboEnglish

Picture box pic picVGA

Check box chk chkReadOnly

Radio Button opt optEnabled

Timer tmr tmrAlarm

• Naming Conventions are optional, they serve as guidelines in order to easily understand your code.

LAYOUT

• As you’ve tried to make your own program, you have designed it and possibly have trouble designing your form. A Tool that can help you is the Layout Toolbar.

• You can access it by right-clicking the menu bar and selecting “Layout”.

LAYOUT

• After selecting the Layout toolbar, the toolbar will show up. We will go through the uses of it that is mostly used.

LAYOUT

• The items above are used for alignment of different controls. To the left, right, middle, top, center and bottom. Just remember that the alignment that is followed comes from the selected control with a white box in the corner as seen on the image to the right.

LAYOUT

• On the image, a Label, TextBox and a Button are selected. The Textbox have the white box on its border which means that the alignment or any Layout selection done will from the location of the TextBox.

LAYOUT

• This is used for changing the size of the selected controls to follow the size of the selected control with a white box if the other controls can change size.

LAYOUT

• The items above are used for the spacing of each control either horizontal or vertical.

LAYOUT

• The items above are used for the alignment to the center or middle with respect to the form itself.

LAYOUT

• The items above are used for overlapping controls to put one control above or below another.

LAYOUT

• The item above is “Tab Order”. It is used for any interact able controls so that when you press tab stop, you can choose which control will get focused next.

LAYOUT

• On the picture to the left, if you click “Tab Order”, it will show you the order of which control will receive the focus next.

LAYOUT

• You can click the numbers to change which control will be selected next. Click the “Tab Order” button again to finalize the changes.

visual basic ide introduction

Education