The City School 2021-2022
Field Name Data Type
EmployeeID Autonumber
FirstName Short Text
LastName Short Text
Address-1 Short Text
Address-2 Short Text Handling Databases with Research
City Short Text Advance Imaging
State Short Text
Zip Short Text
Phone Short Text
Phone Type Short Text
The table can be created in two ways:
Creating table through Design View tab
1. Right click Table 1 in the navigation pane and select Design View.
51
The City School 2021-2022
2. Access will prompt you to save the table first. Enter a suitable name for your table.
3. Once in Design View, enter the field name and its respective data type. Once we
type the field name MS Access will automatically assign the short text data type to
the field which can be modified as per our requirement from the drop-down menu.
4. Switch to Datasheet View to have look at your table. It is important to save your
table at this stage.
52
The City School 2021-2022
5. The ID field is created in every table by default. To change the name of the ID field
to EmployeeID, click Name and Caption option.
Advance Imaging Handling Databases with Research
Creating table through Datasheet View
You can directly enter table field name from the datasheet view in Access.
1. To add a new field, double click Click to Add button on the table.
2. Once you double click Click to Add, a drop down list will appear, prompting you to
select the datatype for your field. For the present example, select Short Text.
53
The City School 2021-2022
3. After selecting the data type, enter the required field name. Enter FirstName as the
field name for the given example.
4. After entring the field names, you can now enter records in the table.
3.6. Creating Relationships Between Tables
MS Access uses table relationships to join tables
when you need to use them in a database object.
There are several reasons why you should create Facebook uses MySQL as primary
table relationships before you create other database database management systems
for data storage such as wall
objects, such as forms, queries and reports. posts, information of users, their
timeline and so on.
Excel vs Access
MS Excel is used to make graphs, charts, histograms and perform
complext calculations where as MS Access is database management
tool, used to store and manipulate data.
54
The City School 2021-2022
• To work with records from more than one table, you
often must create a query that joins the tables.
• The query works by matching the values in the
primary key field of the first table with a foreign key
field in the second table. Advance Imaging Handling Databases with Research
• When you design a form or report, MS Access uses
the information it gathers from the table relationships
you have already defined to present you with
informed choices and to prepopulate property
settings with appropriate default values.
Primary Key
A primary key, also called a primary keyword, is a
key in a database that is unique for each record. It is
a unique identifier, such as a driver license number,
telephone number (including area code), or vehicle
identification number (VIN). A relational database
must always have one and only one primary key.
Primary keys typically appear as columns in relational
database tables.
Foreign Key
A foreign key is a column or group of columns in a
relational database table that provides a link between
data in two tables. It acts as a cross-reference
between tables because it references the primary key
of another table, thereby establishing a link between
them.
55
The City School 2021-2022
When you design a database, you divide your information into tables, each of
which has a primary key and then add foreign keys to related tables that reference
those primary keys. These foreign key-primary key pairings form the basis for table
relationships and multi-table queries.
3.7. Constraints in Database
In a database when we define any field as a Primary
Key (PK) there are two rules or constraints applied to
that field automatically. Checkpoint
Not Null: this constraint enforces that this field cannot Databases are structured set
of data.
be left unused. In Database terminology, NOT NULL is Rows are also called records
not considered as empty or zero, it just defined as the Columns are also called fields
data has not been entered yet.
Unique: this constraint enforces that the data entered in this field cannot be repeated
or all the values entered should be unique to each other.
56
The City School 2021-2022
3.8. Creating Relationships in MS Access
For creating relationships in our database,
we need another table and will name it
tblHRData using Table Design as shown
in the image. Make sure to select the
relevant data type according to fields. Advance Imaging Handling Databases with Research
Now we will work with One-to-One Relationship in MS Access. This relationship is used
to relate one record from one table to one and only one record in another table.
1. Go to the Database Tools tab, click
on the Relationships option.
2. Select tblEmployee and tblHRData
holding the shift key and then click
on the Add button to add them to
our view and then close the Show
Table dialogue box.
3. To create a relationship between
these two tables, use the mouse,
and click and hold the EmployeeID
field from tblEmployee and drag
and drop that field on the field
we want to relate by hovering the
mouse right over EmployeeID from
tblHRData.
4. When you release your mouse
button, Access will then open the
Edit Relationships window.
57
The City School 2021-2022
5. This window relates EmployeeID
of tblEmployee to EmployeeID of
tblHRData. Now click on the Create
button and now these two tables are
related.
6. The relationship is now saved
automatically and there’s no need to
click on the Save button. Now that we
have the most basic of relationships
created, let us now go to the table side
to see what has happened with this
relationship.
7. Open and enter 5 random records of an
employee in tblEmployees table. Here,
on the left-hand side of each record, you
will see a little plus sign by default. When
you create a relationship, Access will
automatically add a sub-datasheet to
that table.
3.9. Simple and Complex Queries in MS Access
Database tables can hold a lot of records, in some cases,
millions or billions of them. Queries allow you to pull
information from one or more tables based on a set of
search conditions that you define.
A query is a special “question” you apply to the
database to find specific data and get the information
you want. For this task, let’s continue working with the
Employee table we have used before.
58
The City School 2021-2022
Planning a Query
When planning a query that uses more than one table, you should go through these
four steps:
Advance Imaging Handling Databases with Research
Pinpoint Identify
Knowing precisely what question you Know every type of query result
want to answer is essential to building you want included in your query
a useful query. results.
Locate Determine
Know the fields that you need to Know the criteria the information
include in your query and the tables in each field needs to meet and the
they are contained in. information you need to display.
59
The City School 2021-2022
Creating Queries in MS Access
Example 1: For this task, let’s continue working with the Employee table we have used
before. Let us suppose that we need the data of our employees with their first name,
last name and their salaries which are higher than 3500$.
Pinpoint Employees who earn more than $3500
Identify FirstName, LastName, StartSalary
Locate tblEmployee (EmployeeID, FirstName, LastName)
tblHRData (StartSalary)
Determine StartSalary>$3500
1. Click on the Query Design option from the create
tab.
2. A new window will open with the name of Show
Table.
3. Select and add tbleEmployee and tblHRData.
4. For the first column select the employee’s first
name.
5. In the second column select employee’s last
name.
6. In the third column select StartSalary.
7. We can get the data from both tables accurately
as both table’s EmployeeID fields are related to
each other using PK and FK.
8. After selecting the fields for a query, you can see
the name of fields and other options for Sort and
setting a criterion.
9. Select the Ascending option from the first column
(FirstName).
60
The City School 2021-2022
10. In the third column enter
the criteria for salaries as
preferred. In the example, we
have entered >3500. Which
means that employees who
have salaries greater than
3500 will be listed in ascending
order after executing the Advance Imaging Handling Databases with Research
queries.
11. Save the query by using the right click on the query tab and save it with any
preferred name. In the example, we have saved the query with the name of Salaries
Greater than 3500.
12. Close the tab and run the query from the objects panel.
Example 2: Assume that we need the list of employees who have joined after the year
2018.
Pinpoint Employees who joined after 2018
Identify FirstName, LastName, HireDate
Locate tblEmployee (EmployeeID, FirstName, LastName)
tblHRData (HireDate)
Determine HireDate>12/30/2018
1. Add the preferred columns along with
the field of HireDate from tblHRData.
2. And enter the criteria as >12/30/2018
and press enter.
3. Save the query with an appropriate
name.
4. You will see list of employees who have
joined after 2018.
61
The City School 2021-2022
Example 3: For this example, lets suppose we want to sort employees based on a
specific city based on user input.
1. In order to take user input, the query
design should look like this.
2. Save and run the query and this time
you will observe a
3. dialogue box will appear asking
parameters.
4. Enter the name of the city in the
dialog box and press OK.
5. The results would appear based on
the input specified.
3.10. Forms and Reports in MS Access
Forms in MS Access
Forms in Access are like display cases in stores that
make it easier to view or get the items that you Checkpoint
want. MS Access is not just a database software,
it also gives us the liberty to use it as a software Not Null enforces that field
cannot be left unused.
solution for business organizations, and to fulfil this Unique constraint enforces
purpose using forms are one essential part where that the data in the field
cannot be repeated.
a user can access or enter the relevant records in
a database. Since forms are objects through which
you or other users can add, edit, or display the data stored in your Access desktop
database, the design of your form is an important aspect.
62
The City School 2021-2022
Creating Forms
There are a few methods you can use to create forms in Access. One of the easiest
ways to create a form is with a wizard.
1. Open your دatabase and go to the Create
tab. In the Forms group, in the upper right-
hand corner, you will see the Form Wizard Handling Databases with Research
button. Advance Imaging
2. Click on that button to launch the Form
Wizard
3. On this first screen in the wizard, you can
select fields that you want to display on your
form, and you can choose from fields from
more than one table or a query.
4. Let us assume we want to simply have a
quick form that we are going to use for data
entry for our employee information.
5. From the Tables/Queries drop-down list,
select tblEmployees table. Click on the
double arrow to move all the fields at once
and click next.
6. After clicking next, the Form Wizard will
ask for the layout that we would like for
our form. We have the columnar, tabular,
datasheet and justified layouts. We will
choose the columnar layout here and then
click Next.
7. On the next windows we need to give a title
to our form i.e. EmployeeForm.
63
The City School 2021-2022
8. Once you have given your form a title, there will
be two more options below by which you can
open the form to see what that form looks like,
or you can begin entering information into your
table.
9. You can choose the option to modify the form’s
design.
10. Choose the first option to open the form to view
or enter information and click Finish.
11. Take a look at the following image. This is what
form looks like.
12. This is a single item form, meaning one record
is displayed at a time and further down you can
see the navigation buttons , which is telling us
that this is displaying the record 1 of 5.
13. If you click on button it will move to the next
record.
14. If you want to jump to the very last record in that form or that table, use the
button right beside that right arrow that’s the last record button.
15. If you want to add new employee information, press button to add a record.
Reports in MS Access
Reports offer a way to view, format, and summarize the information in your Microsoft
Access database. For example, you can create a simple report of phone numbers for
all your contacts.
1. Open your Database and go to the Create
tab. In the report group, in the upper
right-hand corner, you will see the Report
Wizard button.
2. Click on that button to launch the Report
Wizard
3. On this first screen in the wizard, you can
select fields that you want to list on your
64
The City School 2021-2022
report, and you can choose from fields from more
than one table or a query.
4. You can also create reports by using the queries
generated by you in printable format.
5. Let us assume we want to a report of our records
which are available in two different tables. This
report will consist of employee ID, First name,
Last Name, city, phone and StartSalary. First five Advance Imaging Handling Databases with Research
fields are from tbleEmployee and one field of
StartSalary from tblHRData.
6. After adding five fields from tbleEmployee change
the table to tblHRData and add StartSalary field.
7. In the next step select the by tblHRData option
and click next.
8. In the next window there is an option for a
grouping a record under any field, which is used
for complex reports, simply click next to the sorting
window.
9. In this window you can sort the fields as per the
preference needed for the report and click next,
options for sorting these fields are limited to four.
10. In the next window select the layout and
orientation of your report as per your preference.
11. There would be a checkbox below these settings
indicating “Adjust the field width so all fields fit
on a page”. Keep this option checked as it will
automatically adjust all the placement smartly and
properly.
65
The City School 2021-2022
12. In the next window name your
report as per your preference, below
this option you will see an option for
preview and modification select the
Preview option and click finish.
13. This would be the output of your
report.
14. As you can see the Employee ID
heading is somehow left out. This
can be fixed using the design view
mode.
15. To access the design view mode
right click on the tblEmployee
Report Tab and click on 2nd last
option of design view.
16. From this option, you can resize the
fields of First Name and Lastname
a little short to adjust Employee ID
field like a text box in MS Word.
17. Save and close the report and
reopen it from the object menu on
the left.
3.11. Import and Export Data in MS Access
In MS Access we can import and export data from Checkpoint
multiple sources like MS Excel, MS Access, Text file
(delimited or fixed-width), XML, ODBC Databases A query allows you to pull
information from different
(For example, SQL Server). Importing and exporting tables based on a certain
criteria.
data is easy in MS Access using wizards.
66
The City School 2021-2022
Importing Data in MS Access
1. Click External Data tab and select
New Data Source in the import and
link tab.
2. Select Excel from the list. a window
will pop-up, from where you will
browse the excel sheet that you Advance Imaging Handling Databases with Research
want to import.
3. The import wizard has different
import options. For now, select the
first option and click Next.
4. The import wizard has different
options. For now, select the first
option.
5. The next window shows all the
sheets of the excel file. Select the
sheet that you want to import and
click Next.
6. The next window shows all the
records of the selected excel
sheet. Click Next.
7. The next step is to select
primary key for the table. You
can either let Access select the
primary key or you can select
your own primary key or have
no primary key at all. For now,
select the first option and click Next.
8. Click Finish.
67
The City School 2021-2022
Exporting Data from MS Access
1. Go to External Data Tab and click
on the Text icon.
2. Select the file name of the location
to save the text file.
3. In the next window, Access will
show the preview of the text file
and also show the two options to
select the format within.
4. In the next window, Access will
give the option to segregate
data using different text qualifiers.
Select your preferred qualifier and
click next. The most common used
qualifier is a comma.
5. At this step Access will reconfirm the
file name and its location on your
computer.
6. Click finish if there are no changes required.
7. This data can be used in other software using Text
or CSV format importing.
3.12. Microsoft Forms
Microsoft Forms allows Office 365 users to
create custom surveys, quizzes, polls and Checkpoint
questionnaires in minutes. It is a great way Forms allow to dd, edit, or
to ask quick questions and receive feedback display the data stored in
or conduct an in-depth survey with up to database.
Reports allow to view,
5000 responses. Microsoft Forms allows the content created format, and summarize the
to be sent as an invitation to other users and be filled out on information database.
any O365 compatible device. The creator can see realtime
results and use inbuilt statistics or export the data for further
analysis.
68
The City School 2021-2022
Accessing Forms
1. Open a web browser and go to
https://forms.office.com/
2. Log in with your email address
and password.
Creating a New Form
1. From the Forms home page click Advance Imaging Handling Databases with Research
New Form, which opens a blank
form.
2. Click Untitled form to edit the title
and add a description.
3. The form auto-saves, a save
indicator in the top left corner
confirms when completed.
4. Click Add New to create content.
5. Choose the type of question:
Multiple Choice, Text, Rating, Date
or Ranking.
6. Fill in required fields for the
selection – available options will
change depending on the question
chosen.
69
The City School 2021-2022
Adding Media to Form
1. Click Media to add media (image or video)
to a question.
2. Select Image or Video.
3. To add an image, you can select image
directly from web, from your OneDrive
folder or upload from your computer
4. To add video, click the video option.
5. Paste the YouTube URL (web address)
of the video into the URL box (this works
with Private, Unlisted and Public YouTube
videos).
6. Click Add.
Sharing the Form
Once complete, use the toolbar options to preview, add a theme or share the form.
Preview the form to Select a colour or theme Share the form with
see how it looks on a to apply to the form or the participants
computer or mobile upload a custom banner and choose sharing
device. image. settings
70
The City School 2021-2022
There are three options for sharing forms
1. Send and collect responses
2. Share as a template
3. Share to collaborate
To share the form:
1. Click Share from the Form toolbar
2. Choose an audience from the drop- Advance Imaging Handling Databases with Research
down menu.
3. Forms sent to people within
organization can be set to record
the person’s name, forms sent to
external email addresses will only
record the respondents name as
anonymous.
4. To generate a link for the form,
click Copy next to the link box, this
link can be emailed or sent as a
message.
View Form Responses
Once you have created the form and shared with the required audience, it is important
to view the responses of the participants for analysis puroses. You can view the
responses of participants by clicking on the Responses tab on the top of the form. The
responses tab gives you a complete view of the results of your form.
71
The City School 2021-2022
The responses tab gives you the following information.
Responses show the Average time taken Active shows that the form
number of participants by the participants to is still actively accepting
who responded. complete the form. responses.
View results of each View the results of Analysis of the responses
individual participant. form in excel sheet recorded.
View Saved Forms
To view saved Forms or Forms you
have been granted edit access to, go
to https://forms.office.com. Once you
sign-in, you can view all the saved
forms and the forms that are shared
with you.
72
The City School 2021-2022
Let’s Review
1. A structured set of data held in a computer that is accessible in various ways is
called Database.
2. Tables are composed of horizontal rows and vertical columns, with small
rectangles called cells.
3. Field is a way of organizing information by type. Whereas, A record is one unit
of information.
4. A primary key in a database uniquely idenfies each record.
5. A foreign key is a column or group of columns in a relational database table
that provides a link between data in two tables.
6. Not null constraint enforces that this field cannot be left unused.
7. Unique constraint enforces that the data entered in this field cannot be
repeated or all the values entered should be unique to each other.
8. A query is a special question you apply to the database to find specific data
and get the information you want.
9. Forms allow to add, edit or display the information stored in the database
10. Reports allow you to view, format and summarize the information database.
11. Microsoft Forms allows Office 365 users to create custom surveys, quizzes, polls
and questionnaires.
My Notes!
73
Most Downloaded
Apps of 2020
TikTok WhatsApp Facebook
850 Million Downloads 600 Million Downloads 540 Million Downloads
Instagram Zoom Messenger
503 Million Downloads 477 Million Downloads 404 Million Downloads
Snapchat Google Meet Netflix
281 Million Downloads 254 Million Downloads 223 Million Downloads
Developing Applications
Student Learning Outcomes
After going through this chapter, students will be able to:
1. Understand characteristics of good UI design
2. Familiarize with user-interface and IDE of visual studio
3. Use control elements and edit its properties
4. Understand the use of variables and common data types
5. Understand conditional and looping statements
6. Understand what events and mouse events and its types
7. Understand public and private functions
8. Understand what are modules in VS
9. Create a module using Subroutines
10. Understand the use of comments
11. Understand what error handling and its importance
ISTE Student Standard Coverage
Empowered Innovative Computational Creative
Learner Designer Thinker Communicator
1a 1d 4c 5d 6b 6c 6d
The City School 2021-2022
4.1. What is User Interface Design
The user interface is the graphical layout of an
application. It consists of the buttons users click on,
the text they read, the images, sliders, text entry
fields, and all the rest of the items the user interacts
with. This includes screen layout, transitions,
interface animations and every single micro-
interaction. Any sort of visual element, interaction,
or animation must all be designed.
4.2. Characteristics of Good User Interface
A good interface makes it easy for users to tell the computer what they want to do, for
the computer to request information from the users, and for the computer to present
understandable information. Clear communication between the user and the computer
is the working premise of good UI design.
Clear
A clear interface helps prevent user errors, makes
important information obvious, and contributes to
ease of learning and use. If people can’t figure out
how your application works or where to go on your
website they’ll get confused and frustrated. The tooltip feature can give
information about the tool
Consistent
A clear interface helps prevent user
errors, makes important information
obvious, and contributes to ease of
learning and use.
Google search Google Images
76
The City School 2021-2022
Simple
The best interface designs are simple. Simple
designs are easy to learn and to use and give
the interface a consistent look. Good design
requires a good balance between maximizing Developing Applications
functionality and maintaining simplicity through
progressive disclosure of information.
Google search
Direct
Users must see the visible cause-and-effect
relationship between the actions they take and
the objects on the screen. This allows users to
feel that they are in charge of the computer’s
activities.
Responsive
Error
Responsive also means the interface provides
some form of feedback. The interface should talk
back to the user to inform them about what’s
happening.
Attractive
Every visual element that appears on the
screen potentially competes for the user’s
attention. Provide an environment that is
pleasant to work in and contributes to the
user’s understanding of the information
presented.
77
The City School 2021-2022
4.3. Bad User Interfaces
A user interface that doesn’t follow the guidelines for good user experience can cause
frustration or even hours of missing productivity depending on the importance of the
program’s job. Bad user interfaces:
• Not adaptable to different kinds of screen and do not provide appropriate
feedback i.e. they are unresponsive.
• Have clumsy layout. Although it is important to make the design attractive to the
eyes, but more importantly, it has to be functional.
• Lack proper navigation.
• Possess illegible text and font styles that make it difficult for the user to read and
interact with the content.
78
The City School 2021-2022
4.4. Getting Started with Visual Studio
This chapter focuses on the use of Microsoft Visual Studio IDE (integrated
development environment), it is used to develop computer programs, as well as
websites, web apps, web services and mobile apps. Developing Applications
Writing Your First Program in VS
Let’s start by creating windows form program using visual studio IDE:
1. Open visual studio and click New Project, select Windows Form Application and
type the name of the program.
2. On the lower right of the screen, you can see the Properties panel which allows
you to define various properties of the currently selected element on the design
view. Some commonly used properties are: the Text Property which defines the title
of the selected element, the Name Property which defines a name with which we
can refer to the selected element in our program’s code and the Enabled Property
which defines if the selected element will be usable or disbaled.
79
The City School 2021-2022
3. The form we have created is currently empty and to make it purposeful we add
elements called Controls.
4. To access these controls, place the mouse cursor on the extreme left of the screen
where Toolbox is written and click on the pin icon to show the toolbox panel
permanently. Drag and drop a button and label from toolbox on to the form.
5. Select the button and change the text to “Say Hello World” from properties panel
on the right. Then scroll down the properties panel and in Design section change
the (Name) to btnReaction
80
The City School 2021-2022
6. Do the same with label properties and change the name with lblReaction. Developing Applications
7. Designing of form layout is complete now we will program the control Button so
when we click the button it will trigger the command to show the text in the Label
control.
8. Double click on the Button control and a script window will appear where there is
a lot of code already present relative to the button functionality, although we want
this button to trigger our desired text in the Label control.
9. Click on the debug button or F5 to execute the program in debugging mode.
If there is an error in the program it will show the warning/problem or else the
program will execute.
81
The City School 2021-2022
10. The program window will appear and if you click the Say Hello World button, the
label’s text changes to Hello world! Exactly as we have programmed.
Each time you test your program by clicking the Start Debugging button, an
application executable file is created in ...\Projects\[project name]\[project name]\
bin\Debug. For example, for the First VB Form project, the .exe file can be found
under ...\Projects\HelloWorldApplication\HelloWorldApplication\bin\Debug\
HelloWorldApplication.exe.
4.5. Basic GUI Controls in Visual Basic
Button
It is used as a standard Windows Button. In most cases, the Button Control is used to
generate a click event,
A Label
It is used to display some informative text on the GUI which is not changed during
runtime.
Radio Button
Radio Button is one of the popular ways of limiting the user to pick just one option.
Checkbox
Checkboxes are similar to radio buttons in the way that they are also used in groups,
however, a user can select more than one item in the group.
82
The City School 2021-2022
Textbox
It is used to accept textual input from the user. The user can add strings, numerical
values and a combination of those.
Combo Box Developing Applications
It is similar to the list but it works as a dropdown for the user. A user can click on the
downwards aero on the right side and select any item
DateTime Picker
This control allows the user pick the date and time via a Calendar and a clock.
4.6. Variables 4 2.5
A variable is nothing but a name given
to a storage area that our programs can
manipulate.
A variable is a container of data in a computer’s
memory where the computer stores the “hello” “a”
different types of data and this could be
numeric or text. To create and access these
Variable (data containers) we name them so
we can call them in our program where it is
necessary.
Public and Private Variables
var a=1 Public variable
Public variables are variables that are accessible to
the whole program. Private variables are variables
that are accessible only to a certain part of the var b=2 Private variable
program or code.
83
The City School 2021-2022
Declaring a Private Variable
It is used to accept textual input from the user. The user can add strings, numerical
values and a combination of those.
In visual studio, we can declare the variable by the keyword Dim which is a short form
for dimension. For better understanding, we will create a program using 2 variables
and calculate them to see its working. Follow these steps to create a program with
variables in it:
1. Create a new form and name that form as
Variables.
2. Add 2 text fields from the toolbox in the
form.
3. Add 1 button from the toolbox in the form
and change the text property of the button
to Add from properties panel.
4. Add 1 label from the toolbox in the form
and change the text property of the label to
Result from the properties panel
5. Double click on the Add button and enter
this code as shown in the example below.
Click on the debug button or F5 to execute
the program in debugging mode.
6. The = here is an assignment operator, a
symbol used to assign the value on the How Does it Work?
right of the sign to the variable on the left. • The 1st and the 2nd line of code are
where we have declared the variables
So here, the content of TextBox1 is stored in with its data type which is an integer in
variable number1. this case.
• In the 3rd and 4th lines, we have
7. Note here that although whatever you write declared the value of a variable. In this
in a text box is considered as String. Visual case, we are taking the user input from
the textbox.
Basic automatically converts it to a number
• In the 5th line, our code adds the two
since the variable number1 is declared as variables and puts the sum as text into
Integer. Label1.
84
The City School 2021-2022
Declaring a Public Variable
Declaring a public variable is not different from declaring a private variable. The only
difference is that the public variable is accessible from anywhere in the whole program.
Follow the steps below to create a program for a simple counter by using a public
variable. Developing Applications
1. Create a new form and save it with
the name of Simple Counter.
2. Add 2 buttons from the toolbox.
Change the text property of one
button to Reset and set the text
property of the other button to Add
from the properties panel.
3. Set the name property of Reset
and Add button to btnRst and
btnAdd respectively.
4. Add a label from the toolbox and
set the text property to Result from
the properties panel.
5. Now that both elements codes are
included in the script, we will create How Does it Work?
a public variable that is accessible • Reset button code which will declare the
for both buttons/elements. pub variable to 0. pub is the public variable
Label1.Text = pub will display the text of pub
variable in Label1 element.
• Add button code will add 1 to the current
value of the pub variable. Label1.Text = pub
will display the text of pub variable in Label1
element after adding 1 every time the button
is pressed.
Mobile App vs Website
A website of browser-based HTML pages that are linked together and accessed
over the Internet. Mobile apps are actual applications that are downloaded and
installed on your mobile device, rather than being rendered within a browser.
85
The City School 2021-2022
4.7. Data Types
Variable Type Common language Value Range
runtime type structure
Boolean Boolean True or False
Byte Byte 0 through 255 (unsigned)
Char (single Char 0 through 65535 (unsgined)
character)
Date Date and Time 0:00:00 (midnight) on January 1,
0001 through 11:59:59 PM on
December 31, 9999
Decimal Decimal 0 through +/ 79,228,162,514,264,337,
593,543,950,335 (+/- 7.9...E+28)
with no decimal
oint; 0 through +/-
7.9228162514264337593543950335
with 28 places to the right of the
decimal;
smallest nonzero number is +/-
0.00000000000000
00000000000001 (+/-1E-28)
Integer Int32 -2,147,483,648 through 2,147,483,647
(signed)
Long (long integer) Int64 -9,223,372,036,854,775,808 through
9,223,372,036,854,775,807
(9.2... E+18) (signed)
Object Object Any type can be stored in a variable
of type Object
String (Variable- String (class) 0 to approximately 2 billion unicode
length) characters
86
The City School 2021-2022
4.8. Conditional Statements
Programming is all about giving autonomy to the computers. Computers have limited
intelligence and they can’t make decisions on their own unless we program them
to take decisions. Therefore, decision making is an essential part of programming.
Decision making statements allow to specify one or more conditions to be executed Developing Applications
if the condition is determined to be true. Through decision making statements, we can
write a program that will be able to respond to user input during its execution and give
different results for different inputs. This process is possible with the use of conditional
statements or If…Then statements
If...Then Statement
Follow the steps below to create a simple program using condition statements:
1. Create a new form by dragging two
labels, one button and one text box
from the toolbox panel, as shown in
the example.
2. Edit the first label’s text property to
Enter your lucky number.
3. Change the name property of the
text box to TextboxNumber.
4. Edit the button text to Try your luck
and change its name to btnCheck
5. Edit 2nd label’s text property to
Result and its name property to
lblResult
6. Double click on the Try your luck How Does it Work?
button to open the script window.
1. In the first line, we have declared a variable
7. Enter the code as shown. “number” as an integer.
8. Press the debug button to run the 2. In the second line, we have assigned the value of
number variable to TextboxNumber which is a user
code. input text box.
3. In the third line, we set a conditional statement that
if the user input number is greater or equals to 7
then display the message “Congratulations you
win!” in the “lblResult” Label element.
87
The City School 2021-2022
If...Then...Else Statement
An other variant of the conditional statement is the If…Then…Else statement. This
allows you to define instructions to be executed if the condition is false. For example,
let’s say we want the previous program to display a relevant message to the user not
only when the correct number is found but also when a wrong number is inserted.
Add the else block in previous your code to understand how If...Then...Else statements
work.
If...Then...ElseIf Statement
If there are more than two choices to display, using the If...Then...Else statement is not
enough. To provide more choices, we can use the If...Then...ElseIf statement. In the
following example, we have created a program that translates a student’s score to the
corresponding grade.
Follow the steps below to create the program using If…Then…Elself statement:
1. Create a new form with three labels,
one text box and a button.
2. Edit the text for the first label to Enter
Your Score.
3. Edit the button text to Show Grade.
4. Edit the text of the second label to
Your Grade:
5. Place the third label adjacent to the
second label and we will use this label
88
The City School 2021-2022
to generate the grade in it, edit the label text to Grade not generated yet and also
change the name of this label to lblGrade from the properties panel.
6. Enter the code as shown in the example:
How Does it Work? Developing Applications
• The first condition score >= 90 is evaluated and
if it is true, then the variable grade takes the
value A.
• If a condition is found true, the following
conditions are not evaluated and the
instructions under End If are executed.
• If a condition is evaluated as false, then the
next condition is evaluated and so on, until a
condition is true.
• If none of the conditions are found to be true,
then the code under Else is executed which has
a string value of “Need Improvement”.
4.9. Conditional Operators
Checkpoint
Conditional operators refine the statement you’re Good UI are clear, consistent,
testing for. For instance, you can specify the simple, direct, responsive and
attractive.
statement whether it’s greater than, less than, and a A variable is a name given
whole lot more. to storage area that the
programs can manipulate.
Operator Meaning
= Equal too
> Greater than
< Less than
>= More than or equal to
<= Less than or equal to
<> Not equal to
89
The City School 2021-2022
Logical Operators
Logical operators are similar to Boolean expressions that return a boolean result.
These operators are called binary because they acquire two operands.
Operator Meaning
AND Both sides must be true
OR One one the two conditions must be true
XOR One side or other must be true but not both
NOT Negates truth
4.10. Looping Statements
In computer programming, a loop is a sequence of
instructions that is repeated until a certain condition
is reached. An operation is done, such as getting an
item of data and changing it, and then some condition
is checked such as whether a counter has reached As of 1st quarter 2020, Google Play
store contains 2.9 million apps, while
a prescribed number. In Visual Basic, we have two Apple AppStore is the second-largest
app store with approximately 1.85
different structures that support repetitions, or loops million available apps for iOS.
as they are called in programming languages.
For...Next Loop
What if we want to add all the integers from 1 to 50? Of course, we are not going to
start writing 1+2+3+…, we are going to program the computer to do the same thing
using loops.
Follow the steps below to create a program using Loops.
1. Create a new form. Drag two labels and one
button from the toolbox panel and place on the
form.
2. Set the text property of first label to
1+2+3+...+50:
3. Set the text property of the second label to
result and set its name property to lblResult.
90
The City School 2021-2022
4. Set the text property of the button to Calculate and set its name property to
btnCalculate.
5. Double click the btnCalculate to open the script window.
6. Enter the code as shown:
How Does it Work? Developing Applications
• In the 1st line declare the “i” variable as an
integer.
• In the 2nd line declare the “sum” variable as an
integer.
• In the 3rd line set the value of “sum” to 0.
• In the 4th line For loop is defined that i=1 to 50
means it will run 50 times and increment 1 in the
value of sum.
• In the 5th line, while the loop runs every time it
will add the value of “i” in the sum variable.
Do...Next Loop
Do...Next loop is used when we don’t know exactly how many times this loop will run.
Do loop will run until a condition is met or while a condition is true. Follow the steps to
create a program to add all integers starting from 1 until the sum is 500 or greater.
1. Create a new form. Drag a button control and a
ListBox control from the toolbox panel and place
it on the form.
2. Set the text property of the button to Calculate
and its name property to btnCalculate.
3. Set the name property of the listBox to lstResults.
4. Double click the Calculate button to open the
script window.
5. Enter the code shown:
91
The City School 2021-2022
How Does it Work?
• The Do…Loop structure does not increment
any counter variable automatically, so we have
included the instruction i = i + 1 to increment it by
one inside the loop.
• With the instruction lstResults.Items.Add(i & vbTab
& sum), we add one line in each loop to the
ListBox, containing the current counter value and
the current sum.
• The & operator is used to concatenate the
different values into a single line and the vbTab is
a predefined constant of Visual Basic representing
a tab space.
• The loop here runs for as long as the value of the
sum is smaller than 500.
4.11. Event Handling
Events are basically a user action like key press, clicks, mouse
movements, etc., or some occurrence like system generated
notifications. Applications need to respond to events when they
occur.
Mouse Event
Mouse events occur with mouse movements in forms and controls. Following are the
various mouse events:
Event Description
MouseDown It occurs when a mouse button is pressed
MouseEnter it occurs when the mouse pointer enters the control element
MouseHover it occurs when the mouse pointer hovers over the control
element
MouseLeave it occurs when the mouse pointer leaves the control element
MouseMove it occurs when the mouse pointer moves over the control
element
MouseUp it occurs when the mouse pointer is over the control element
and the mouse button is released
92
The City School 2021-2022
Follow the steps to create a program in which we will detect the MouseHover
event in VS. In the following example, we are going to display a pop-up window
containing a message, whenever the mouse hovers on the button inside our
program’s form.
1. Create a new form only with one Developing Applications
button.
2. Double click on the button to open
the script menu and then open the
general tab on the top of the current
script window as shown in the example.
3. Select (Form1 Events).
4. Then open the declaration window right
next to it to select the MouseEvent by
scrolling down which is MouseHover in this case. After selecting the MouseHover
option from the declaration window, additional code will automatically be added. In
that part, we will add a predefined feature MsgBox().
5. Next, we will declare a string value to display in parenthesis of this MsgBox(“this
popup window appears whenever the mouse hovers on this button”)
6. Execute the program by pressing the debugging button to test the program.
4.12. Functions and Subroutines
Function is a type of procedure that returns a value that is passed on to the main
procedure to finish execution. A function is similar to a subprocedure but there is one
major difference, a function returns a value whilst a subprocedure does not.
In Visual Basic 2010, there are two types of functions:
• the built-in functions
• user-defined functions-functions created by programmers
Creating user-defined functions
To create a user-defined function in Visual Basic 2010, you can use the following
syntaxes:
93
The City School 2021-2022
Private Function functionName (Argument As dataType....) As dataType
Public Function functionName (Argument As dataType....) As dataType
Public: The keyword public indicates that the function applies to the whole project.
Private: The keyword private indicates that the function only applies to a certain
module or procedure.
Arguments: The argument is a parameter that can pass a value back to the function.
There is no limit to the number of arguments that can be added.
To demonstrate how user-defined functions are created, let create a BMI calculator
that can caluclate the body-mass index of a person based on his or her body weight
in Kgs and heign in meters. BMI can be calculated using the formula: weight/(height)2,
where height is measured in meters and weight in Kgs.
Following are the range of BMI values to determine weight status:
• underweight: <18.5
• normal weight: 18.5-24.9
• overweight: 25-29.9
• obesity: >30
1. Create a new form. Drag four
labels, two textboxes and one
button from the toolbox.
2. Set the name property of the labels
as: Height, Weight BMI and Result
respectively. Set the name property
of Result label as lblBMIResult.
3. Set the text property of button to
Calculate BMI and name property
of the button to btnBMI.
4. Double click on the button to open
the script window.
5. Enter the following code to create a
function.
94
The City School 2021-2022
4.13. Modules
Visual Basic application source code is structured
into module files with a .vb suffix. By default, Visual Checkpoint
Studio creates a separate module file for each form Decision making statements,
in an application containing the code to construct give different results for different Developing Applications
inputs.
the form. For example, the code to create a form Loops allow a sequence of
instructions to be repeated until
called Form1 will be placed in a module file named a certain condition is reached.
Form1.Designer.vb. Similarly, any code that has
been defined by the developer to handle events from controls in the form will be
placed by Visual Studio into a module file called Form1.vb. Using modules in VB
are recommended while creating a complex application as they save space in
your code and also assist to reuse of code like functions.
Follow the steps below to create using modules:
1. Create a form with one text box and
a button and change the text to
“Code from Module”.
2. Right-click on the project from the
solution explorer window and go to
Add and then go to Module and
click
3. In the next window Module will be
automatically selected give the
name to Module or just click on
Add.
4. After that, you will see the Module1.vb will start appearing in the solution explorer
window and the script window of the module will also open.
5. In between the Module and End Module lines, we will add our Subroutine.
6. Using an element from another form in a module requires a declaration with the
name of the form. In this case Form1.TextBox1 is the name of the element from the
other form and its text will appear in the vbinformation box with the title defined as
a string.
95
The City School 2021-2022
1. Now go back to the form and
double click on the button to open
the script window
2. It is highly recommended to use
the comments while using code
from a module to remember its
functionality. Commenting is easy
in VB using a ‘ single quote.
3. To use the Subroutine/Function in
this form we will simply write its
name in this case Pakistan().
4. The green line above the sub with
a single ‘ quote is the comment.
4.14. Program Debugging and Error Handling
Error handling is an essential procedure in Visual Basic 2010
programming that helps make a program error-free. The
user does not have to face all sorts of problems such as
program crashes or system hangs.
Errors often occur due to incorrect input from the user. For
example, the user might make the mistake of attempting to
enter text (string) to a box that is designed to handle only numeric values such as the
weight of a person, the computer will not be able to perform the arithmetic calculation
for text, therefore, will create an error. These
errors are known as synchronous errors. To
demonstrate error handling, we will deal with
the error of entering non-numeric data into text Checkpoint
boxes that are supposed to hold numeric values.
The program_label here is error_hanldler. When Function is a type of procedure that
returns a value that is passed on to
the user enters non-numeric values into the the main procedure to finish
execution.
textbox, the error message will display the text A module is used to organise code
and wrap up variables, properties,
“One of the entries is not a number! Try again!” If events, and procedures of similar
no error occurs, it will display the correct answer. use.
96
The City School 2021-2022
1. Create a new form. Drag five labels, two text boxes, and a button and place it on to
the form.
2. Set the text property of the 1st
label to First Number and its name
property to firstNumber. Developing Applications
3. Change the text of the 2nd label
to Second Number and its name
property to secondNumber.
4. Set the text property of the 3rd label to Division.
5. Set the text property of the 4th label to Result and change its name to lblAnswer.
6. Clear the text of the 5th label to hide it while the program is running and name it
lbl_errorMsg.
7. Set the text property of the button control to Calculate and also change its name
property to CmdCalculate.
8. Double click on the button to open script window and type this code.
97
The City School 2021-2022
Let’s Review
1. The user interface is the graphical layout of an application.
2. A good user interface is clear, consistent, simple, direct, responsive and
attractive.
3. Public variables are variables that are accessible to the whole program.
4. Private variables are variables that are accessible only to a certain part of
the program or code.
5. Decision making statements allow to specify one or more conditions to be
executed if the condition is determined to be true.
6. Logical operators return boolean result.
7. Loop is a sequence of instructions that is repeated until a certain condition is
reached.
8. Events are a user action like key press, clicks, mouse movements, etc
9. Function is a type of procedure that returns a value that is passed on to the
main procedure to finish execution.
10. Error handling is an essential procedure that helps make a program error-
free.
My Notes!
98
Robot Profile
Sophia is the world’s first robot citizen and the first robot
Innovation Ambassador for the United Nations Development
Programme. Sophia was created to help people in real
uses like medicine and education, and to serve AI research.
Her very existence provokes public discussion regarding AI
ethics and the role humans play in society, especially when
human-like robots become ubiquitous.
Sophia 2020 Key Features
Expression
Appearance • Integrated set of human-like emotional
• Human-sized appearance expressions
• Most realistic human-like expressive face • Sentence and context understanding
• Patented artificial skin with cloud connection
• Customized skin tone, facial design, • Mouth, face and whole body motion
language and arm colors available
synchronized with speech output
Sensors Motion
• Face detection and body tracking • 74 degrees of freedom
• Can be programmed for wide range of • Articulated fingers, arms and shoulders
physical interaction tasks • Three different rolling base options
including self- navigating
• 600 gr. payload for each hand
Programming Robots
& Single Board Computers
Student Learning Outcomes
After going through this chapter, students will be able to:
1. Understand what single board computers is
2. Understand what Raspberry Pi, Raspbian OS and its components
3. Understand the components of Raspberry Pi
4. Understand the basics of Python Programming Language
5. Create an electric circuit using jumper wires, breadboard, resistor & LED
6. Understand what SONAR and Servo motor
7. Create and code a program for interacting with SONAR
8. Create and code a program for interacting with Servo Motor
9. Build a smart robotic car
ISTE Student Standard Coverage
Empowered Computational Creative Global
Learner Thinker Communicator Collaborator
1a 1d 5a 5d 6d 7c