05/09/20151 1.1 introducing visual basic sequence programming

19/04/2319/04/23 11

1.1 Introducing Visual Basic

Sequence ProgrammingSequence Programming

2219/04/2319/04/23

Learning Objectives:Learning Objectives:What a visual Basic Project is made up of.

How to build a program.

Name some examples of controls.

Name a common event and understand what they do.

What the ‘=‘ sign is used for.

3319/04/2319/04/23

Program 1.1 Display My NameProgram 1.1 Display My Name

SpecificationSpecification: : Display your name on a form in large Display your name on a form in large

letters at the click of a button.letters at the click of a button.

4419/04/2319/04/23


1.1. Launch Launch Microsoft Microsoft Visual Basic 2005 Visual Basic 2005 Express Edition.Express Edition.

2.2. Create a New Create a New Project.Project.

5519/04/2319/04/23


3.3. Save with name ‘Save with name ‘Display Display My NameMy Name’.’.

4.4. Click the Toolbox and click Click the Toolbox and click Auto Hide. Auto Hide. This will stop the Toolbox This will stop the Toolbox from collapsing.from collapsing.

6619/04/2319/04/23

Design ViewDesign View

Form 1Form 1

Properties Window

7719/04/2319/04/23


5.5. Hover over and examine Hover over and examine the ‘the ‘Common ControlsCommon Controls’ ’ and ‘and ‘ContainersContainers’.’.

6.6. Try clicking some Try clicking some controls and placing controls and placing them on form1 but delete them on form1 but delete them before moving onto them before moving onto the next slide.the next slide.

8819/04/2319/04/23

PropertiesProperties All controls have properties.All controls have properties.

Descriptive features of controls.Descriptive features of controls.

Form 1Form 1

Properties Window

9919/04/2319/04/23

PropertiesProperties

Change the Change the TextText property of the form to property of the form to ‘‘Display My NameDisplay My Name’.’.

The The Text Text property simply dictates what property simply dictates what text is displayed in the form’s header.text is displayed in the form’s header.

101019/04/2319/04/23

LabelsLabels

1.1. Add a Add a labellabel control to the form. control to the form.

2.2. Change the BorderStyle property to Change the BorderStyle property to ‘FixedSingle’. ‘FixedSingle’.

3.3. Delete the text in the text property.Delete the text in the text property.

111119/04/2319/04/23

NameName propertyproperty

1.1. Note the default name ‘Label1’. Note the default name ‘Label1’. When you add controls they are given a default When you add controls they are given a default

name which reflects the type of control. name which reflects the type of control. They are also automatically numbered at a the end. They are also automatically numbered at a the end. So if you were to add another label it would be So if you were to add another label it would be

named by default as Label2, etc…named by default as Label2, etc…

2.2. Set the Set the NameName propertyproperty to ‘lblDisplayMyName’. to ‘lblDisplayMyName’.Note no spaces allowed in any control Note no spaces allowed in any control NameName..

121219/04/2319/04/23

Difference between Name and Text Difference between Name and Text propertiesproperties

Name property – the name you will use in Name property – the name you will use in program code to refer to this control.program code to refer to this control.

Text property the text displayed in the Text property the text displayed in the control for the user to see.control for the user to see.

131319/04/2319/04/23

Naming ControlsNaming Controls

It will help you if use the common It will help you if use the common programming convention of adding a lower programming convention of adding a lower case three-character prefix to a control case three-character prefix to a control name.name.

So when you come across these names in So when you come across these names in your code you will know what type of your code you will know what type of control it is.control it is.

141419/04/2319/04/23

Common PrefixesCommon Prefixes

ControlControl PrefixPrefix

CheckBoxCheckBox chkchk

ComboBoxComboBox cbocbo

ButtonButton butbut

DataSetDataSet datdat

HScrollBarHScrollBar hsbhsb

ControlControl PrefixPrefix

LabelLabel lbllbl

ListBoxListBox lstlst

MenuStripMenuStrip mnumnu

Text boxText box txttxt

TimerTimer tmrtmr

151519/04/2319/04/23

Font PropertyFont Property

All font properties are in Font section All font properties are in Font section which must be opened before any font which must be opened before any font properties can be set.properties can be set.

161619/04/2319/04/23

Font PropertyFont Property

1.1. Set the Set the Font property Font property of the labelof the label toto size size 12 and Style Bold (True).12 and Style Bold (True).

Note the label must be selected!Note the label must be selected!

171719/04/2319/04/23

ButtonsButtons

Add a button to the form.Add a button to the form. NameName

butNamebutName FontFont

BoldBold TextText

Click hereClick here

181819/04/2319/04/23

Programs / ProjectsPrograms / Projects

Event-driven languages like Visual Basic Event-driven languages like Visual Basic are built using one or more are built using one or more formsforms..

On these you place a variety of other On these you place a variety of other controls and write controls and write procedureprocedure code for code for some of them to suit the purpose of your some of them to suit the purpose of your program (a form is also an example of a program (a form is also an example of a control).control).

191919/04/2319/04/23

CodingCoding

1.1. Double click butName.Double click butName.

2.2. You will now see the You will now see the procedureprocedure code template code template below.below.

Write code here for the butName’s click event.

List of events drop down menu.

202019/04/2319/04/23

EventsEvents

When you double-click any control or the When you double-click any control or the form itself, Visual Basic supplies the form itself, Visual Basic supplies the procedureprocedure code template for the event code template for the event which the makers of the language think which the makers of the language think is the most common one for that control. is the most common one for that control. For a button they think the For a button they think the ClickClick event event should be the default one. should be the default one. Click the list of events (next to Load) to Click the list of events (next to Load) to see other events.see other events.

Syntax ErrorsWhile you are writing in what we call the “Integrated Development Environment (IDE)” if you get blue squiggly lines underneath your procedure code, then there is a syntax error.

Errors in a program that break the Errors in a program that break the grammar rulesgrammar rules of the language of the language being used.being used.

The The IDEIDE constantly checks constantly checks that the rules of the language are being followed.that the rules of the language are being followed.

This could be due to many reasons but the following are the This could be due to many reasons but the following are the most common:most common:

You have used a name that does not exist.You have used a name that does not exist. You have misspelt a reserved or keyword and VB does not recognise You have misspelt a reserved or keyword and VB does not recognise

it (it should offer you suggestions like a spell check if you right click it (it should offer you suggestions like a spell check if you right click the error).the error).

You have misused a reserved or keyword.You have misused a reserved or keyword.A reserved A reserved or keyword is or keyword is any word in the vocabulary of a programming any word in the vocabulary of a programming languagelanguage which can only have the meaning defined in that language.which can only have the meaning defined in that language.

Also note that VB will give you suggestions as soon as you Also note that VB will give you suggestions as soon as you start typing. Use these suggestions to save your fingers and start typing. Use these suggestions to save your fingers and time!time!

222219/04/2319/04/23

CodingCoding

Between the two lines of the Between the two lines of the procedureprocedure template template code type the following code:code type the following code: lbllblDisplayMyName.Text = “DisplayMyName.Text = “ ……… ……… ““

““=” mathematically indicates equality.=” mathematically indicates equality.

““=” in programming, in this case, is an arithmetical =” in programming, in this case, is an arithmetical operator meaning to change operator meaning to change (store or assign)(store or assign) the the text inside “…” to the Text property of the control.text inside “…” to the Text property of the control. It does not mean It does not mean “it is equal”“it is equal” it means “ it means “make it equalmake it equal”.”.

Left Side -> Right SideLeft Side -> Right Side So order is important.So order is important.

Your NameYour NameYour NameYour Name

232319/04/2319/04/23

Design ViewDesign View

Return to Return to Design ViewDesign View by clicking the by clicking the Design tab.Design tab.

File – Save All – Save File – Save All – Save

Note all projects are by default save in My Note all projects are by default save in My Documents/Visual Studio 2005/Projects.Documents/Visual Studio 2005/Projects.

242419/04/2319/04/23

Running the ProgramRunning the Program

Run the Program by clicking the Play Run the Program by clicking the Play button in the top toolbar.button in the top toolbar.

If there are any errors it will tell you below If there are any errors it will tell you below in the error window where the error in the error window where the error occurred.occurred.

252519/04/2319/04/23

FilesFiles

FileFile menu – menu – Save All Save All optionoption

Go and have a look at the files that have Go and have a look at the files that have been created for your project:been created for your project: My Documents/Visual Studio 2008/ProjectsMy Documents/Visual Studio 2008/Projects

262619/04/2319/04/23

Executable filesExecutable files

Make an executable file of your program Make an executable file of your program which can be installed as ‘proper program’ which can be installed as ‘proper program’ by by BuildBuild menu – menu – PublishPublish..

272719/04/2319/04/23

Program 1.2 Change A MessageProgram 1.2 Change A Message

SpecificationSpecification: : When a button is clicked the message When a button is clicked the message

“I LIKE Visual Basic” appears. When a “I LIKE Visual Basic” appears. When a second button is clicked the message second button is clicked the message changes to “I HATE Visual Basic”.changes to “I HATE Visual Basic”.

282819/04/2319/04/23

Program 1.2 Change A MessageProgram 1.2 Change A Message

1.1. Launch Launch Microsoft Visual Basic 2005 Microsoft Visual Basic 2005 Express Edition.Express Edition.

2.2. Create New Project (File – New Project / Create New Project (File – New Project / in top toolbar or Project in Start Page).in top toolbar or Project in Start Page).

3.3. Save with name ‘Change a Message’.Save with name ‘Change a Message’.

4.4. Make sure you have Form1 selected.Make sure you have Form1 selected.

5.5. Change the Change the TextText property of the form to property of the form to ‘Change A Message’.‘Change A Message’.

292919/04/2319/04/23

LabelsLabels

1.1. Add a Add a LabelLabel control to the upper part of the control to the upper part of the form.form.

2.2. Change the Change the NameName property of the Label to property of the Label to ‘lblMessage’.‘lblMessage’.

3.3. Change the BorderStyle property to Change the BorderStyle property to ‘FixedSingle’. ‘FixedSingle’.

4.4. Change the Font Property Size to ’14’ and Change the Font Property Size to ’14’ and style to ‘Bold’.style to ‘Bold’.

5.5. Change the Text property of the label to Change the Text property of the label to ‘Message’‘Message’

303019/04/2319/04/23

ButtonsButtons

1.1. Add 2 buttons to lower part of the form Add 2 buttons to lower part of the form (left and right sides).(left and right sides).

2.2. One with Name property One with Name property ‘butGoodMessage’ and Text property ‘butGoodMessage’ and Text property ‘Good Message’.‘Good Message’.

3.3. The other with Name property The other with Name property ‘butBadMessage’ and Text property ‘Bad ‘butBadMessage’ and Text property ‘Bad Message’.Message’.

313119/04/2319/04/23

Coding the buttonsCoding the buttons

1.1. Double-click the Good Message button and the Double-click the Good Message button and the procedureprocedure template code for the click event template code for the click event pops up (remember Visual Basic assumes you pops up (remember Visual Basic assumes you want this code to occur if the button is clicked want this code to occur if the button is clicked as this most likely event for a button.as this most likely event for a button.

2.2. Write the following code between the lines of Write the following code between the lines of the the procedureprocedure template code: template code:

lblMessage.Text = “I LIKE Visual Basic”lblMessage.Text = “I LIKE Visual Basic”

3.3. Return to Design View and do the same for the Return to Design View and do the same for the Bad Message button, but this time the code is:Bad Message button, but this time the code is:

lblMessage.Text = “I HATE Visual Basic”lblMessage.Text = “I HATE Visual Basic”

323219/04/2319/04/23

Saving and Running your programSaving and Running your program

In Design ViewIn Design View

File – Save All – SaveFile – Save All – Save

Run the Program by clicking the Play Run the Program by clicking the Play button in the top toolbar.button in the top toolbar.

If there are any errors it will tell you below If there are any errors it will tell you below in the error window where the error in the error window where the error occurred. occurred.

333319/04/2319/04/23

Executable filesExecutable files

Make an executable file of your program Make an executable file of your program which can be installed as ‘proper program’ which can be installed as ‘proper program’ by by BuildBuild menu – menu – PublishPublish..

Changing Properties

ObjectName.Property = whatever you wish to change it to

The property you use depends on what you wish to change and will be something from the property list.

Which properties you can change depends on the object concerned (different objects have different properties available).

Click the object and check out the properties available in the Property list.

How or what you change the property to depends on how it works in the property list.

For example: To change the Visible property you have

use True or False.

Displaying updated information while a program is running

This will normally be done in a label so: lblLabelName.Text = whatever you want to display

If you want to display a standard text message then enclose

the text in “…….”.

363619/04/2319/04/23

PlenaryPlenaryWhat is a visual Basic Project is made up of? One or more forms

How do we build a program? Place controls from the toolbox onto a form

Can you name some examples of controls? TextBoxes, Labels, Buttons, Forms

373719/04/2319/04/23

PlenaryPlenary

Can you name some common events and explain what they do? Click Event Most controls have procedures The code inside these procedures are fired

off when an event happens.

What is the ‘=‘ sign is used? Often used as an assignment statement

3838

Extension ProgramsExtension Programs1. Add code to Program 1.1 to display IBSB in a second label

when the program runs.2. Write a program which displays the message “Welcome to

Visual Basic” in the title of a form when a Welcome button is clicked (when referring to a form you must use Me.)

3. Write a program which initially hides a label saying Visible, clicking a Show button should show it and clicking a Hide should hide it. Add two buttons on a form whose text properties should be set to

Show and Hide. Add a label to the form whose text property should be “Visible” and

it’s visible property should be set to false. Clicking the Show button should show the label and clicking the

Hide button should hide it again. Use lblMessage.Visible = True or False

4. Write a program so that the background and words typed into a text box change to red or blue when associated buttons are clicked. Use txtBox.ForeColor = Color.Red or Color.Blue Use txtBox.BackColor = Color.Red or Color.Blue