Computer prep3

It’s the objective or the specific output that we want to attain; through
a sequence of steps and activities and, specific input.

First: Problem Definition: It is 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
Algorithm is a group of logically arranged procedures to be executed to
attain a goal or precise output, out of specific inputs
The algorithm is represented by drawing “Flowcharts”
Third: Program design
We have to translate this flowchart into one of the programming languages.
Fourth: Program Testing
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.

1
Flowchart is a diagram that uses standard graphical symbols; to illustrate
the sequence of steps required for solving a problem or specific question.
The benefit of flow cart
1) Promotes understanding of a problem
2) Shows what tasks should be performed when writing program codes
3) Explains the program to others
4) Considered a convenient tool for documenting a program
Most Flowcharts are drawn using standards (commonly used) symbols

Significance symbol
Terminal
Iinput/Output
Process
Decision

Flow Lines

* Use (print, output) to write output

* Input and output called variable
*the left side of any equation should contain only one variables
* Use (input, read, enter)to write input
*the right side of the equation may contain values or arithmetic
expressions that have one or more variables (inputs)

2
1) Draw afloat chart for a program that will calculate the sum of two numbers

2) Draw a float chart for a program that will compute the average and product of
three numbers

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.

3
3) Solving a first degree equation y=3x+2

First: Define the problem

Output: The value of “Y”.
Input: X.
Solution: Compute the value of “Y” from the equation Y=3x+2

4)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).

5)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.

6) Write down the Algorithm, and draw a flowchart to calculate the number
of years, bearing in mind that the number of months is known.

4
The use of branching (decimation) in flow chart
1) Draw a flowchart for a program will obtain exam scores from the user
determine whether the score is great than or eqal 50 and display the
message “‫”ناجح‬

2)Draw a flowchart for a program that will calculate the division of two
numbers determine whether the divisor equal (zero) and display the
message “unknown”

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”.

5
3) draw a flowchart for a program that obtains from the user determine the
number type(even or odd) and print the result

6
4)get a temper ature degree from the user and print out the following
result “greater than zero” – less than zero” –“equalzero”

5)Write down the Algorithm, and draw a flowchart to enter two numbers,
then Print “the largest is …? “and, “the smallest number is…? “.

6) 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).

7
 The use of loop in flow chart
1) print out the number from 1 to 3

2) Modify the flowchart to the previous exercise to print multiplication

table of no

8
3)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.

4) Write down the Algorithm, and draw a flowchart to print out even
numbers from 1 to 10.

5) print out the sum of integer number from 1 to 3

9
6)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.
7)After executing the previous activity, draw the flowchart in your
notebook; to print out the sum of even numbers instead of the odd ones.

10
11
12
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.
Note
Programming language contains commands derived from letters
English and contains what is called (Compiler) to translate these commands into
machine language

Visual Basic .NET is just one of the languages in Visual Studio .NET package that
includes other languages, such as C# and J#.
1) it used create A Windows application

A Windows-based application has a Graphical User Interface (GUI) and appears

in a window .Sure you used many Windows-based applications, like Paint

2) Windows application are event driven application

When using windows applications you do an action (event)then a specified task
will be executed
3) it is an object oriented language
In Visual Basic.Net everything depend on Objects (like: Button, Textbox)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

It is the basic constructive element in Object Oriented Programming; it is

created from a defined class.
13
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).

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
Studio.NET when it is created.

It is like the central nervous system for all Visual Basic.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:
1) The execution engine (CLR) Common Language Runtime
2) The .NET class libraries (System Class Libraries)
3) (Compilers)
4) Other elements

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

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

The Toolbox contains controls (objects) that the programmer can place on the
form Some of the Common Controls ….(button – textbox – labels – list box –
combo box – check box – radio button)
14
Each control has properties. A Properties window lists the property settings for
the selected Form or control
** Displayed properties differ upon the selected element

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

1- Start 2- program 3-Microsoft visual studio 4-visual studio

1- File menu 2-new project 3-Windows Forms Application

(1) The chosen template (Windows Forms Application).

(2) The place for typing Project’s name.

15
 After press ok this window will appear

(1) The Form window

(2) The Solution Explorer
Window
(3) The Properties window
(4) The Toolbox window

1) (Project) menu
2) Select Add Windows form Windows will appear

1- The Project
2-The template used to create
the (Form).
3-The suggested file name
of the (Form)
4) Press the (Add) button

1- File menu 2- save all

1) The Project name given to

the project when created
2) The Solution name that will
include; the Project you want to save
3) The Browse button; to explore storage devices available on your computer.
4) then press the (Save) button for the (Project) to be saved

16
17
18
1) The column to the left is the properties list
2) The column to the right is the setting list
Where you type the property value
To set any property
1) Select the Form window (Form1) to activate its Properties window
2) Select the property you want to change
3) Change the value of the Property

(its effect is shown on the Form immediately (design mode))

Property Function Default value

Name Name of the Form used in the code. Form 1

Text Text appearing on the title bar of the Form. Form 1

The background color of the Form’s

BackColor
window.

Determine whether the writing direction of

RightToLeft No
(Controls) on the (Form) is from right to left

Determine whether the Layout direction of

(Controls) on the (Form) is from right to
RightToLeftLayout left.{ The property (RightToLeftLayout) will False
not be active, unless the property value of
(RightToLeft) is (Yes)}

Enable or disable (hide) the

MinimizeBox appearance of the Minimize Button in the True
window

19
 Property Function Default value

Enable or disable (hide) the appearance of

MaximizeBox true
the Maximize Button in the window.

Enable or disable (hide) the

ControlBox true
Control box appearance in the window

The Border outline of the Form’s

window.Set its value to sizable makes it
FormBorderStyle Sizeable
possible to control the Form’ size; through
its borders

(its effect is shown only if you start running the program (Run
mode) or at the (Start Debugging mode).

1) You can initiate the (Start Debugging mode) by clicking on the (Start
Debugging) icon on the Standard Toolbar
2) You can stop the (Debugging) by clicking on (Stop Debugging) icon

Default value
Property Function

Enable or disable (hide) the appearance of

ShowInTaskbar true
the Form icon on the (Taskbar).

Windows default
startPosition Locate the Form’s window on the screen.
location

Determine the size of the window on the

WindowState screen, whether maximized or minimized or Normal
normal.

20
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.
Draw button Move the mouse pointer to the Toolbox and double-click the Button

1) 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.

2) 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.

Button properties

Name ,text , back color

Property Function

Fore color The foreground color for the text on the (Button) or its (Font color).

Font The text’s (Font, Size and Style) on the (Button).

Location The location of the (Button) on the Form’s window.

Size The height and width of the (Button) on the Form’s window

Text, name, Fore color, font, back color, size, location, right to left
Property Function Default value

Specifies whether the size of the control (Label) is

Auto size True
automatically adjusted by text written

BorderStyle Specifies the border style of the control (Label) none

21
 Property Function Default value

Visible To show or hide label True

Image To make image as back ground True

Text box: its control can be used for both entering data and displaying results.
(Name- Text- Font –Fore Color – Visible – Size – Location – RightToLeft –)
Property Function Default value

Specifies the maximum number of characters that user

Max length
can write in the (Text Box)

Password Specifies the symbol that will be displayed instead of

char the text written; as example: creating a Password.

Determines whether the (TextBox) control allows

Multi Line False
multiple lines.

Enabled To text box active True

List box: is used for displaying a list of items

(Name –Visible –Size–RightToLeft – ForeColor- Font -BorderStyle )

Property Function

Items Presents a set of items displayed in the (ListBox)

Sorted Specify whether the items are arranged or not false
Selection Determine whether it is possible to select one or more one
Mode item displayed in the (List Box).

22
 Combo box: displays a drop-down list from which one item can be selected.
(Name –Visible – Size –Location – RightToLeft – ForeColor- Font -
BorderStyle –Items)

Default
Property Function
value

The maintained source of items used for

AutCompleteSource
automatic completion of input string.
The input string or (prefix being entered) that
will be compared to the prefixes of all strings in
AutoCompleteMode none
a maintained source; upon which the automatic
completion will be done.

Group box : is used to group other controls of same function together on the Form
window. (Name –Visible – Size –Location – RightToLeft – ForeColor- Font- background
image)

Radio button: is used to select one option from a group of mutually exclusive options.
(Name –Visible – Size –Location – RightToLeft – ForeColor- Font)

Property Function Default value

Indicates if the (Radio Button) has been

Checked false
selected or not
Text The text displayed on the (Radio Button)

Check box: is used to select one or more options

(Name –Visible – Size –Text – Checked – Font – ForeColor– RightToLeft –Location)

23
 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

The Title Bar of the (IDE) window appears

(1) The Solution name. (2) (Visual Studio) version used.

Through it 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) OR

RC on form in solution explorer view code OR
View menu code

24
(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.
(6) A drop-down menu of (Class Names), which refers to the names of

controls placed on the Form.

(7) A drop-down menu of (Method Names) or events; associated with the

Class selected from the (Class Names) menu.

Is the procedure (called into action) when an event occurs

(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
25
Create a new (Project) and set the (Form) as shown in figure

Adjust the property (Name) for the following controls as shown in table

Value of property
no control
name

1. Label1 lbl_Title
2. Button1 Btn_Text
3. Button2 Btn_ForeColor
4. Button3 Btn_Font
5. Button4 Btn_Visible
6. Button5 Btn_End

Open cod windows and type your codes as shown

Questions

Put or 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 flow of steps will always be from top to bottom or from left to right.

26
6) The symbol …………….is used when a question has more than one alternative
7)Two paths (lines)should come out from the diamond … ……… symbol
8)The line with an arrow (flow line) should be from left to right or from top to
bottom.
9)The (Algorithm) is the first stage of Problem Solving
10)Some (Properties) are not effective unless other (Properties) are adjusted first
11)When you create a new (Project) a (Form) window is added to work with.
12)There are no common (Properties) between one (Control) and another.
13)A value should be assigned to any (Property).
14)You can modify the value of a property assigned to a (Control) through the
(Toolbox)
15)The value of the (Property) Size is 98;108 means that the width is 108 and, the
height is 98
16)Radio Buttons are used when the user has the possibility to choose more than
one alternative.
17)User can not choose any item in the control (CheckBox)
18) The symbol is used to present the start or the end (Terminal)
19)The rectangle symbol represents only one processing
20)When adjusting any Property from the Properties window; its effect is shown on
the Form immediately
21)When Setting a (Property) programmatically, its value appears on the right side
of the assignment statement
22)To open the (Code Window) of a Form press (F7)
23)The list of properties displayed in (Properties window) differ from the selected
element
24)The symbol used to output more than one result on the screen or the printer is
…………
27
 25)The value assigned to a property can be changed only from the Properties
window
26)When saving a Project for the first time,the Solution name appears the same as
the project name
…………………………………………………………………………………………………………………..

Inside each symbol of the following Flowcharts write the appropriate instructions.
A= 3.14 * R * R
C= 2 * 3.14 * R
START
END
OUTPUT A
OUTPUT C
READ R

The Figure shows a flow chart for calculating the division of two numbers
Read number1
is number2=0
Print "not defined"
Start
End
Read number2
Output the result
result=number1/number2
The Figure shows a flowchart that calculates the
interest value for the balance (with fixed interest rate)
Interest=balance*rate
END
Read name , balance ,
rate
Output
name,balance,interest
START

The Figure shows a flow chart to find the maximum number among two numbers
.In the case of equality output the message "equal"

IS A=B

28
 IS A > B
Output
"equal"
Read A,B
Output B

The Figure shows a flow chart that will print even integer numbers from 1 and 10

N=N+2
N>10
Sum=0
Sum=Sum+N
Print Sum
N=2

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
Is res ≠ 0
Output "number is odd
Output “number is even"
Input number N

Draw a flowchart for the Algorithm shown in the table

Second algorithm Third “ flow chart

1-Start
2-Sum=0
3-Enter value
4-Sum=Sum+value
5-If value= -1 then
Print Sum
Else Go To 3
6- End

Draw a flowchart for the Algorithm shown in the table

29
 Second algorithm Third “ flow chart
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

…………………………………………………………………………………………………………………………

Write in the table below what the following numbers indicate

30
What is the benefit of this window? …………………………………………………..

Number 1 indicates: …………………………………………………..

Number 2 indicates: …………………………………………………..
Number 3 indicates: …………………………………………………..

For each of the following Event Handlers ,write the event name,and the control
name.

Type the names of the Controls displayed on the shown Form window:
31
 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)

Red Button
Green Button
Blue Button

32
 Type the appropriate lines of code ,and use the Property (Visible) to show or
hide the label (label1)

Show (label1)
Hide(label1)

You have several properties for the control (textbox1) change it to the values
shown (by writing the corresponding lines of code)

Property. valu Line of code

multiline True
font Type : Size:20 Andalus
forecolor Blue
backcolor True
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 ……………
…………………………………………………………………………………………………………………………

choose the correct answer:

33
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

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)
6)The objective or the specific output that we want to attain
34
 ( Problem - Problem Solving – Algorithm)
7) Which of the following express the processing operation
( )
8) To set the Background color of the Form we use the property:
(ForColor-BackColor-Color)
9)Which of the following Properties their effects are active ; only when
(StartDebugging) (ShowInTaskbar-Font-Text )
10) It is the blueprint, from which the individual objects, are created
(Object-Function-Class)
11)In the following formula C = A + B; C represent (Stored value– Variable )
12) Iterations and branching can be represented through
(Flowchart - Algorithm - Problem Solving)
13) The first stage of solving Problem
(Solution steps - Define the Problem - Determine the input)
14) Integrated Development Environment means (IPO-IDE-ERD )

15)The Event Handler consists of:

(Name of the control – The name of the event – Name of the control and name of
the event )
…………………………………………………………………………………………………………………………………

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).

35