Upload
buihanh
View
226
Download
6
Embed Size (px)
Citation preview
i
INDEX
Content
Page
Chapter I :Problem Solving 1
Problem Solving. 2
Problem Solving Stages. 2
Flowchart. 4
Simple Flowchart. 5
The use of Branching (Decision) in Flowcharts. 10
The use of Loop in Flowcharts. 15
Questions. 21
Chapter II :Introduction to Visual Basic .Net 25
Visual Basic.Net Programming. 26
.NET framework. 29
Main elements of (IDE) screen. 29
Create a New Project. 33
Add a new Form to the Project. 35
Save the (Project) in one of the storage devices. 36
Add a new (Project) to the (Solution). 37
Questions. 39
Chapter III :Controls 43
Form: 44
o Setting the properties(Name),(Text). 45
o Setting the properties ، (BackColor), (RightToLeft) ,
(RightToLeftLayout) ,(MaximizeBox) ,(MinimizeBox) , (ControlBox) ,(FormBorderStyle).
47
o Setting the properties (ShowInTaskbar), (StartPosition), (WindowState).
52
Button: 55
o Draw a Command Button on the (Form). 55
o Setting the properties ( Location),( Size). 56
o Setting the properties (ForeColor) , (Font),
(BackColor). 58
ii
INDEX
Content
Page
Label: 59
o Setting the properties (AutoSize) , (BorderStyle). 59
Textbox: 61
o Setting the properties (MaxLength), (PasswordChar),
(MultiLine). 61
ListBox: 63
o Setting the properties (Items),(SelectionMode),(Sorted).
63
ComboBox: 65
o Setting the properties (AutoCompleteMode),
(AutoCompleteSource). 65
GroupBox. 67
RadioButton. 68
CheckBox. 71
Questions. 72
Chapter IV:Code Window 75
Code Window. 76
Event Handler. 77
Setting the (Properties) programmatically. 83
Questions. 86
Sample Test (1). 89
Sample Test (2). 92
Sample Test (3). 94
Problem Solving [
By the end of this chapter, student will be able to:
Define the problem
Identify the problem solving stages
Write steps that solve the problem “Algorithm”
Draw flowcharts
Problem Solving [
By the end of this chapter, student will be able to:
Define the problem
Identify the problem solving stages
Write steps that solve the problem “Algorithm”
Draw flowcharts
(2)
Problem Solving Chapter one
In your daily life, you may face problems through various activities. A problem means
an objective or an output that we have to achieve, for example preparing a meal is
considered a problem, and we have to follow consecutive steps sequentially to attain
the required objective and get the meal.
Consider the following problem:
The problem is: Baking a cake according to certain specifications, input available are
the ingredients (such as eggs, flour, milk …etc.), then followed by activities or
procedures that should be done sequentially, taking into consideration that any
mistake happens by doing any procedure before the other, results in an unsuitable
and undesirable cake.
In this book, we focus on Problem Solving techniques using the computer.
First: Problem Definition: Problem definition implies the identification of required outputs, available inputs
and, arithmetic and logical operations to be executed.
Second: Performing step-by-step instructions (Algorithm) to solve a
Problem
The problem is defined as the objective or the specific output that we want to attain; through a sequence of steps and activities and, specific input.
Algorithm is defined as a group of logically arranged procedures to be executed to attain a goal or precise output, out of specific inputs.
(3)
Problem Solving Chapter one
After identifying and analyzing the problem, outputs and, inputs; a plan in the form of
a series of successive steps is made, which is called an (Algorithm), devised by the
Mathematician and the founder of Algebra “Muḥammed ibn Mūsā al-Jwārizmī”.The
algorithm is represented by drawing “Flowcharts” that will be explained later in this
chapter.
Third: Program design
Having drawn a “Flowchart”, to solve the problem, using a computer; we have to
translate this flowchart into one of the programming languages.
Fourth: Program Testing
During writing a program we unintentionally make some mistakes; e.g. writing a
minus sign (-) instead of (+). We can’t detect errors unless we begin entering data to
the program with previously known results; to compare the results of the current
program to those of the well-known results; therefore we check the errors and debug
them.
Fifth: Program Documentation
All steps taken for solving the problem that include: given Input, output, plan for
solving the problem, drawn flowchart, programming language used for coding and,
instructions, date of last modification of the program and, people who contribute to
the program development process, to have the program documented to go back for
feedback and correction.
The documentation is beneficial when more than one person participate in writing or
modifying the program.
(4)
Problem Solving Chapter one
Flowchart promotes understanding of a problem and shows what tasks should be
performed when writing program codes; and so coding becomes an easy task for a
programmer. A Flowchart explains the program to others, and that it is also
considered a convenient tool for documenting a program especially if it is
complicated.
Most Flowcharts are drawn using standards (commonly used) symbols that have
specific meanings. Special symbols can also be used for exceptional cases.
The most commonly used symbols are as follows:
Table (1-1) Common symbols for Flowcharts
symbol Significance
(Terminal)
( Input/Output)
(Process)
(Decision)
(Flow Lines)
Flowchart is a diagram that uses standard graphical symbols; to illustrate the sequence of steps required for solving a problem or specific question.
(5)
Problem Solving Chapter one
We will demonstrate problem solving steps (Algorithm) using flowcharts, through the
following progressive examples:
First: Define the problem Output: The sum of two numbers Input: The first number is “A “and the second number is “B” Solution: C =A+B where the result is C
Table (1-2) Algorithm and Flowchart to add two numbers
Third :Flowchart Second :Algorithm
1 Start
2 Enter the number A and the
number B
3 Performing the sum of the two
numbers using this equation
C=A+B, the output is C
4 Print C
5 End
Start
Enter A and B
C=A+b
Output C
End
(6)
Problem Solving Chapter one
1-The flowchart should start with the Start symbol and end with the
End symbol.
2-A,B,C are variable names .A Variable refers to a memory storage that holds a value.
3-The equation: C =A+B, indicates the sum of the value of A, to the value of B, and stores the result in C.
4-Entering values in A and B is done by using the term “Enter”, inside the parallelogram, you can also use another term to get the same meaning like “Read” or “Input”.
5-The sum equation is written inside the rectangle, as it represents an arithmetic operation.
6-The output is expressed with a parallelogram using the term “Output”, we can also use another term like “Print”.
7-Note that Lines with arrows (flow lines) are from top to bottom and show the exact order of an Algorithm.
First: Define the problem Output: The average of three numbers. Input: The number X, the number Y, and the number Z. Solution: Average =(X+Y+Z)/3 and, Product= X*Y*Z.
(7)
Problem Solving Chapter one
Table (1-3) Algorithm and Flowchart to compute the average and Product of three
numbers
First: Define the problem Output: The value of “Y”. Input: X. Solution: Compute the value of “Y” from the equation Y=3x+2.
1- The expression on the left side of any equation should contain only one variable; the value of this variable will be the (output) or the solution of the equation.
2- The expression on the right side of the equation may contain values or
arithmetic expressions that have one or more variables (inputs).
Third :Flowchart Second :Algorithm
1 Start
2 Read the values of X,Y,Z
3 Average =(X+Y+Z)/3 and
Product= X*Y*Z
4 Print the Average and the
Product
5 End
Read
X,Y,Z
Print average ,
product
average=(x+y+z)/3 product=x*y*z
End
Start
(8)
Problem Solving Chapter one
The word “Area” refers to a Variable name, whose value is the
calculated area of the rectangle; also “Perimeter” is a variable name
whose value is the calculated perimeter of the rectangle.
Variable names are chosen to reflect and indicate the content of
the variables .
Table (1-4) Algorithm and Flowchart to solve a first degree equation
Third :Flowchart Second :Algorithm
1 Start
2 Enter value of X
3 Calculate Y =(3*X+2)
4 Output value of Y
5 End
Write down the Algorithm, and draw a flowchart to compute the area and the perimeter of a rectangle ,whose length and width are known , bearing in mind that the equation of the area is : Area =L*W and that of the Perimeter is: Perimeter =2*(L+W).
Start
Input X
Print Y
Y=3*X+2
End
(9)
Problem Solving Chapter one
First: Define the problem
Output:
Input:
Solution :
Third :Flowchart Second :Algorithm
Write down the Algorithm, and draw a flowchart to calculate the area of a circle whose radius “R” is known, bearing in mind that the equation of the area is: Area =3.14*R*R.
Write down the Algorithm, and draw a flowchart to calculate the number of years, bearing in mind that the number of months is known.
(10)
Problem Solving Chapter one
Most problems include a decision point, such as yes/no question, where two
possible answers are available a “yes” and a “no”, in a flowchart the decision
point has two paths (branches), each presents one of the possible answers, you
can also find more than two answers.
First: Define the problem Output: print the word “ ناجح“. Input: the score X. Solution: If the value of X is greater than or equal 50; the word “ناجح”
will be printed.
Table (1-5) Algorithm and Flowchart to print the message “ناجح”
Third :Flowchart Second :Algorithm
1 Start
2 Enter the values of X
3 If X> =50 then
3-1 Print “ ناجح ”
4 End
The execution of step (3-1) will be done only when the value of x is greater than
or equal 50 (the result of the condition is True), then it passes to step (4);
otherwise when the value of x is less than 50 (the result of the condition is False),
then the execution is transferred to step 4 directly.
Start
Enter X
X>=50 ناجحPrint
End
(11)
Problem Solving Chapter one
First: Define the problem Output: print the result of dividing two numbers “R” or print the word .”غير معرف“Input: the dividend is “num1”, and the divisor is “num2”. Solution: if num2=0 then print “غير معرف”, otherwise print the result of
the division “R”.
Third :Flowchart Second :Algorithm
1 Start
2 Enter the dividend num1
3 Enter the divisor num2
4 If num2 =0 then
4-1 Print “غير معرف”
4-2 Go to step 7
5 R=num1/num2
6 Print R
7 End
Table (1-6) Algorithm and Flowchart to print the division of two numbers
Start
Enter num1
Num2=0
Enter num2
R=num1/num2
”غير معرف“
End
Print R
(12)
Problem Solving Chapter one
First: Define the problem Output: print the number type (even or odd). Input: the number “N”. Solution: the even number is determined if the entered number is
divisible by 2 without remainder, otherwise it will be odd.
Table (1-7) Algorithm and Flowchart to enter a number and print its type (odd or even)
Third :Flowchart Second :Algorithm
1 Start
2 Enter N
3 If N is divisible by 2 without
remainder then
3-1 Print “ لرقم زوجيا ”
4 Else
4-1 Print “ الرقم فردى ”
5 End
Start
Get N
N divisible
by 2
الرقم فردى الرقم زوجي
End
1. Step (4) is a decision (presented by a diamond) it is a comparison that
evaluates this question (is num2=0?) If the result is Yes then the word “ غير
will be printed (this; according to mathematical rules); then the“ معرف
execution will be transferred to step (7) to end the program and prevent
the execution of any division.
2. If the result of the question in (step 4) is No, the execution will be
transferred to step (5) directly because step (4-1) and (4-2) won’t be
executed.
(13)
Problem Solving Chapter one
First: Define the problem Output: print out “greater than zero” – “less than zero “- “equal zero”. Input: degree Celsius “D”. Solution: the temperature degree entered will be compared to zero.
Third :Flowchart Second :Algorithm
1 Start
2 Enter D (temperature
degree)
3 If D=o then
3-1 Print “Equal zero”
4 Else
4-1 if D<0 then
4-1-1 Print “Below zero”
4-2 Else
4-2-1 Print “Above zero”
5 End
Table (1-8) Algorithm and Flowchart to get the temperature
In this example unlike the previous ones, there are two cases for the condition,
the case when the condition is true (step 3-1); the output will be to print out
“Even”, the case when the condition is false (step 4-1); the output will be to print
out “Odd”.
Start
Get D
D =0 Print
Equal 0
End
D<0
Below 0
Above 0
(14)
Problem Solving Chapter one
First: Define the problem
Output: print out “the largest number is …...? “– “the smaller number is ...…? “
Input: X, Y. Solution:
Third :Flowchart Second :Algorithm
Modified Flowchart Flowchart
Table (1-9) Flowchart to calculate the area of a circle
Start
Input R
Print A
A= 3.14 * R * R
End
Write down the Algorithm, and draw a flowchart to enter two numbers, then Print “the largest is …? “and, “the smallest number is…? “.
The following flowchart is used to calculate the Area of a circle whose radius “R”. Repeat drawing the Flowchart so that it displays the message “not allowed “and exits from the program (When the value of “R” is negative).
(15)
Problem Solving Chapter one
Table (1-10) Algorithm and Flowchart to print the numbers from 1 to 3
Third :Flowchart Second :Algorithm
1 Start
2 M=1
3 If M<=3 then
3-1 Print M
3-2 M=M+1
3-3 Go To step(3)
4 End
Start
M<=3
M=1
Print M
End
M=M+1
1-As long as the value of M does not exceed 3, the program prints value of M. When M becomes 4 ;( M=4) the program goes to step (4).
2- The following figure is the same flowchart drawn above but in a different
way, so it does not matter the figure drawn, what really matters is the sequence of steps.
(16)
Problem Solving Chapter one
Figure (1-1) Flowchart to print the numbers from 1 to 3
value of M Result Step There is No variable 1-Start
1 2-M=1
1 3-If M<=3 (True)
1 1 3-1 Print M
2 3-2 M=M+1
2 3-3 Go to step (3)
2 3-If M<=3 (True)
2 2 3-1 Print M
3 3-2 M=M+1
3 3-3 Go to step (3)
3 3-If M<=3 (True)
3 3 3-1 Print M
4 3-2 M=M+1
4 3-3 Go to step (3)
4 3-If M<=3 (False)
4 4-End
Table (1-11) Tracking the variables and the corresponding result of exercise (1-8)
Start
M<=3
M=1
Print M
End
M=M+1
You can track the progress of the solution steps and follow each step of
the code as shown in table (1-11).
1
2
3
(17)
Problem Solving Chapter one
How many times was the content of the loop executed? …………………… What will be the value of M at the end of the loop? ……………………………
Table (1-12) Algorithm and Flowchart to print the multiplication table of No 3. Compare this flowchart to the one in the previous exercise (what are the differences).
Third :Flowchart Second :Algorithm
1 Start
2 J=1
3 If J <=12 then
3-1 Print J*3
3-2 J=J+1
3-3 Go To step(3)
4 End
1-When the value of M equals 4, the condition becomes (False). 2-We conclude that the number of repetition in the loop is pre known in this
exercise. 3- The variable M is a counter; as it causes the steps (3-1) and (3-2) and (3-3) to
be repeated for a defined number of times (3 times).
Start
J <=12
J=1
Print J*3
End
j=j+1
Track the values of the variable (J), and the printed value on executing every step in the previous exercise (write down in your notebook). What is the value of the variable (J), when the result of the condition is “False”, and the loop ends?
(18)
Problem Solving Chapter one
Table (1-13) Algorithm to print the multiplication table of an entered number
Second :Algorithm Third :Flowchart
Algorithm Flowchart
1 Start
2 Enter N
3 J=1
4 If J<=12 then
4-1 Print J*N
4-2 J=J+1
4-3 Go To step(4)
5 End
Make the necessary modifications to the Flowchart of the previous exercise, so that you can enter the required multiplication table; instead of printing the multiplication table of “3” constantly.
Write down the Algorithm, and draw a flowchart to print out even numbers from 1 to 10.
(19)
Problem Solving Chapter one
Algorithm Flowchart
1 Start
2 N=1
3 Sum=0
4 Sum =Sum + N
5 N=N+1
6 If N>3 Then
6-1 Print Sum
7 Else
7-1 Go to step (4)
8 End
Table (1-14) Algorithm and flowchart to print the sum of integer numbers from 1 to 3
Start
End
N=1
Sum=0
Sum=Sum+N
N=N+1
N>3
Print Sum
(20)
Problem Solving Chapter one
You can track the values of variables as shown in table (1-15)
Result Value of M Value of N Step
No variable No variable 1-Start
No variable 1 2-N=1
0 1 3-Sum=0
1 1 4-Sum=Sum+N
1 2 5-N=N+1
1 2 6-if N>3 (False)
1 2 7-1 Go To step (4)
3 2 4-Sum=Sum+N
3 3 5-N=N+1
3 3 6-if N>3 (False)
3 3 7-1 Go To step (4)
6 3 4-Sum=Sum+N
6 4 5-N=N+1
6 4 6-if N>3 (True)
6 6 4 6-1 Print Sum Table (1-15) tracking the values of variables and corresponding results of exercise (1-10)
Variable N is considered a Counter, while variable Sum is an accumulating
variable.
After executing the previous activity, draw the flowchart in your notebook; to print out the sum of even numbers instead of the odd ones.
Draw the Flowchart of the previous exercise in your notebook, after modifying it; to print out the sum of odd numbers from 1 to 10.
(21)
Problem Solving Chapter one
First: State whether the following statements are true () or false (X)
) ( 1- Flowcharts use symbols and lines with arrows to represent an Algorithm
) ( 2- You can use any Geometric shape to represent Algorithms when drawing flowcharts
() 3- Flowcharts can be drawn using software only and can’t be drawn on paper
) ( 4- The symbol …………….is used to represent both the start and the end
) ( 5- The rectangle symbol represents only one processing operation
) ( 6- The flow of steps will always be from top to bottom or from left to right.
) ( 7- The symbol …………….is used when a question has more than one alternative
) ( 8- Two paths (lines)should come out from the diamond … ………..symbol
) ( 9- The line with an arrow (flow line) should be from left to right or from top to bottom.
) ( 10- The (Algorithm) is the first stage of Problem Solving
Second: Inside each symbol of the following Flowcharts write the appropriate instructions. 1- The Figure shows a flow chart for calculating the area and circumference for a
circle ,given: the radius of the circle R
A= 3.14 * R * R C= 2 * 3.14 * R
START
END
OUTPUT A OUTPUT C
READ R
(22)
Problem Solving Chapter one
2- The Figure shows a flowchart that calculates the interest value for the balance
(with fixed interest rate)
3- The Figure shows a flow chart for calculating the division of two numbers
Interest=balance*rate
END
Read name , balance , rate
Output name,balance,interest
START
Read number1
is number2=0
Print "not defined"
Start
End
Read number2
Output the result
result=number1/number2
Yes
No
(23)
Problem Solving Chapter one
4- The Figure shows a flow chart to find the maximum number among two numbers .In the case of equality output the message "equal"
5- The Figure shows a flow chart that will print even integer numbers from 1 and 10 .
IS A=B
IS A > B
Output "equal"
Read A,B
Output B
N=N+2
N>10
Sum=0
Sum=Sum+N
Print Sum
N=2
YES NO
Output A
YES
NO
Start
End
start
end
Yes
No
(24)
Problem Solving Chapter one
Introduction to Visual Basic.NET
By the end of this chapter, student will be able to:
Identify the essence of Visual Basic .NET
Identify the basic components of the IDE screen
Create a new project
Add a new Form to the (Project)
Save the project
Add a new project to the solution
(26)
Visual Basic.NET
Chapter Two
After studying the Problem solving technique, and learning how to develop
logical steps to solve problems, in this chapter you will start working with Visual
Basic.Net Language, and you will be able to convert the solution steps of a
problem to program codes that can be executed.
Visual Basic .NET is just one of the languages in Visual Studio .NET package that
includes other languages, such as C# and J#.
Visual Basic .NET is an object-oriented language that develops event driven
Windows and Web applications.
A Computer executes only commands written in machine language. As for
programmers; they can’t write in machine language, so they use programming
languages to write programs in English; then comes the role of the compiler
(found in the language) that translates program’ instructions from English to
machine language; for a Computer to understand.
Is a set of rules, symbols and special words you can use to write instructions and construct a computer program; according to the programming language used. Instructions will be translated to machine language for being executed.
(27)
Visual Basic.NET
Chapter Two
A Windows-based application has a Graphical User Interface (GUI) and appears
in a window .Sure you used many Windows-based applications, like Paint ,
Notepad ,Calculator ,Internet browser ... Etc. Notice that all Windows
applications have a graphical interface (a window) that share some common
characteristics: such as “Window style, Maximize button, Minimize button and,
saving or opening files ... Etc..
Figure (2-1) Examples of Windows applications
When using windows applications, like the calculator ; you do an action (event)
like pressing a plus (+) sign or an equal (=) sign in the application or from the
keyboard, then a specified task will be executed ;so writing programs using
programming languages (as mentioned before) is important for responding to
certain event.
In Visual Basic.Net everything depend on Objects (like: Button, Textbox,
ComboBox); which have the following attributes:
1- Properties that describe the Object
2- Events that occur to objects
3- Methods that present actions to be performed on objects ; causing
certain behavior on the objects ;the Object (Textbox );the Method
(28)
Visual Basic.NET
Chapter Two
1. The (Class) implies a definition for the (Object). 2. The (Object) exists only when an instance of the class is
created 3. You can create as many objects you need from a class. 4. A place in the memory is reserved for each object in Visual
Basic.NET when it is created.
invoked on it is: Copy (which is responsible for copying selected text in the
clipboard).
The calculator, is an application where we find many buttons; each button
presents an (Object) it has (Properties) like: width, height, text labeled,
background color ….etc., and has events like: (Click) that occurs when the user
clicks the mouse on a specified button on the calculator, which in turn invokes
certain action; if the same event (click) is done on other objects (buttons) it may
cause different actions.
This means that all buttons have the same properties with different data values,
and then appear with different shapes. The same event (click) if occurred on
each button in the calculator will cause different actions, which vary from one
button to another, although all buttons are derived from the same (Class).
From the above we conclude that:
An (Object) is the basic constructive element in Object Oriented Programming; it
is created from a defined class.
A (Class) is the blueprint/ plan / template, from which the individual objects, are
created. It is the blueprint that describes the details which any object takes (its
Properties, Methods and, Events); that are all derived from the (Class).
(29)
Visual Basic.NET
Chapter Two
The .NET Framework is like the central nervous system for all Visual Studio.Net
applications; it is a platform that enables you to:
1- Develop applications like (Desktop applications) - (Web applications) – (Mobile applications).
2- Provide a development environment for running all applications.
The Framework is composed of:
The execution engine (CLR) Common Language Runtime
The .NET class libraries (System Class Libraries)
(Compilers)
Other elements
The .NET Framework is used in the development, design and execution of .NET
applications. The .NET Framework can be installed for free on operating systems
(and is available with many versions).
The term (IDE) refers to Integrated Development Environment
Visual Studio .NET provides an environment known as (IDE) that enables the
developer to do as much as possible with visual tools, to quickly design
applications (Windows applications) - (Web applications) – (Mobile
applications).as shown in figure (2-2).
Figure (2-2) (IDE) screen
(30)
Visual Basic.NET
Chapter Two
The form is the window (visible interface) of the application; what users will see
and work with when they run this application .A form is the container upon
which controls (CommandButton –Textbox- Label..etc) are placed as shown in
figure(2-3).
Figure (2-3) A Form before and after placing controls
The Toolbox contains controls (objects) that the programmer can place on the
form, these controls are available in tabs (categories)
as shown in figure (2-4); notice that a (+) sign is
displayed with each tab, when we click on it ,the tab
expands and a set of controls will be displayed.
You can display all the (Controls), by choosing (All
Windows Forms) Tab or category.
From these categories we also have
(Common Controls)
(Menus & Toolbars)
Figure (2-4) the Toolbox
A Form after placing controls on
it and adjusting some of their
properties.
A blank Form before placing
any controls on it
(31)
Visual Basic.NET
Chapter Two
A set of controls (icons) expands in each tab (category) as shown in figure (2-5)
Figure (2-5) Controls in different tabs (categories)
Table (2-1) some of the (Common Controls)
Control م Control م
1 Button 6 ComboBox
2 TextBox 7 CheckBox
3 Label 8 RadioButton
4 ListBox 9
(32)
Visual Basic.NET
Chapter Two
In (IDE) screen, displayed properties differ upon the selected element.
Each control from the above has properties . A Properties window lists the
property settings for the selected Form or control and permits changes to each
setting to be made. as shown in figure (2-6).
Figure (2-6) (Properties window)
The Solution explorer window contains a list of items of the current solution ;and
may contain one or multiple projects .It also displays a hierarchical list of all the
components, ( files and folders) organized by project, as shown in figure (2-7).
(33)
Visual Basic.NET
Chapter Two
Figure (2-7) (Solution Explorer) window
With your teacher’s assisstance open the (Visual Studio),available on your
computer.
Type the name of the (Visual Studio) opened on the screen.
..........................................................................
From (File) menu choose (New Project) .
A new window is displayed as shown in figure (2-8).
Figure (2-8) New Project Window
First Project
Second Project
Solution name
Files and
folders of the
second Project
Files and
folders of the
first Project
1
2
(34)
Visual Basic.NET
Chapter Two
The numbers shown in figure (2-8) indicate:
(1) The chosen template (Windows Forms Application).
(2) The place for typing Project’s name.
Type the project name (MyFirstProject) than click (OK) as shown in figure (2-9) .
Figure (2-9) New Project Window
When clicking the (OK) button ,the (IDE) window appears as shown in figure (2-10).
Figure (2-10) (IDE) Window
1
2
3 4
(35)
Visual Basic.NET
Chapter Two
The numbers shown in figure (2-10) indicate:
(1) The Form window
(2) The Solution Explorer Window
(3) The Properties window
(4) The Toolbox window
From the (Project) menu choose (Add Windows form) to create a new Form as
shown in fig(2-11).
Figure (2-11) (Project) Menu
The window (Add New Item) is displayed as shown in figure (2-12).
Figure (2-12) (Add New Item) Window
1
2
3
(36)
Visual Basic.NET
Chapter Two
The numbers shown in figure (2-12) indicate:
(1) The Project name given to the project; to which the new (Form) will be
added.
(2) The template used to create the (Form).
(3) The suggested file name of the (Form) (that you can change if you wish );
(4) Press the (Add) button, a new window Form will be added as shown in
figure (2-13).
Figure (2-13) Adding a new (Form)
The numbers shown in figure (2-13) indicate:
(1) The window Form (Form2).
(2) The file name assigned to (Form2) inside the (Solution Explorer).
When you create a new Project, a copy of the project is
saved in the memory; to save it on one of the storage
devices, do the following:
Choose (File) menu then select (Save All) as shown in
figure (2-14).
Figure (2-14) Saving the Project
1
2
(37)
Visual Basic.NET
Chapter Two
The shown window will be displayed figure (2-15)
Figure (2-15) Save Project window
The numbers shown in figure (2-15) indicate:
(1) The Project name given to the project when created (as you
learned earlier in this chapter), you can change it if you wish.
(2) The Solution name that will include; the Project you want to save,
(you can change Solution name if you wish).
(3) The Browse button; to explore storage devices available on your
computer.
(4) With your teacher’s help, choose the storage device you prefer for
saving your Project, then press the (Save) button for the (Project)
to be saved.
Choose (File) menu then select (Add)
then (New Project) as shown in figure (2-
16).
Figure (2-16) Adding a new Project
1
2
3
4
(38)
Visual Basic.NET
Chapter Two
With your teacher’s help, give this name (MySecondProject) to your new Project.
The (Solution Explorer) window becomes as shown in figure (2-17).
Figure (2-17) The new Project is displayed in the (Solution Explorer) The numbers shown in figure (2-17) indicate:
(1) The Solution name
(2) The first project name
(3) The second Project name
1
2
3
(39)
Visual Basic.NET
Chapter Two
First: Write in the table below what the following numbers indicate
Indicates Number ......................................................... 1
......................................................... 2
......................................................... 3
......................................................... 4
1
2
3 4
(40)
Visual Basic.NET
Chapter Two
Second: In the following (Add New Item) window, what the following numbers indicate?
Indicates Number ......................................................... 1
......................................................... 2
......................................................... 3
1
2 3
(41)
Visual Basic.NET
Chapter Two
Third: Refer to the following figure then, explain what the following numbers indicate?
What is the benefit of this window? ………………………………………………….. Number 1 indicates: ………………………………………………….. Number 2 indicates: ………………………………………………….. Number 3 indicates: …………………………………………………..
Fourth: In the displayed (Solution Explorer) window what the following numbers indicate?
Indicates Number .................................................... 1
.................................................... 2
.................................................... 3
.................................................... 4
1 2
3 4
1
2 3
(42)
Visual Basic.NET
Chapter Two
Fifth: Complete the sentences with the following:
Object - Class –Visual Studio – .NET framework – Programming language
– Form
1- ……………………………….. is used in the development, and design of (Desktop application) - (Web application) – (Mobile application).
2- Through ………………………………, Instructions, and commands are written according to certain rules; and then translated to machine language.
3- ………………………………..provides an environment , that enables developers to design and execute (.NET applications).
4- ………………………………..is defined as: The basic constructive element in Object Oriented Programming; it is created from a defined class.
5- The blueprint, from which the individual objects are created; is called ………………………………..
Controls
By the end of this chapter, student will be able to:
Recognize the (Properties Window)
Adjust the properties assigned to Controls
Choose the appropriate Property
Choose the proper value for the Property
Differentiate between controls’ Properties
(44)
Visual Basic.NET
Chapter Three
There are many properties assigned to the form as shown in figure (3-1).
Figure (3-1) (Properties window) of the Form
1. Some properties (such as: Text – Name – Forecolor – BackColor – RightToLeft….….etc.) are common to most controls.
2. Some properties will not be applied to controls placed on a form; unless we set other properties to these controls like :(RightToLeft ) and ( RightToLeftLayout).
3. Controls placed on a form will have, by default, some of the properties as the form. We can say that controls inherit some of the form’s properties e.g. (Font) and (ForeColor).
4.
(45)
Visual Basic.NET
Chapter Three
1. The column to the left is the properties list, such as Property (Text).
2. The column to the right is the setting list, which provides the current value assigned to the property; such as (Form1).
1. Create a new project and name it (SquareArea).
2. Select the Form window (Form1) and activate its Properties window, then:
- Change the value of the (Name ) Property to (frmSquare) as shown in figure (3-2).
-
Figure (3-2) Setting the property (Name)
- Change the value of the (Text )Property to (“ مربع مساحة" ) as shown in figure (3-3).
Figure (3-3) Setting the property (Text)
Value Property
(46)
Visual Basic.NET
Chapter Three
- The Form window will be displayed as shown in figure (3-4).
After setting the previous two
properties
Before setting the previous two
properties
Figure shows only the value of property (Text) and does not show the value of
the property (Name); used when writing the code. Figure (3-4) Form window before and after setting the property (Text), (Name)
1. The value of (Text) property is displayed as text in the title bar of the Form (frmSquare).
2. The default values of the properties (Text) and (Name) are (Form1); which means they are the same.
3. The name of the (Form) is (frmSquare), earlier it was (Form1).
(47)
Visual Basic.NET
Chapter Three
1. To Set the(BackColor) property for the Form (frmSquare)
- Select the (BackColor ) property and set its value to
(DarkSeaGreen) as shown in figure (3-5).
Figure (3-5) Setting the property (BackColor)
The Background color of the Form becomes (DarkSeaGreen ) as shown in figure (3-6).
Figure (3-6) the Form window after setting the (BackColor) property
2. To adjust the writing direction Property for the Form (frmSquare).
- Set the value of the Property (RightToLeft ) to “Yes” as shown in figure (3-7).
Figure (3-7) Setting the property (RightToLeft)
(48)
Visual Basic.NET
Chapter Three
The text shown on the Form is displayed from right to left (see figure (3-8)).
Figure (3-8) the Form window after setting the (RightToLeft) property
3. To adjust the Layout direction Property for the Form (frmSquare).
- Set the value of the Property (RightToLeftLayout) to “True”
as shown in figure (3-9).
Figure (3-9) Setting the property (RightToLeftLayout) The Layout direction of the Form will be from right to left as shown in figure (3-10).
Figure (3-10) the Form window after setting the (RightToLeftLayout) property
(49)
Visual Basic.NET
Chapter Three
4. To hide the minimize and maximize buttons for the Form (frmSquare ).
- Select the properties ( MaximizeBox, MinimizeBox ) and set their values to
(False) as shown in figure (3-11).
Figure (3-11) Setting the (MinimizeBox ) and (MaximizeBox ) properties
The Minimize and Maximize buttons are hidden from the Form as shown in figure (3-12).
Figure (3-12) the Form window after hiding the (MinimizeBox ) and (MaximizeBox ) buttons
5. To hide the Control Box for the Form (frmSquare ).
The property (RightToLeftLayout) will not be active, unless the property value of (RightToLeft) is (Yes).
Note that the
Maximize and
Minimize buttons do
not exist
(50)
Visual Basic.NET
Chapter Three
Note that the
form’s title bar
and borders
disappear
- Select the property (ControlBox) and set its value to (False) as shown in
figure (3-13).
Figure (3-13) setting the (ControlBox) property
The ControlBox is hidden as shown in figure (3-14).
Figure (3-14) the Form window after hiding the ControlBox.
6. To hide the Border for the Form (frmSquare ).
- Select the property (FormBorderStyle) and set its value to (None) as shown
in figure (3-15).
Figure (3-15) setting the (FormBorderStyle) property
The Form window became without borders (Borderless window) as shown in figure (3-16).
Figure (3-16) the Form window after hiding its Borders
(51)
Visual Basic.NET
Chapter Three
With your teacher’s help
- Set the value of property (FormBorderStyle) to (Sizable).
- Display the (Minimize) button, the (Maximize) button and (ControlBox) on the title
bar.
Figure (3-17) the (Start Debugging) icon on the Standard Toolbar
The Property (FormBorderStyle) takes many values .The value (Sizable) makes it possible to control the Form’ size; through its borders.
When you adjust any Property of the properties stated before; its effect is shown on the Form immediately.
There are some properties, where their effects on the Form or on other controls will be active, only if you start running the program (Run mode) or at the (Start Debugging mode).
You can initiate the (Start Debugging mode) by clicking on the (Start Debugging) icon on the Standard Toolbar as shown in figure (3-17).
(52)
Visual Basic.NET
Chapter Three
See the (IDE) screens before and after clicking on the (Start Debugging) icon as shown in figure (3-18).
Click on the (Start Debugging) icon.
Figure (3-18) the Form in Design mode and Run mode
The Form window in the (Design mode)
The Form window in the (Run mode)
(53)
Visual Basic.NET
Chapter Three
Figure (3-19) (Stop Debugging) icon in the Standard Toolbar
7. To enable or disable the Form’s icon to be displayed in the Taskbar and to
adjust the Position of the Form when displayed on the screen; we adjust the
shown properties of the Form (frmSquare) to (False) and (CenterScreen) see
figure (3-20).
Figure (3-20) setting the (ShowInTaskbar) and (StartPosition) Properties
- Press (F5) button from the keyboard to start the Debugging.
8. To adjust the state of the Form’s window (frmSquare).
- Select the value (Maximized) as shown in figure (3-21).
Figure (3-21) setting the (WindowState) Property
- Choose the (Debug) menu then select (Start Debugging) to start debugging.
You can stop the (Debugging) by clicking on (Stop Debugging) icon as shown in figure (3-19).
1. The Form appears in the center of the screen, also the Form icon does not appear in the taskbar.
2. The effect of both (ShowInTaskbar ) and (StartPosition ) properties will not be active unless we start debugging the program.
(54)
Visual Basic.NET
Chapter Three
1. The Form’s window is displayed in full screen. 2. The effect of the Property (WindowState) is active only when you start
debugging the program.
From the above, we conclude that the properties assigned to the Form are as shown in Table (3-1).
Function Property No. Name of the Form used in the code. Name 1
Text appearing on the title bar of the Form. Text
2
The Border outline of the Form’s window. FormBorderStyle
3
The background color of the Form’s window. BackColor 4
Determine the size of the window on the screen,
whether maximized or minimized or normal. WindowState 5
Enable or disable (hide) the Control box appearance
in the window. ControlBox 6
Enable or disable (hide) the appearance of the
Minimize Button in the window. MinimizeBox 7
Enable or disable (hide) the appearance of the
Maximize Button in the window. MaximizeBox 8
Enable or disable (hide) the appearance of the Form
icon on the (TaskBar). ShowInTaskbar 9
Locate the Form’s window on the screen. StartPosition 10
Determine whether the Layout direction of (Controls)
on the (Form) is from right to left. RightToLeftLayout 11
Determine whether the writing direction of (Controls)
on the (Form) is from right to left ;such as the text
direction in the (TextBox) .
RightToLeft 12
Table (3-1) Form’s Properties
(55)
Visual Basic.NET
Chapter Three
Double-Click
A Button is one of the (Controls) that can be drawn on the (Form) .A user will use a button by clicking on it to perform a specific task.
- Create a new (Project) and set up the (Form) as shown in figure (3-22).
Figure (3-22) the (Form)
1. To place a Command Button on the form; in design mode. Move the mouse
pointer to the Toolbox and double-click the Button icon as shown in the figure
(3-23).
Figure (3-23) the Command Button in the Toolbox
- The Button is displayed on the Form as shown in figure (3-24).
Figure (3-24) the Command Button (Button1) displayed on the (Form)
(56)
Visual Basic.NET
Chapter Three
We will adjust the Controls’ locations found on the Form ,by setting the Properties (Location) and (Size) for these Controls. In the Properties window, using the mouse pointer, you can select these Properties, and change their setting values.
2. Activate the Command Button (Buttton1) by clicking it.
3. Place the mouse pointer in the center of the (Button). Drag the (Button) to the
middle of the (Form) as shown in figure (3-25) and figure (3-26).
Figure (3-25) Location of the (Button) before clicking and dragging
Eight boxes (sizing handles) are shown at the Borders and corners of the (Button).
This means; the possibility of changing the size of the (Button) on the (Form). Place the mouse pointer on one of the eight boxes. Hold down the left mouse button and Drag the mouse in the direction of either arrowhead. Release (Drop) the mouse button when the desired size is reached.
To Move the (Button): place the mouse pointer inside the (Button) and hold down the left mouse button. Drag the (Button) to the desired. position and then Drop the mouse button.
Note the value of the (Location) property; it specifies the position of the Button on the (Form).
(57)
Visual Basic.NET
Chapter Three
Figure (3-26) Location of the (Button) after clicking and dragging
4. Place the mouse pointer on one of the boxes (sizing handles). Drag and Drop
the mouse until the desired size is reached as shown in figure (3-27) and figure
(3-28).
Figure (3-27) the Size of the (Button) before clicking and dragging one of the (Sizing handles)
Note the new value of (Location) property; it specifies the new position of the Button on the (Form) window.
Note the value of the (Size) property; it specifies the size of the Button on the (Form) before sizing
(58)
Visual Basic.NET
Chapter Three
Figure (3-28) the size of the (Button) after clicking and dragging.
5. With the help of your teacher, adjust the following properties
for (Button1) as shown in figure (3-29).
Figure (3-29) setting the properties (Backcolor ) , ( Font ) and (ForeColor) for ( Button1)
After adjusting the previous (Properties) for (Button1); the background color becomes yellow, the text appearing on the button is " أحسب " , the foreground color is blue and, the Font ‘style and size have been chosen as shown in figure (3-30).
Figure (3-30) the Command Button (Button1) after changing its Properties.
Note the value of the (Size) property; it specifies the size of the Button on the (Form) after sizing
(59)
Visual Basic.NET
Chapter Three
From the above mentioned figure, it is clear that, there are many (Properties) assigned to the control (Button) as shown in Table (3-2).
Function Property No.
The text on the (Button). Text 1
The foreground color for the text on the (Button) or its (Font
color). ForeColor 2
The background color for the (Button);(background color). BackColor 3
The text’s (Font, Size and Style) on the (Button). Font 4
The location of the (Button) on the Form’s window. Location 5
The height and width of the (Button) on the Form’s window. Size 6
Table (3-2) Some of the Command Button‘s Properties
A Label is a control used to provide the user with information. It appears as a heading or title within a form; to let the user know the form’s content. Label controls cannot be changed; users cannot type in (any text) during the run-time.
1. On the previous Form, place
the control (label1).
2. Adjust its properties as shown in table (3-3) ,you can
ask your teacher for help.
Value Property lblResult Name
Text "النتيجة:"
Choose your favorite color ForeColor
Choose your favorite color BackColor
Choose the font’s type, style, and
size you prefer. Font
False AutoSize
FixedSingle BorderStyle
Table (3-3) some of the Label‘s Properties.
(60)
Visual Basic.NET
Chapter Three
3. Change the size of the control (label1) by clicking and dragging one of the
sizing handles, so it becomes as shown in figure (3-31).
Figure (3-31) sizing the control (label1).
It becomes clear from the above that there are many (Properties) assigned to the control (Label) as shown in Table (3-4).
Function Property No.
Specifies whether the size of the control (Label) is
automatically adjusted by text written AutoSize 1
Specifies the border style of the control (Label) BorderStyle 2
Table (3-4) some of the Label‘s Properties
If the AutoSize property is set to False, you can manually adjust the size of the label.
If the AutoSize property is set to True, the label size is automatically adjusted to fit the text displayed on the label.
(61)
Visual Basic.NET
Chapter Three
A TextBox control can be used for both entering data and displaying results.
1. Create a new project so that the Form’s window will be as shown in figure (3-32).
Figure (3-32) the required Form’s window to be designed
2. In the TextBox (TextBox1) set the value of (MaxLength) property to (30) ,
where the user can enter the “Name”; and cannot type more than 30
characters; see the following setting :
The control (Label) has a set of properties like (Name - Text - Font – ForeColor – BackColor – Visible – Size – Location – RightToLeft – Image); you can deal with as you learned earlier in this chapter.
TextBox1
TextBox2
TextBox3
The controls
(Label)
The control
(Label)
The Command
button (Button)
(62)
Visual Basic.NET
Chapter Three
Text written is less than 30 characters
Characters are replaced with the symbol (*)
Writing on several lines
value Property
30 MaxLength
3. In the TextBox (TextBox2) set the value of (PasswordChar) property to (*) ,
where the user can enter the “Password” ;that appears in form of (*) as
follows :
4. In the TextBox (TextBox3) set the value of (MultiLine) property to (True) ,
where user can enter the “Notes” in multiple lines as follows :
value Property
True MultiLine
The Form’s window appears as follows during the run-time; it displays data entered by the user as shown in figure (3-33).
Figure (3-33) Form window after entering required data
It becomes clear from the above that the control (TextBox) has special (Properties) as shown in Table (3-5).
value Property
* PasswordChar
(63)
Visual Basic.NET
Chapter Three
Function Property No.
Specifies the maximum number of characters that
user can write in the (TextBox) . MaxLength 1
Specifies the symbol that will be displayed instead of
the text written; as example: creating a Password. PasswordChar 2
Determines whether the (TextBox) control allows
multiple lines. MultiLine 3
Table (3-5) some of the TextBox’s Properties
A Listbox control is used for displaying a list of items.
1. Based on what you have learned; create a new project so that the form‘s
window contains a (Button) and, a (ListBox)
as shown in figure (3-34).
Figure (3-34) the Form window after inserting a (ListBox).
The control (TextBox) has a set of properties like (Name - Text - Font – ForeColor – Visible – Size – Location – RightToLeft – Enabled); you can deal with as you learned earlier in this chapter.
(64)
Visual Basic.NET
Chapter Three
2. Adjust the (ListBox) Properties as shown in table (3-6).
Value Property
عمرو
رامي
ياسمين
سمر
Items
MultiExtended SelectionMode
True Sorted
Table (3-6) setting some of the ListBox’s Properties
When we adjust the property (Items) the following (Editor Box) will be displayed as shown in figure (3-35).
Figure (3-35) the items written in the (ListBox)
So, the form’s window appears in run-time as shown in figure (3-36).
Figure (3-36) (ListBox) as it appears in the run-time mode
Note that each item in the
(ListBox) is written in a separate
line
Names have been arranged alphabetically
You can select more than
one item
(65)
Visual Basic.NET
Chapter Three
It becomes clear from the above that the control (ListBox) has special (Properties) as shown in Table (3-7).
Function Property No.
Presents a set of items displayed in the (ListBox) Items 1
Specify whether the items are arranged or not Sorted 2
Determine whether it is possible to select one or more
item displayed in the (ListBox). SelectionMode 3
Table (3-7) some of the ListBox’s Properties
A ComboBox control displays a drop-down list from which one item can be selected.
1. Create a new project so that the form’s window contains two (Label) controls
and one (ComboBox) control as shown in figure (3-37).
Figure (3-37) (ComboBox) control
The control (ListBox) has a set of properties like ( Name – Visible – Size – RightToLeft – ForeColor- Font -BorderStyle ); you can deal with as you have learned earlier in this chapter.
ComboBox1
(66)
Visual Basic.NET
Chapter Three
2. Adjust the properties of the (ComboBox) as shown in table (3-8) ,you can
ask your teacher for help.
Value Property
" موريتانيا المغرب الجزائر تونس ليبيا الصومال اريتريا جيبوتي السودان مصر"
Note that :each country name ,should be written in a separate
line
Items
Suggest AutoCompleteMode
ListItems AutoCompleteSource
Table (3-8) setting ComboBox’s Properties
So, the Form window appears in run-time as shown in figure (3-38).
Figure (3-38) (ComboBox) control in the run-time mode
It becomes clear from the above mentioned figure that the control (ComboBox) has many (Properties) as shown in Table (3-9).
Function Property No.
Presents the items in the (ComboBox) Items 1
The maintained source of items used for automatic
completion of input string. AutoCompleteSource 2
The input string or (prefix being entered) that will be
compared to the prefixes of all strings in a maintained
source; upon which the automatic completion will be
done.
AutoCompleteMode 3
Table (3-9) some of the ComboBox’s Properties
Note that when start
typing “ال“all the
proposed countries that
begin with “ال“ are
displayed
(67)
Visual Basic.NET
Chapter Three
A (GroupBox) control is used to group other controls of same function together on the Form window.
There are many properties for the (GroupBox) control.
1. With your teacher’s help, construct a (GroupBox) control using the following
properties as shown in table (3-10) to obtain the Form shown in figure (3-39).
value Property No.
Text 1 النوع
Choose your favorite
color ForeColor 2
Yes RightToLeft 3
Table (3-10) setting the GroupBox’s Properties
The control (ComboBox) has a set of properties like ( Name – Visible – Size – Location – RightToLeft – ForeColor- Font -BorderStyle –Items ) you can deal with as you have learned earlier in this chapter.
(68)
Visual Basic.NET
Chapter Three
The GroupBox after setting its
properties. The GroupBox before setting its
properties.
Figure (3-39) (GroupBox) control before and after setting its properties
A (RadioButton) is used to select one option from a group of mutually exclusive options.
1. Create a new project so that the Form’s window will be as shown in figure (3-40).
1. The control (GroupBox) has a set of properties like ( Name – Visible – Size – Location – RightToLeft – ForeColor- Font) you can deal with as you have learned earlier in this chapter.
2. The property (BackgroundImage) is used to display the image in the background of the control (GroupBox). Start setting this property with your teacher’s help.
(69)
Visual Basic.NET
Chapter Three
Figure (3-40) A set of (RadioButton)
With your teacher’s help, set RadioButton’s properties as follows:
value Property
True Checked
Figure (3-41) Choosing one of the (RadioButton)
A set of
(RadioButton)
where the
property (Text)
have been
adjusted as
The effect of many (Properties) is not shown during design mode, but in run-time mode as shown in figure (3-41).
Note that the (RadioButton1)
is the one active
The previous figure asks the user to choose the Gender, and the Scientific
Degree as well; but one (RadioButton) control doesn’t allow this. To solve the
problem, we set two (GroupBox) controls; the first one contains the Gender
while the second one contains the Scientific Degree by dragging (RadioButtons),
each one in its group; as shown in figure (3-42).
(70)
Visual Basic.NET
Chapter Three
Figure (3-42) Choosing one (RadioButton) from each (GroupBox)
From the previously mentioned figure it is clear that there are many (Properties) assigned to the (RadioButton) as shown in Table (3-11).
Function Property No.
Indicates if the (RadioButton) has been selected or
not Checked 1
The text displayed on the (RadioButton) Text 2
Table (3-11) some of the (RadioButton) Properties
In design mode two (GroupBox)
are drawn on the Form then each
(RadioButton) is dragged to its
corresponding Group
Other (RadioButton) can
be selected
The control (RadioButton) has a set of properties like ( Name – Visible – Size – Location – RightToLeft – ForeColor- Font) you can deal with as you have learned earlier in this chapter
(71)
Visual Basic.NET
Chapter Three
A (CheckBox) control is used to select one or more options.
1. Create a new project so that the form’s window will be
as shown in figure (3-43).
Figure (3-43) a set of (CheckBox)
So, the form’s window appears in run-time as shown in figure (3-44).
Figure (3-44) a set of (CheckBox)
The control (CheckBox) has a set of properties like ( Name – Visible – Size – Text – Checked – Font – ForeColor– RightToLeft -Location) you can deal with as you have learned earlier in this chapter
A set of (CheckBox),
where the property
(Text) for each one is
adjusted
You can select more than
one item
(72)
Visual Basic.NET
Chapter Three
First :State whether the following statements are true (T) or false (F):
) ( 1. Some (Properties) are not effective unless other (Properties) are adjusted first
) ( 2. When you create a new (Project) a (Form) window is added to work with.
) ( 3. There are no common (Properties) between one (Control) and another.
) ( 4. A value should be assigned to any (Property).
) ( 5. You can modify the value of a property assigned to a (Control) through the (Toolbox)
) ( 6. The value of the (Property) Size is 98;108 means that the width is 108 and, the height is 98
) ( 7. Radio Buttons are used when the user has the possibility to choose more than one alternative.
) ( 8. User can not choose any item in the control (CheckBox)
(73)
Visual Basic.NET
Chapter Three
Second: choose the correct answer: 1. To provide the possibility to choose one and only one item use the control:
A.RadioButton B-Checkbox C - GroupBox D-ListBox
2. To allow the selection of one or more items choose the control:
A.RadioButton B-Checkbox C-GroupBox D- ComboBox
3. You can choose more than one item if you use:
A-ListBox B- ComboBox C-GroupBox D-RadioButton
4. The Solution Explorer window contains:
A-(Properties) B (Controls) C-Projects D-All of the above
5. The project can run in test mode by pressing (……) From the keyboard
A-F2 B-F4 C-F8 D-F5
(74)
Visual Basic.NET
Chapter Three
Third: Type the names of the Controls displayed on the shown Form window:
Fourth
1. Write the name of the (Property) that enables you to control the size of the Control (Label) using mouse pointer.
2. Write the name of the (Property) that makes the writing direction from right to left.
3. Write the name of two (Properties) that have no effect unless you initiate the (Start Debugging).
(Control) No.
1
2 3
4
5
6
Code Window
By the end of this chapter, student will be able to:
Work with the (Code window )
Define the (Event Handler)
Adjust Controls’ Properties programmatically
(76)
Visual Basic.NET
Chapter Four
Through the Code window; we can write instructions and codes using (Visual
Basic .Net) language “Language under study”.
To open the (Code Window) of (Form1) perform the following:
1. Make sure that the window Form is active
2. From the keyboard press (F7)
The Code window is displayed as shown in figure (4-1)
Figure (4-1) (Code Window)
The numbers shown in figure (4-1) indicate:
(1) Name of the file where codes are saved.
(2) Name of the file where the Form window is saved.
(3) The declaration of Class; its name is (Form1).
(4) Space between two lines; to type codes for the Class (Form1).
(5) The end of the Class.
2
3
1
4 5
(77)
Visual Basic.NET
Chapter Four
Identify the Code Window and Event Handler 1. With the help of your teacher, create a (Project) named (Shapes) and
save it with a solution name (Geometric), then set up a (Form) of name
(frmSquare); with the controls displayed as shown in figure (4-2).
Figure (4-2) The Form window of the new (Project)
Steps mentioned above are done without adjusting the property (Name); for all Controls drawn on the (Form).
Figure (4-3) The Title Bar shows the Solution name
The Title Bar of the (IDE) window appears as shown in figure (4-3):
2 1
(78)
Visual Basic.NET
Chapter Four
The numbers shown in figure (4-3) indicate:
(1) The Solution name.
(2) (Visual Studio) version used.
2. In the (Solution Explorer) window, right click the file (Form1.vb) and,
select (View Code) from the context menu as shown in figure (4-4).
Figure (4-4) to display the Code Window
When choosing (View Code) the following figure (4-5) appears
Figure (4-5) the Code Window
The numbers shown in figure (4-5) indicate:
(1) A drop-down menu of (Class Names), which refers to the names of
controls placed on the Form.
(2) A drop-down menu of (Method Names) or events; associated with
the Class selected from the (Class Names) menu.
Project name
From the context menu choose (View Code)
1 2
(79)
Visual Basic.NET
Chapter Four
Perform the following steps
3. Open the drop-down (Class) menu and note that the default names of
the controls are listed as shown in figure (4-6).
Figure (4-6) listing Control names in the Code Window
4. When you select (Button1) from the Class menu, open the drop-down
(Methods) menu; it displays the events associated with (Button1) as
shown in figure (4-7).
Figure (4-7) choose the required event from the drop-down menu
Choose the event (Click)
(80)
Visual Basic.NET
Chapter Four
Figure (4-8) (Event Handler)
The numbers shown in figure (4-8) indicate: (1) The procedure name composed of (object name, event name)
(2) End of procedure
(3) What causes the call of the procedure (event occurrence).
(4) Between the two lines shown; you can write statements or codes
that will be executed after invoking the procedure.
(5) The declaration of the Class (frmSquare)
(6) The end of the Class
Event handler is the procedure (called into action) when an event occurs as shown in figure (4-8):
6
1 2 3
4
5
(81)
Visual Basic.NET
Chapter Four
Adjust the property (Name) for the following controls as shown in table
(4-1); ask your teacher for help.
Value of the
property (Name) Control No.
lbl_Title Label1 1
Btn_Text Button1 2
Btn_ForeColor Button2 3
Btn_Font Button3 4
Btn_Visible Button4 5
Btn_End Button5 6
Table (4-1) After setting the properties, choose the (View) menu then select (Code).
Open the drop-down (Class) menu and note that the displayed names of the
controls have been changed as shown in figure (4-9).
Figure (4-9) the displayed new Names of the (Controls)
(82)
Visual Basic.NET
Chapter Four
1. Create a new (Project) and set the (Form) as shown in figure (4-10)
Figure (4-10) required Form window 2. Set the property (Name) for the Form (Form2) to (frmAdjustProperties).
3. Set the value of the property (Name) for the controls as follows in table (4-
2).
Value of the property
(Name) Control No.
lbl_Title Label1 1
Btn_Text Button1 2
Btn_ForeColor Button2 3
Btn_Font Button3 4
Btn_Visible Button4 5
Btn_End Button5 6
Table (4-2) the value of the property (Name) for the controls
(83)
Visual Basic.NET
Chapter Four
Figure (4-11) the (Event Handler) related to the Button
The numbers shown in figure (4-11) indicate:
(1) The Procedure Name is (btn_Text_Click); the control name is
(btn_Text), and the event name is (Click).
(2) Between the two lines shown; you can write statements or codes.
If you double-click the Button named (Text); the (Code window) opens with the corresponding (Event Handler) of the active Button as shown in figure (4-11)
2 1
Setting the (Properties) programmatically
The control or the
object name
The property
The value
(84)
Visual Basic.NET
Chapter Four
With the help of your teacher do the following:
Insert the (Click )event handler of the Button (btn_Text )
Adjust the property (Text ) for the Label (lbl_Title ) to be :
“ مصر العربية جمهورية “
The following statement is written
4. With your teacher help do the following:
Insert the (Click )event handler for the Button (btn_ForeColor)
Set the value of the property (ForeColor) for (lbl_Title ) to
(Blue)
The following statement is written
5. With your teacher’s help do the following:
Insert the (Click )event handler for the Button (btn_Font )
Adjust the property (Font) for (lbl_Title ) to become:
(font type) = Arial and, (font size) =30
The following statement is written
6. With your teacher help do the following:
Insert the (Click )event handler for the Button (btn_Visible)
Set the value of property (Visible) for (lbl_Title ) to (False)
The following statement is written
lbl_Title.Text= " العربية مصر جمهورية "
lbl_Title.ForeColor=Color.Blue
lbl_Title.Font= New Font("arial", 30)
lbl_Title.Visible = False
(85)
Visual Basic.NET
Chapter Four
7. To end the procedure insert the (Click) event handler for the Button (btnEnd)
and type the command (End) .when we terminate writing all (Event
Handlers).The (Code Window) becomes as show in figure (4-12).
Figure (4-12) the (Code Window) with all (Event Handlers)
The values assigned to properties may have several types: 1. The abstract value; e.g. Property (Text). 2. The logical value; e.g. Property (Visible). 3. The value selected from a list; e.g. Property (ForeColor). 4. The value formed from creating an (Object); e.g. Property (Font). 5. The value of the result of arithmetic expression (will be studied
later). 6. The value of a Variable or Property.
(86)
Visual Basic.NET
Chapter Four
1. In the shown figure what the following numbers indicate?
2. In the following Form perform the following:
Type the appropriate lines of code for each Button so that when you click any (Button); it changes the background color for the (Label) to the corresponding color written on the button. Take in consideration that the property (Name) of the Label is (label1)
Indicate Number ......................................................... 1
......................................................... 2
......................................................... 3
4
2
3
1
4
(87)
Visual Basic.NET
Chapter Four
3. Type the appropriate lines of code ,and use the Property (Visible) to show or hide the label (label1)
4. You have several properties for the control (textbox1) change
it to the values shown (by writing the corresponding lines of code)
......................................................... Red Button
......................................................... Green Button
......................................................... Blue Button
......................................................... Show (label1)
......................................................... Hide(label1)
Lines of code Value Property. True
multiline
Type : Andalus
Size:20 font
Blue forecolor
True backcolor
(88)
Visual Basic.NET
Chapter Four
klنميسبلسيبل
( 89 )
Sample Tests
Sample Test (1)
First :State whether the following statements are true (T) or false (F): ) ( 1. The symbol is used to present the start or the end (Terminal)
) ( 2. The rectangle symbol represents only one processing
) ( 3. The flow of steps will always be from top to bottom or from left to
right.
) ( 4. When adjusting any Property from the Properties window; its
effect is shown on the Form immediately
) ( 5. When Setting a (Property) programmatically, its value appears on
the right side of the assignment statement:
Second: Underline the correct answer(between brackets)
1- A diagram that uses graphical symbols to illustrate the sequence of steps for
solving a problem
(Flowchart - Problem Solving - algorithm)
2- Which of the following symbols describe the decision-making processes in
flowcharts
( - - )
3- The procedure called into action when an event occurs
(Function – Event Handler - Event )
4- When creating a new Project ;a (Form) appears with a name :
(Label1-Form1-Listbox1)
5- To control the size of the control (Label) using the mouse pointer ; you have
to adjust the property
(BorderStyle-AutoSize-Location)
klنميسبلسيبل
( 90 )
Sample Tests
Third: In the following table; type the number in front of each command that refers to its correct place in the “Flowchart” to determine if the input number is (even or odd) .
) ( Res = N mod 2
) ( 0 Is res
) ( Output
"number is odd"
) ( Output
"number is even"
) ( Input number N
Start
End
YES
NO
1
3
2
4 5
klنميسبلسيبل
( 91 )
Sample Tests
Fourth: In the displayed (IDE) window, what do the following numbers indicate?
Indicates Number ......................................................... 1
......................................................... 2
......................................................... 3
4
1
2
3 4
klنميسبلسيبل
( 92 )
Sample Tests
Sample Test (2) First :State whether the following statements are true (T) or false (F):
) ( 1. To draw “Flowcharts” you can use any Geometric shape for
representing solution steps
) ( 2. At least two paths (branches)must come out from this shape
………..
) ( 3. The first stage of problem solving is the Algorithm
) ( 4. To open the (Code Window) of a Form press (F7)
) ( 5. The list of properties displayed in (Properties window) differ
from the selected element
Second: Underline the correct answer(between brackets)
1. The objective or the specific output that we want to attain
) Problem - Problem Solving - Algorithm (
2. Which of the following express the processing operation
( - - )
3. To set the Background color of the Form we use the property:
) ForColor-BackColor-Color (
4. Which of the following Properties their effects are active ; only
when(StartDebugging)
) ShowInTaskbar-Font-Text (
5. It is the blueprint, from which the individual objects, are created
)Object-Function-Class(
klنميسبلسيبل
( 93 )
Sample Tests
Third: Draw a flowchart for the Algorithm shown in the table
Third :Flowchart Second :Algorithm
1-Start
2-Enter N
3-j=1
4-If J<=12 then
4-1 Print J*N
4-2 J=J+1
4-3 Go To 4
5- End
What is the purpose of the previous Algorithm? -------------------------
---------------------------------------------------------
Fourth: In the displayed (IDE) window, what do the following numbers indicate?
Fifth
Type the appropriate lines of code to adjust the property (Text ) for the control (Label1) to the value ” العربيةتحيا جمهورية مصر ”
Indicates Number ......................................................... 1
......................................................... 2
2 1
klنميسبلسيبل
( 94 )
Sample Tests
Sample Test (3) First :State whether the following statements are true (T) or false (F):
) ( 1. Flowchart uses graphic symbols and lines to represent
Problem solving steps.
) ( 2. The symbol used to output more than one result on the
screen or the printer is …………
) ( 3. The flow of steps will always be from top to bottom or
from left to right
) ( 4. The value assigned to a property can be changed only from
the Properties window
) ( 5. When saving a Project for the first time,the Solution name
appears the same as the project name
Second: Underline the correct answer(between brackets) 1. In the following formula C = A + B; C represent
)Stored value – Variable ( 2. Iterations and branching can be represented through
)Flowchart - Algorithm - Problem Solving( 3. The first stage of solving Problem
(Solution steps - Define the Problem - Determine the input) 4. Integrated Development Environment means
)IPO-IDE-ERD ( 5. The Event Handler consists of:
(Name of the control – The name of the event – Name of the control
and name of the event )
klنميسبلسيبل
( 95 )
Sample Tests
Third: Draw a flowchart for the Algorithm shown in the table
Third :Flowchart Second :Algorithm
1 Start
2 Sum=0
3 Enter value
4 If value= -1 then
4-1 Print Sum
5 Else
5-1 Sum=Sum+value
5-2 Go To 3
6- End
What is the purpose of the previous solution steps ? ----------------------------------------------------------------------------------
Fourth: For each of the following Event Handlers ,write the event name,and the control name.
Event Control No. 1
2