programming
work
Computers are NOT very smart!
A computer is made up of
millions of electronic
switches (transistors) that
are ON (1) or OFF (0).
With different
combinations of these
switches, you can make the computer do something, for
example, display something on the screen or make a
sound.
Basically, programming tells a computer what to do.
programming language
People use a language with many words. Computers do the same, but they use a
simple language (machine language) with 1’s and 0’s (1 = On, 0 = Off).
It would be very very difficult to talk to a computer in its own language.
Hi!
A programming language is a translator between you and the computer. A special
program called a compiler takes the instructions written in the programming
language and converts them to machine language.
There are many many programming languages, such as Java,
C++, PHP, C, FORTRAN, Basic, Pascal, Python, C#.
We will study an easy programming language, called Visual Basic.
Visual Basic programmer
don't need
understand
Visual Basic programming language works
Visual Basic language
Visual Basic is similar to the language you use every day. When you speak, we use
verbs like Go, Run, Jump. Visual Basic also uses words (programming elements) that
are used to write programs.
When you speak, you also follow grammar rules. Visual Basic is the same.
For example:
In Visual Basic, we would write:
The maximum speed of my car is 55.
Car.Speed.Maximum = 55
Visual Basic
Microsoft Visual Studio 2010 Visual
Basic
Internet Web Browser
Internet Explorer Mozilla Firefox
This is not an easy project!!! Please listen carefully
& follow these instructions EXACTLY!
1. Open Microsoft Visual Studio 2010.
Select Visual Basic Development Settings.
Now, select Start Visual Studio.
Click on New Project.
Windows
Click on Windows Forms
Application.
Rename this as Web Browser.
IMPORTANT!!!
Create a new folder in your
Student folder in Drive D.
Rename it as Web Browser.
Form
MS Access
Solution
Explorer
all
files
Properties
Form
Select Debug,
Options and Settings.
Click on the Projects and Solutions
tab.
Set up all 3 to go to your folder in
Drive D.
project
here
In the Solution Explorer window,
right click on the Form.
Rename it Web Browser.vb.
IF
Toolbox not
showing
View
Toolbox
triangle icon
Dock
lock
toolbox
position
GRAPHICAL USER
INTERFACE GUI
the user
see
click on
Form
MS Access
pictures
Form
Form
buttons
text
Microsoft Internet Explorer
Panel
Text Box
Web Browsing Window
EXACTLY
2. Click on the All
Windows Forms tab.
Now, click on the Panel
icon.
Drag it to the Form.
size
same
Now, click on the Textbox icon.
Drag it to the Form.
size
Now, click on the Button icon.
Drag it to the Form.
size
Now, click on the Web Browser
icon.
Drag it to the Form.
size
properties
each box
3. Click on the Panel box.
Properties
panel
top
FILL all
Form
Select Dock.
Click on the top box.
Now, click on the
triangle next to Size.
Change the Height to
50.
Form
same
Browser
Web
Click on the Web
Browser.
Select Dock.
Click on the
middle box.
resize
Form
Click here and make the Form a lot larger.
Form
Panel
bigger too
Web Browser
Dock tool
name
Button
4. Click on the
Button.
Now, select Text.
Rename it as Go!.
Now, move the Go! button to here and make the button bigger.
Now, click Font.
Click here.
Change the Font
settings.
Change the Fore Colour.
Add a background colour.
Change the Flat Style.
picture
GIF animation
background
On the Image option, click here.
On the Local Resource tab, import your
Image.
picture
NOT look
OK
edit
size Photoshop
Warning!
GIF
animation
background
picture
cannot edit
size
5. Click the Text Box and drag to make it longer.
Now, set Multi Line to True (=Yes).
resize
Text Box
Click on the triangle next to Size.
Change the Height to 40.
Change the Background Colour.
Change the Font Colour.
Change the Font settings.
Play button
rename
6. Click here.
Form
Rename your Form (Colin’s Web Browser).
picture
Panel
7. Click here.
Panel 1
Change Border Style to Fixed 3D.
For the Background
Image, click here.
On the Local Resource
tab, import your Image.
picture
NOT look
OK
edit
size Photoshop
picture
GIF animation
background
web
browser
8. Select WebBrowser1.
Select Dock,
None.
Now, select PictureBox.
Click and drag
it to here.
Now, select Dock,
Fill.
Right click here.
Select Send to Back.
For the Image, click here.
Select Local Resource,
Import.
Play icon
Full Screen
picture
NOT look OK
here
00
Size Mode
00
Image
Warning!
WebBrowser1
BIG enough
web
browser
useless
Stretch
Full
Screen
pictures GIF
animation
blank
spaces
Warning!
NOT
You will destroy
your web
browser!
9. For EACH picture or GIF animation, select
PictureBox.
Click and drag the Picture Box
into your Form.
Change the Border Style to Fixed 3D.
Select Image.
Click here.
On the Local Resource tab, import your Image.
Make your
picture bigger
or smaller.
Put it where you want.
picture
OK
NOT look
here
00 00
00
Repeat Step 9
EACH picture
GIF animation
Size
Mode Stretch
Image
00
Full Screen
Form
Visual Basic
code commands
real web browser
really easy
understand
10. Double click on the Go! button.
All of the code here is
LINKED to the Button!
code here
Button1_Click
name declaration
Button
Go
button
code
here
Button
Go button
program
Textbox
different web sites
Go button
Web Browser box
This is the Visual Basic code we need:
WebBrowser1.Navigate(Textbox1.Text)
Form Command Go Play
Form Text
Numbers
Select Debug, Start Debugging.
debugging
error
program
OK
On your Form, type
in www.google.com
and click on Go!.
click
install
double
Application file
Form
open
11. Select File, Save All.
Don’t change the folder!!!
At the top, select Build,
Configuration Manager.
Change this to Release.
Click Close.
Now, select Build, Build WebBrowser.
application file
Go into Documents on
your computer.
Find this.
Web Browser application file
Double click on your application file.
OK
Rename your application file and send ONLY the
application file to ICT!!!
As you can see, there is no need to
be afraid of computer programming.
good
formatting
Form
application
user-friendly
easy to use
Click File, Save As
Go into Folder Lock.
On the Desktop, you
will see Mr. Colin’s
ICT Class.
Double click on it, and
then click and drag your work.