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
Program 1.1 Display My NameProgram 1.1 Display My Name
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
Program 1.1 Display My NameProgram 1.1 Display My Name
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
Program 1.1 Display My NameProgram 1.1 Display My Name
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