The document describes various types of screen-based controls used in user interfaces, highlighting their functionalities and advantages. It categorizes controls such as buttons, text entry fields, selection controls (like radio buttons and checkboxes), and combination controls (like spin boxes and drop-down menus). Additionally, it explains presentation controls that provide informational support, such as static text fields and progress indicators.

1. SCREEN-BASED CONTROLS

2. Screen Based Control
Screen-based controls, often simply called controls and
sometimes called widgets.These are the graphic
components which we can see on the Screen and can
interact with them.
Ex:

3. Screen based controls do can:
Selection of a particular value.
Editing of a particular value.
Display a particular piece of text, value, or graphic.
Cause an action to be performed.

4. Types:
 Buttons
 Text entry/read-only controls
 Selection controls
 Combination entry/selection controls
 Custom controls
 Presentation controls
 Web controls

5. Buttons
 A square or rectangular-shaped control with a label inside that
indicates action to be accomplished.
 The label may consist of text, graphics or both.
Purpose of buttons are:
 To start actions.
 To change properties.

6. Advantages
 Always visible, reminding one of the choices available.
 Can be logically organized in the work area.
Disadvantages
 Size limits the number that may be displayed.
 Requires looking away from main working area to activate.

7. Text Entry/Read-Only Controls
A control is usually rectangular in shape, in which text may
be entered or may be displayed for read-only purposes.
Entry:
Read-only:

8. Advantages
 Very flexible.
 Consumes little screen space.
Disadvantages
 Requires use of typewriter keyboard.
 Requires user to remember what must be keyed.

9. Selection Controls
To select a particular value(s)
Types:
 Radio Buttons
 Check Boxes

10. Radio Boxes
These are used for a selecting a single element from a group of
list of elements or items.
When the user selects a radio button, any button previously
selected gets deselected automatically.
A two part control consisting of the following
 Small circles, diamonds or rectangles.
 Choice descriptions.
When a choice is selected the option is highlighted.

11. Advantages
 Easy-to-access choices.
 Easy-to-compare choices.
Disadvantages
 Consume screen space.
 Limited number of choices

12. Check Boxes
A checkbox is used to select many choices at a time and some will
have default checked. A two-part control consisting of a square box
and choice description.
Each option acts as a switch and can be either “on” or “off”.
When an option is selected, a mark such as an “X” or “check” appears
within the square box or the box is highlighted in some other
manner.
If square box is unselected or empty (off)
Each box can be:
 Switched on or off independently
 Used alone or grouped in sets

13. Advantages
 Easy-to-access choices
 Easy-to-compare choices
Disadvantages
 Limited number of choices.
 Single check boxes difficult to align with other screen controls.

14. Combination text-entry/selection controls:
A control can have characteristics of both a text field and a
selection field.
Here information is either typed or selected and placed in it.
Ex:

15. Types:
 Spin boxes
 Attached combination boxes
 Drop-down/pop-up combination boxes

16. Spin boxes:
A spin box, also called a spin button, is a single-line
field followed by two small, vertically arranged buttons
inscribed with up and down arrows.
-We can enter a value or we can navigate through
up-down arrows.

17. Advantages:
 Consumes little screen space
 Flexible, permitting selection or typed entry
 Useful for small set of values
Disadvantages:
 Sometimes difficult to operate
 Useful only for certain kinds of data
 Difficult to compare choices

18. Combo boxes:
A single rectangular text box entry field and can display
a list of options
- Allows both text entry or selecting one/multiple
option(s)

19. Advantages:
Disadvantages:
 Consumes some screen space
 All list box choices not always visible, requiring
scrolling
 The list may be ordered in an unpredictable way,
making it hard to find items
Unlimited number of entries and choices
Flexible, permitting selection or typed entry
Can select one or more options
Entries not necessarily restricted to items
selectable from list box

20. Drop-down/pop-up boxes:
A single rectangular text box with a small button to the side and
an associated hidden list of options.
When we click on down arrow, options are visible
-We can select only one option either by text entry or by
selection

21. Advantages:
 Unlimited number of entries and choices
 Flexible, permitting selection or typed entry
 Entries not restricted to items selectable from list box
 Conserves screen space
Disadvantages:
 Requires an extra step to display the list of choices.
 When displayed, all box choices may not always be
visible, requiring scrolling
 User may have difficulty in recalling what to type.
 The list may be ordered in an unpredictable way, making
it hard to find items

22. Other operable controls:
Slider
Date picker
Tree
Scrolling bar

23. Slider:
A scale exhibiting a range of values.
-in smart phones used for setting brightness, volume etc.
-in PC for setting screen size, resolution etc.
-used in media players.
Best examples: MX player,VLC player

24. Date Picker:
A drop-down list box that displays a 1-month calendar in the
drop-down list box.
-month can be changed by pressing command buttons with
left- and right-pointing arrows.

25. Tree View:
A special list box control that displays a set of objects as
hierarchical view.

26. Scroll Bar:
A vertical or horizontal bar commonly located on the far right or
bottom of a window that allows you to move the window
viewing area up, down, left, or right.

27. Presentation controls:
Presentation controls are purely informational.They provide
details about other screen elements or controls.
Ex:

28. Types:
 static text fields
 group boxes and column headings
 balloon tips
 progress indicators

29. static text fields:
Read-only textual information.
Purpose:
 To identify a control by displaying a control caption.
 To present descriptive information.

30. group boxes and column headings:
Group box:
A rectangular frame that surrounds a control or group of
controls.
Purpose:
 To visually relate a group of related controls.

31. Column headings:
A column heading control, also known as a header control, is
used to display a heading above columns of text or numbers.
Purpose:
 To identify a column of information contained in a table.

32. Boolean tip:
A small pop-up window that contains information in a word
balloon
Purpose:
 To provide additional descriptive about a screen element.

33. Progress Indicators:
A rectangular bar or circular that fills as a process is being
performed, indicating the percentage of the process that has
been completed.
Purpose:
 To provide feedback about the completion of a lengthy
operation.

34. Selecting proper controls: