---------- Forwarded message ----------
From: vittal <vittal
...@yahoo.co.in>
Date: Feb 22, 2006 12:01 PM
Subject: VB3 & VB4
To: Vittal P <vittal
...@gmail.com>
Profsr.com <http://profsr.com/>
[image: Previous page] Previous
<http://www.profsr.com/vb/vbless02.htm> [image:
TOC] Contents <http://www.profsr.com/vb/vbintro.htm#content> [image:
Next page]Next <http://www.profsr.com/vb/vbless04.htm>
------------------------------
LESSON 3 -- Designing the application
Starting the process When you start to work on a VB Project you are no
longer just a programmer - you are now a developer. You will have to get
much more involved in the whole design process. Unless you are designing an
application for your own use you will have to work with a team of
specialists including, but not limited to, *users, analysts, GUI designer,
programmers, testers, network specialist, webmaster and marketing people*.
The whole process is iterative - do part of it, check it, get input, go back
and correct it, do the next part, and so on. Nobody expects you to do a
whole project in one fell swoop - it would probably be a disaster if you did
do it that way.
The importance of UsersAny project that you develop has to involve
*Users.*They are the people who will sit in front of your interface
for eight hours
a day and decide if they like it or not. If they don't like it, no matter
how efficient the code and how many millions of dollars were spent
developing it, they will find ways to sabotage it.
Get users involved from the start. If you are developing a product to specs,
that is to be sold to some client eventually, there has to be someone who
knows what that eventual client needs. Find a typical user of the product to
use as a sounding board. Remember: you are just the developer; no matter how
cool you think it would be to use all purple text on orange backgrounds, it
is the user who will tell you what is cool and what is not. As you develop
more and more parts of the application, run them by the user to check for
accuracy, completeness, clarity, etc.
Here's an example of how to design for *clarity*. Given that 01/02/03 is a
date, what date is it? If you are an American, you probably automatically
assume that it is January 2nd, 2003. If your user is French, however, he
would assume that it is February 1st, 2003. And if you are working with this
Professor, who has a very definite opinion on the subject, he would say that
it is February 3rd, 2001 and should always be written as 2001-02-03. If all
your forms are designed as: "Enter date" with a blank box beside it, you are
headed for trouble.
*Program design today is a race between software engineers striving to
build bigger and better idiot-proof programs, and the Universe trying to
produce bigger and better idiots. So far, the Universe is winning.*
-- Rich Cook
That's just a joke, by the way. Most users are not idiots. Sometimes they
appear confused because they are trying to solve the problem and they can't
figure out how. But that's not their job. Their job is to explain clearly
what it is they need. Your job is to figure out how to provide it. Don't
underestimate users. Be patient, be understanding without being
condescending and be humble. There's a lot of things that the user knows how
to do that you don't.
Creating the User InterfaceThe user interface that you design is the most
visible and perhaps the most important part of the application. The term
commonly used for this type of interface is: *GUI (Graphical User Interface)
*. It's pronounced "goo-wee", not "guy". It is graphical because it consists
of buttons, menus, icons, etc. An example of a non-GUI is DOS (remember
that?) where everything is text. User interface refers to the fact that it
is the part of the application between the user, in front of the screen, and
the code behind the screen. How well the user can interact with the code
depends on the quality of the interface.
Top <http://www.profsr.com/vb/vbless03.htm#Start>
Guiding principles
- The user is in control. The user must feel he is in charge of the
application. He must have a certain amount of control over such things as
window size, window position, choice of fonts, etc. There should definitely
be a "Preferences" item in the menu.
- Consistency is maintained throughout the application. The user can
move to any part of the application and not have to re-learn how things
work. Consistency in the choice of icons, in date formats, in error messages
means that the user can concentrate on the work. As much as possible, the
application should be consistent with Windows standard. For example, "Move
to the Recycle Bin" is different from "Delete" - the user has come to expect
that an item in the Recycle Bin can be recovered if need be.
- Application should be "forgiving", or "fault-tolerant". Users will
make mistake. A single error should not bring the application crashing to
the floor. If there is no room for errors, users will be afraid to
experiment, to discover on their own how to do things. It will slow the
learning process considerably.
- Always supply feedback. The user should always know that something
is going on, especially if it's in the background and may take several
minutes to run. Display an hourglass or a progress meter or a status bar so
that the user doesn't start to hit keys at random to get something to
happen. It only takes a few seconds of inactivity for the user to get
frustrated and think that the program is "hanging".
- Don't neglect esthetics. The visual aspect is important. The
environment should be pleasing to the eye. The presentation style should
help in understanding the information presented.
- Interface should be simple without being simplistic. There should be
a balance between simplicity and functionality. Popup menus, for example,
allow you to increase the functionality without having to encumber the
screen with all kinds of details which are not used 95% of the time.
*On the importance of language*
Throughout the project you are going to be doing, you should give some
thought to the quality of the language used. As a teacher of technology, I
am constantly defending the compulsory language courses included in the
curriculum. I have to point out that your mastery of the language, or lack
thereof, projects an image of who and what you are. You don't have to go
very far to see an example of this at work: just look at President George W.
Bush. I have never met the man and I have no idea whether he is smart or
dumb. But the media certainly have an opinion - just watch "The Tonight Show
with Jay Leno" just about any night. They have tagged him as an idiot, not
because of what he thinks but because of some mistakes he made while he was
speaking. This is the 21st Century - image is everything!
When I was young, a long, long time ago, in a galaxy far, far away, teachers
used to say all the time: "Sloppy work is the sign of a sloppy mind!". The
President notwithstanding, there is a lot of truth in that. If you can't be
bothered to display the interface correctly, what does that say about the
rest of your work? Professionalism should be evident in every part of what
you create. If what is seen by the public is shoddy, there is reason to
believe that the work behind the interface (90% of the application) is also
shoddy.
If you are developping an application for yourself, nobody cares what it
looks like. If it's a small project for a client that you know, you may be
able to get away with some mistakes. Usually however, a project is broader
in scope and you don't know the audience. Remember that you are now working
in the global village. The interface you write and display may be seen, via
the Internet, by millions and millions of critical users. Even if it's not
your reputation riding on it, the reputation of your client may be. And you
can be sure that he will take it seriously, even if you don't. If language
is not your area of expertise, get help from somebody whose area it is.
Having said all that, I realize that I am really sticking my neck out.
Although every effort has been made to make these tutorials as error-free as
possible, it is inevitable that some mistakes will slip through. You are
allowed to say, "Gotcha!" when you spot mistakes. Accept my apology and I
will correct all errors as soon as they are spotted.
*To err is human.
But it takes the Web to let millions of people know that you erred!*
Top <http://www.profsr.com/vb/vbless03.htm#Start>
Interface styleOne of the first decisions you have to make is whether to go
*SDI (Single Document Interface)* or *MDI (Multiple Document Interface).* If
you have worked with Windows for any length of time, you have probably seen
both. Notepad is an SDI - you can only have one document open at any time.
Word is an MDI - you can open a number of documents and switch between them
at will. An MDI application imposes different constraints on the developer
because of the need to juggle several different forms at the same time. It
usually requires more experience in the development process. For the
purposes of this tutorial, we will work only with SDI applications.
Design considerations
- What is the purpose of the application? Is it a once-a-year thing or
one that is in use 24/7? The user will forget the details if he only uses it
once a year and you will have to be a lot more specific with the Help
functions.
- Who is the intended audience? Beginning users will need more
directions than experienced users.
- How many different forms will be needed (you can have several forms
without being MDI) and how will they be connected?
- What are the menus going to say? Will toolbars be used to replicate
menu functions?
- How are errors going to be identified to the user? How will they be
corrected?
- How much Help (in the form of a Help function) is going to be
provided?
- How will consistency be maintained across the application? It is
important that all forms have the same "look and feel" in terms of colors,
fonts, menus, toolbars, etc.
We will examine the design process in more detail as we develop the Projects
in the following lessons. If you are serious about the design aspect of
software, one of the best sources of information is the book: *"The Windows
Interface Guidelines for Software Design"* published by *Microsoft Press*,
reference *ISBN 1-55615-679-0*.
------------------------------
Top <http://www.profsr.com/vb/vbless03.htm#Start>
Home <http://www.profsr.com/>
Tutorials<http://www.profsr.com/home3.html>
Profsr.com <http://profsr.com/>
[image: Previous page] Previous
<http://www.profsr.com/vb/vbless03.htm> [image:
TOC] Contents <http://www.profsr.com/vb/vbintro.htm#content> [image:
Next page]Next <http://www.profsr.com/vb/vbless05.htm>
------------------------------
LESSON 4 -- Standard controls
For this lesson we will need a *new Project*, call it *Lesson4.vbp*, which
will only be used to create and try out various controls.
To refresh your memory, since the previous two lessons have been rather
theoretical, you select the New tab, and Standard EXE** for the type. As
soon as The Form opens, you *Save* the new Project, *give the Form a name*,
let's say it's Lesson4.frm and then you *give the Project a name:*
Lesson4.vbp. Note that you do not have to specify the extensions, .frm and
.vbp, because they will be assigned automatically.
The FormWe covered it too briefly in Lesson1 so we'll go over it again. The
Form is the first object you see when you Open the application. It is the
window into which all the controls will appear, where you will input data
and see results.
There's not too much you can do with the form, at this time. Basically, you
adjust the *BackColor* and the *StartUpPosition* (where it will open on the
screen when you Run it) and then you start putting controls on it.
The LabelThis is probably the first control you will master. It is used to
display static text, titles and screen output from operations. The important
properties to remember:
- Caption - the text that is displayed in the label
- BackColor and ForeColor - colors of the background and the text
- BackStyle - Opaque or Transparent - whether the background is
visible or not
- Font - font and size of text
- Alignment - text centered, left or right
- Multiline- True or False - if True, you can have several lines of
text, delimited by <CR> in the label - by default, it is set to False
Frame PictureBoxWhen you want to group several controls together - name and
address, for example - you use a *Frame*. The frame backcolor can be the
same as the form's and only the frame borders will be obvious, or it can be
a different color and stand out.
You create the frame before the controls. When you create controls in a
frame, they are tied to the frame and move with it. The frame caption is the
text that appears at the top of the frame - you use it to define the group.
The *PictureBox* is like a Label with a picture in it instead of text.
The *Picture
property* determines the name of the file, .BMP or .GIF, that will be
displayed. It can be used for a company logo, etc.
Top <http://www.profsr.com/vb/vbless04.htm#Start>
TextBox CommandButtonThe TextBox is like a Label but, it is used to input
data into the program. The data typed in is in the *Text* property of the
control.
When the program is Run, only the controls that can be manipulated will be
activated. For example, if the form contains 3 Labels, 3 TextBoxes and 3
Buttons, when it is Run, the cursor will not stop at the labels.
When the user hits the Tab key, the cursor will go to the first TextBox or
Button - not necessarily the first one on the form but, the first one that
was created. That is called the *Tab order* and you have to specify it.
On the form there is only one control at any given time that has the cursor
on it - it is said to have *Focus*. If you type data, the control with Focus
will receive it. You change the Focus with Tab or by clicking on a different
control.
Up until now we haven't bothered with the names of controls (the Name
property). Once we start to code, however, it does become important. There
are all kinds of occasions in code where you have to call upon a certain
control. It can get very confusing when your 12 buttons are called
Command1...Command12. What did Command7 do, again? Give each control a name
(except for titles, etc. that you never refer to) so that you will be able
to identify it easily. It is recommended that you use a prefix when
assigning a name; cmd for a CommandButton, lbl for a Label, txt for a
TextBox. Thus, txtNumber where you input the value can be distinguished from
lblNumber where you display the result.
The CommandButton is used to initiate actions, usually by clicking on it.
The Caption property determines the text to display on the face of the
button. The *Default* property, if set to true, means that the button will
be activated (same as Clicked) if the <Enter> key is hit anywhere in the
form. If *Cancel* is set to True, the button will be activated from anywhere
in the form by the <Esc> key.
Hopefully, you have now run this program several times, each time you added
a new control, in fact. Admittedly, nothing much happened except to confirm
that the controls were appearing in the right place on the form.
Here now is an example of the code we could write to perform simple tasks:
input name and city and display the information in a label when the Continue
button is clicked. The Exit button will end execution of the program and the
Cancel button (or the Esc key) will clear the fields.
A few explanations: the Form_Load event occurs when the form first opens.
This is where we initialize things - we want the TextBoxes and the result
Label to be empty when we start off so, we set them to a blank space.
The actual processing is done after the data have been entered and we hit
the Continue button. The processing logic is put in the
Continue_button_clicked event.
When you hit the <Esc> key or you click on the Cancel button, you want to
annul the entry you're doing and start over again. That's the same as
opening the form so, we just tell the program to execute the Form_Load
procedure which we already have.
The Exit button uses the *pronoun Me* to Unload. *Me* means *the form
currently active* without having to name it.
Top <http://www.profsr.com/vb/vbless04.htm#Start>
*Multiple forms*
For the next series of examples we will use a new Form. It is not necessary
to create a new Project; any Project can have several Forms in it.
With the Project open on the current Form, go to: Menu --> Project --> Add
form. Select New form in the creation window and, voila! Next time you save
the Project, it will ask you to name this new Form. You can name it
Lesson4B.frm for example.
One more detail: when you Run the Project, you want to tell it which Form to
open.
Go to the *Project Manager window*, right click on the Project name and
select *Project properties*. In the Project properties window, the ListBox
on the right says "*Startup object*". Select the Form you want to open when
you Run. You can change the Startup object at any time to run the different
forms that you created.
Check boxes Option buttonsThese two controls are used when the user must
choose from a list of options. The difference between the two is that with
Check boxes he can select several at one time but, with Option buttons, he
must select only one among several.
The example below illustrates the use of Check boxes and Option buttons. To
capture the information entered by means of these controls, you must test
the *property: Value.* In a Check box, *Value = 1 if box is checked and = 0
if not.* In an Option button, *Value = True if selected and = False if not.*
The code, although somewhat long, is not very complicated. Most of the time,
processing consists of checking the content of .Value. It is fairly standard
procedure, especially with Option buttons, to ensure that at least one
button has been selected and to display an error message if it has not.
Assignment 3Create the Payroll form shown below. Number of hours must be
entered as well as the appropriate rate. Gross salary = rate * hours. Net
salary = gross salary - deductions.
------------------------------
Top <http://www.profsr.com/vb/vbless04.htm#Start>
Home <http://www.profsr.com/>
Tutorials<http://www.profsr.com/home3.html>
------------------------------
Jiyo cricket on Yahoo! India
cricket<http://us.rd.yahoo.com/mail/in/mailcricket/*http://in.sports.yahoo.co...>
Yahoo! Messenger
Mobile<http://us.rd.yahoo.com/mail/in/mailmobilemessenger/*http://in.mobile....>Stay
in touch with your buddies all the time.