Chapter
`
`Menus Controls and Toolbars
`
`The width of the list box should
`
`be sufficient
`
`to display the average
`because
`is not practical
`of space
`consider one or more
`
`width of an entry in the list
`of what
`or the variability
`the list might include
`of the following
`
`If that
`
`options
`
`Make the list box wide enough
`distinguished
`
`sufficiently
`
`to allow the entries
`
`in the list
`
`to be
`
`Use an ellipsis .. in the middle or at the end of long text entries
`to shorten them while preserving the important
`needed to distinguish them For example for long paths usually
`and end of the path are the most critical
`the beginning
`you can
`use an ellipsis to shorten the entire name \Sample\.
`.\Example
`
`characteristics
`
`Tnelude
`
`hnriznntal
`
`scrnll bar Howe\ er this option reduces
`some
`the number of
`usability because
`the scroll bar reduces
`adding
`the user can view at one time In addition
`if most entries
`entries
`in the list box do not need to be horizontally scrolled
`including
`scroll bar accommodates
`horizontal
`case
`the infrequent
`
`When
`
`selected Sup
`list box it becomes
`the user clicks
`an item in
`for multiple selection depends on the type of list box you use
`port
`List boxes also include scroll bars when the number of items in the
`list exceeds
`the visible
`area of the control
`
`list
`
`Arrow keys also provide support
`for selection and scrolling
`box In addition
`list boxes include support
`for keyboard selection
`using text keys When
`text key the list navigates
`the user presses
`and selects
`the matching item in the list scrolling
`the list
`if necessary
`to keep the users selection visible Subsequent key presses continue
`the matching process Some list boxes support sequential matches
`key the control
`on timing each
`based
`time the user presses
`matches the next character
`word if the user presses the key
`in
`within the systems time out setting If the time-out
`the
`elapses
`to matching based
`on the first character Other
`control
`is reset
`as combo boxes and drop down combo boxes do
`box controls
`such
`on the characters typed
`sequential character matching based
`into the
`text box component of the control
`These controls may be preferable
`they do not require the user to master
`because
`the timing sequence
`However they do take up more space
`and potentially allow the user
`in the list box
`that do not exist
`to type in entries
`
`list
`
`150
`
`The Windows
`
`Interface
`
`Guidelines
`
`for Sottware
`
`Design
`
`172
`
`

`

`Menus Controls and Toolbars
`
`Chapter
`
`When
`
`the list
`
`or end of data disable the
`is scrolled to the beginning
`scroll bar arrow button If all
`items in the list are
`corresponding
`visible disable both scroll arrows If the list box never
`includes more
`can be shown in the list box so that
`the user will not need
`items that
`the list you may remove the scroll bar
`
`to scroll
`
`windows design consider
`When
`list box into
`incorporating
`supporting both command Cut Copy and Paste and direct
`for the list box For example
`drag and drop transfers
`manipulation
`the user can move or copy to
`if the list displays icons or values
`that
`list box support
`such
`as another
`other locations
`transfer
`operations
`supports this how
`for the list The list view control automatically
`the system provides support
`for you to enable this for other list
`ever
`boxes as well
`
`For more
`
`information
`
`about
`
`disabling scroll bar arrows see
`Windows
`
`Chapter
`
`List boxes can
`
`by how they display
`type of selection they support
`
`be classified
`
`list and by the
`
`Single Selection List Boxes
`
`single selection list box is designed
`for the selection of only one
`item in
`the control provides
`mutually exclusive
`list Therefore
`list box
`group of option buttons
`operation similar to
`that
`except
`large number of items
`can more efficiently
`handle
`
`Define
`
`design
`
`vertical
`
`to show at least
`selection list box to be tall enough
`single
`as shown
`on the
`three to eight choices
`depending
`in Figure 7.13
`constraints of where the list box is used Always include
`scroll bar If all the items in the list are visible then follow
`the window
`and
`scroll bar guidelines for disabling the scroll arrows
`enlarging the scroll box to fill
`
`the scroll bar shaft
`
`utter Pecan
`
`Chocolate Chip
`
`Fudge
`
`Swirl
`
`Pistachio
`
`Raspberry
`
`Figure
`
`7.13
`
`single selection
`
`list box
`
`The Windows Interface
`
`Guidelines
`
`for Software Design
`
`151
`
`173
`
`

`

`Chapter
`
`Menus Controls and Toolbars
`
`The currently selected item in
`
`lighted using selection
`
`single selection list box is high
`appearance
`
`The user can select
`single selection list box by clicking
`an entry in
`on it with mouse button
`for pens tapping TIns also sets the input
`focus on that
`item in the list Because
`this type of list box supports
`only single selection when the user chooses
`another entry any other
`selected item in the list becomes
`The scroll bar in the list
`unselected
`box allows the mouse user to scroll
`
`the list of entries fol
`
`through
`
`lowing the interaction
`
`defined for scroll bars
`
`For more
`
`information
`
`about
`
`the interaction techniques
`scroll bars see Chapter Windows
`
`of
`
`The keyboard interface uses navigation keys such
`the arrow keys
`as
`HOME END PAGE UP and PAGE DOWN It also
`uses text keys with
`on timing for example when the user presses
`matches based
`text
`key an entry matching that character scrolls
`to the top of the list and
`becomes
`selected These keys not only navigate
`to an entry in the
`is currently selected when
`it If no item in the list
`list but also select
`list navigation key the first item in the list
`to that key is selected For example if the user presses
`corresponds
`the DOWN ARROW key the first entry in the list
`is selected instead
`item in the list
`of navigating to the second
`
`the user chooses
`
`that
`
`in the list box represent values
`for the property of
`If the choices
`selection then make the current value
`and highlighted when
`visible
`displaying the list If the list box reflects mixed values
`for multiple
`selection then no entry in the list should
`be selected
`
`Drop-down List Boxes
`
`Like
`
`the list
`
`list box
`list box provides for the
`drop-down
`single selection
`single item from list of items the difference is that
`selection of
`is displayed upon demand In its closed state the control
`The user opens
`displays the current value for the control
`the list
`the drop down list box in its
`the value Figure 7.14 shows
`change
`closed and opened stae
`
`to
`
`Figure
`
`7.14
`
`drop-down
`
`list box closed
`
`and opened
`
`state
`
`152
`
`The Windows Interface
`
`Guidelines
`
`for Software Design
`
`174
`
`

`

`Menus Contruls and Toolbars
`
`Chapter
`
`are an effective way to conserve
`While drop-down
`list boxes
`they require more user interaction
`and reduce clutter
`for browsing
`single selection list box
`and selecting
`an item than
`
`space
`
`Make the width of
`list box
`few spaces larger
`closed drop-down
`than the average width of the items in its list The open list compo
`to show three to eight
`nent of the control should
`be tall enough
`single selection list box
`the same conventions
`items following
`of
`The width of the list should
`be wide enough
`not only to display
`in the list but also to allow the user to drag directly
`
`the choices
`
`into the list
`
`for menus
`The interface for drop down list boxes is similar to that
`the user can press the mouse button on the current
`For example
`setting portion of the control or on the controls menu hutton to dis
`play the list Choosing an item in the list automatically
`closes the list
`
`to the control using an access key the TAB key
`If the user navigates
`or arrow keys an UP ARROW or DOWN ARROW or ALTUP ARROW
`or ALTDOWN ARROW displays the list Arrow keys or
`text keys
`If the user presses ALTUP
`and select
`items in the list
`navigate
`ARROW ALTDOWN ARROW
`navigation key or an access key to
`closes When
`move to another
`the list automatically
`the list
`control
`made while the list was open
`The
`preserve any selection
`is closed
`ESC key also closes the hst
`
`drop down list
`for the property of
`represent values
`If the choices
`in
`multiple selection and the values
`for that property are mixed then
`display no value
`component of the control
`in the current setting
`
`Extended and Multiple Selection List Boxes
`
`lists some contexts
`Although most
`list boxes are single selection
`require the user to choose more than one item Extended selection
`list boxes and multiple selection list boxes support
`
`this functionality
`
`should
`
`Extended and multiple selection
`follow the same conven
`list boxes
`list boxes The height
`for height and width as single selection
`tions
`display no less than three items and generally no more
`than eight unless the size of the list varies with the size of the
`window Base the width of the box on the average width of the en
`tries in the list
`
`The Winduws Intertace
`
`Guidelines
`
`tor Sottware Design
`
`153
`
`175
`
`

`

`Chapter
`
`Menus Controls and Toolbars
`
`Extended selection list boxes support conventional
`and disjoint
`That
`selection techniques
`contiguous
`
`navigation
`
`and
`
`is extended
`
`sclec
`
`For more
`
`information
`
`about
`
`contiguous
`
`and disjoint selec
`
`tion list boxes
`
`are optimized for selecting
`range while still providing for disjoint
`
`single item or
`
`single
`
`selections
`
`tion
`
`techniques
`General
`
`Interaction Techniques
`
`see Chapter
`
`For more
`
`information
`
`about
`
`controls
`
`style for
`the flat appearance
`list box see Chapter
`13 Visual Design
`
`in
`
`selec
`
`When
`you want
`to support user selection of several
`disjoint entries
`from list but an extended
`selection list box is too cumbersome
`you can define multiple selection list box Whereas
`extended
`tion list boxes
`are optimized for individual
`item or range selection
`multiple selection list boxes
`selection
`are optimized for independent
`However because
`are not visu
`simple multiple selection list boxes
`from exteuded
`selection list boxes consider designing
`ally distinct
`them to appear similar to
`list of check boxes as shown
`scrollable
`in Figure 7.15 This requires providing your own graphics for the
`items in the list using the owner-drawn list box style This appear
`the difference in the interface of
`ance helps the user to distinguish
`the list box with
`familiar convention It also
`keyboard navigation from the state of
`box controls are nested
`style for the
`you use the flat appearance
`check boxes You may also create this kind of
`list box using
`view control
`
`serves to differentiate
`Because
`the check
`
`choice
`
`list
`
`...
`
`Yearly Statistics
`
`Financial
`
`Summery
`
`Samson AccounF
`
`Lukison Review
`
`Figure
`
`7.15
`
`multiple
`
`selection
`
`list box
`
`154
`
`The Windows Interface
`
`Guidelines
`
`for Software Design
`
`176
`
`

`

`List View Controls
`
`Menus Controls and Toolbars
`
`Chapter
`
`list view control
`
`is
`
`selection list box that dis
`special extended
`item consisting of an icon and
`collection of items each
`plays
`label List
`iess controls can display
`content
`in four different
`
`ies
`
`View
`
`Icon
`
`Small Icon
`
`List
`
`Report
`
`Description
`
`item appears as
`Each
`The user
`can drag the icons
`
`full-sized icon with
`
`to any location
`
`label below it
`within the view
`
`item appears
`Each
`The user
`can drag the icons
`
`as
`
`small
`
`icon with its label
`to the right
`within the view
`
`to any location
`
`Each
`
`item appears
`The icons
`
`appear in
`
`as
`
`small
`
`icon with its label
`
`to the right
`
`columnar
`
`sorted
`
`layout
`
`furmat with
`line in multiuuluuin
`and its label The
`
`the icun
`
`ECLh item appears
`as
`culumn including
`the leftmost
`subsequent columns
`
`contain
`
`information
`
`by the
`
`supplied
`the list view control
`
`application
`
`displaying
`
`The control
`
`also supports options for alignment of icons selection of
`of icons and editing of the icons labels It also sup
`icons sorting
`drag and drop interaction
`
`ports
`
`Use this control where the representation of objects as icons is ap
`on the icons displayed
`provide pop up menus
`In addition
`propriate
`consistent paradigm for how the user
`in the views This provides
`in the Windows
`interacts with icons elsewhere
`interface
`
`Selection and navigation in this control work similarly to that
`folder windows For example clicking on an icon selects
`it After
`the icon the user can use extended
`selection techniques
`selections
`
`selecting
`
`including region selection
`for contiguous
`or disjoint
`Arrow keys and text keys time out based matching
`board navigation and selection
`
`support key
`
`in
`
`the standard
`
`As an option
`control also supports the display of
`information
`For example
`graphics that can be used
`to represent state
`you can use this functionality to include check boxes next
`to items
`hst
`
`in
`
`The Windows Interface
`
`Guidelines
`
`for Software Design
`
`155
`
`177
`
`

`

`Chapter
`
`Menus Controls and Toolbars
`
`Tree View Controls
`
`tree view control
`
`is
`
`list box control
`
`special
`on their
`outline based
`objects as an indented
`logical
`relatinnship The contrnl
`includes huttnnc
`that allnw the nutline tn be
`as shown
`expanded and collapsed
`in Figure 7.16 You can use
`view control
`to display the relationship between
`set of containers
`or other hierarchical elements
`
`that displays
`hierarchical
`
`set of
`
`tree
`
`Buttons
`for expanding
`and collapsing
`outline
`
`Desktop
`My Computer
`3M Floppy ll
`CM Floppy
`Bobbys Hard Disk iCi
`
`Personal
`
`Reviesrs
`
`Monthly
`Judys File
`Finanoe
`
`tatatics
`
`Scrap
`Human
`
`Resources
`
`Lines
`
`illustrate
`
`hierachical
`
`relationships
`
`Figure
`
`7.16
`
`tree view control
`
`label of each item in
`You can optionally include icons with the text
`icons can be displayed when the user expands
`the tree Different
`you can also include
`collapses the item in the tree In addition
`check box that can be used
`to reflect
`state
`infor
`the item
`
`such
`graphic
`mation about
`
`as
`
`or
`
`lines
`
`The control also supports drawing
`that define the hierarchical
`relationship of the items in the list and buttons for expanding
`and
`is best to include these features even
`collapsing the outline It
`they make it easier for the user to
`because
`though they are optional
`the outline
`
`interpret
`
`156
`
`The windows Interface
`
`Guidelines
`
`for Software
`
`Design
`
`178
`
`

`

`Menus Controls and Toolbars
`
`Chapter
`
`Arrow keys provide keyboard support
`the
`for navigation through
`the user presses UP ARROW and DOWN ARROW to move
`control
`between items and LEFT ARROW and RIGHT ARROW to move along
`branch of the outline Pressing RIGHT ARROW can also
`particular
`branch
`Text
`expand the outline at
`if it is not currently displayed
`keys can also be used
`and select
`items in the list using
`the matching technique
`
`to navigate
`on timing
`based
`
`in
`
`When
`
`dialog box if you use the ENTER key
`you use this control
`to carry out the default command for an item
`or use double-clicking
`in the list make certain
`the default command button in your
`that
`dialog box matches For example if you use double-clicking
`an
`entry in the outline to display the items properties
`then define
`Properties button to be the default command button in the dialog
`box when the tree view control has the input
`focus
`
`Text Fields
`
`includes
`
`Windows
`number of controls that
`facilitate the display
`text value Some of these controls combine
`entry or editing of
`basic text-entry field with other types of controls
`
`as
`
`For more
`
`information
`
`about
`the sec
`Text Fields later
`
`text
`
`fields see
`
`in this
`
`part of the control However
`fields do not include labels
`Text
`you can add one using
`field Including
`static text
`label helps
`field and provides
`means of indicat
`of
`identify the purpose
`text
`ing when the field is disabled Use sentence capitalization
`for mul
`tiple word labels You can also define access keys for the text
`field When using
`provide keyboard access to the text
`static text
`label define keyboard access to move the input
`focus to the text
`with which the label
`is associated
`rather than the static text
`itself You can also support keyboard navigation to text
`using the TAB key and optionally arrow keys
`
`static
`
`tion Static
`
`chapter
`
`to
`
`label
`
`field
`
`field
`
`fields by
`
`text
`
`set of possible val
`field for input of
`field where only numbers are appropriate
`vali-
`
`restricted
`
`When using
`ues for example
`date user input
`immediately either by ignoring inappropriate
`feedback
`the value
`characters or by providing
`valid or both
`
`indicating that
`
`ter
`
`is in
`
`information
`
`For more
`
`about
`see Chap
`validation
`of input
`Secondary Windows
`
`The Windows Interface
`
`Guidelines
`
`for Software Design
`
`157
`
`179
`
`

`

`Chapter
`
`Menus Controls and Toolbars
`
`Text Boxes
`
`is
`
`text box also referred to as an edit control
`rectangular control
`where the user enters or edits text
`as shown in Figure 7.17 It can
`single line or multiple lines of text The
`he defined to support
`outline border of the control
`the border
`is optional
`included when displaying
`the control
`ary window
`
`cally
`
`although
`
`in
`
`toolbar or
`
`is typi
`second
`
`i-Text box border
`
`Figure
`
`7.17
`
`standard text box
`
`input and editing
`text box control provides basic text
`The standard
`support Editing includes the insertion or deletion of characters and
`the option of text wrapping Although individual
`font or paragraph
`properties are not supported
`the entire control
`can support
`
`specific
`
`font setting
`
`editable
`
`You can also use text boxes to display read only text
`is not
`that
`but still selectable When
`this option with the stan
`the background color
`the system automatically
`dard control
`changes
`of the field to indicate to the user the difference in behavior
`
`setting
`
`text box supports standard
`for navigation
`techniques
`and contignous
`selection Horizontal
`is available for single
`scrolling
`line text boxes and horizontal
`and vertical
`scroll bars are supported
`for multiple line text boxes
`
`interactive
`
`as
`
`for
`
`text
`
`You can limit
`the number of characters accepted
`input
`box to whatever
`In addition
`is appropriate for the context
`you can
`support auto exit for text boxes defined for fixed-length
`is
`input
`that
`in the text box the focus moves
`as the last character
`as soon
`is typed
`to the next control For example you can define
`five-character
`or three two
`auto-exit text box to facilitate the entry of zip code
`character auto-exit text boxes to support
`date Use
`the entry of
`auto-exit text boxes sparingly
`the automatic
`prise the user They are best limited to situations
`data entry
`
`shift of focus
`
`involving
`
`can sur
`extensive
`
`158
`
`The Windows Interface
`
`Guidelines
`
`for Software Design
`
`180
`
`

`

`Menus Controls and Toolbars
`
`Chapter
`
`Rich-Text Boxes
`
`rich-text
`
`box as shown in Figure 7.18 provides the same basic text
`text box In addition
`box
`standard
`editing support as
`rich-text
`size color bold and italic
`supports font properties
`such
`typeface
`as
`for each character and paragraph
`format
`such
`format property
`as
`and numbering
`The control also supports
`alignment
`tabs indents
`and embedding of OLE objects
`printing of its content
`
`The Quick Fox
`The quick lox chases
`everyday
`over
`the
`
`rabbit
`
`the
`
`hills
`
`and through the
`woods and streams
`
`Figure 718
`
`rich-text
`
`box
`
`Combo Boxes
`
`control
`
`that combines
`
`text box with
`
`list box as
`in Figure 7.19 This allows the user to type in an entry or
`one from the list
`
`combo box is
`shown
`
`choose
`
`Boxes
`
`ins
`
`Lens
`
`Cabinets
`
`Figure
`
`7.19
`
`combo box
`
`The Windows
`
`Interface
`
`Guidelines
`
`for Software Design
`
`159
`
`181
`
`

`

`Chapter
`
`Menus Controls and Toolbars
`
`The text box and its associated
`list box have
`dependent
`nto the text box the list scrolls
`ship As text
`to the nearest
`is typed
`match In addition when the user selects
`an item in the list box it
`of the text box
`uses that entry to replace the content
`the text
`
`automatically
`and selects
`
`relation
`
`for
`
`The interface for the control
`
`that
`
`the conventions
`follows
`supported
`the UP ARROW and DOWN ARROW
`each component
`except
`keys move only in the list box LEFT ARROW and RIGHT ARROW
`in the text box
`keys operate
`
`solely
`
`Drop-down Combo Boxes
`
`drop-down
`
`eharactcristics
`
`combo box as shown in Figure 7.20
`combines the
`drop down list box
`text box with
`of
`drop-down
`combo box is more compact
`regular combo box it can be used
`to conserve
`space but requires additional user interaction
`required to
`display the list
`
`than
`
`arnade.bnp
`
`arcade
`
`cane
`
`chase
`
`paper
`arcade
`
`Figure
`
`7.2D
`
`drop-down
`
`combo box closed
`
`and opened
`
`state
`
`The closed
`
`state of
`
`drop-down combo box is similar to that of
`the text box is interactive when the user
`drop-down list except
`that
`the controls menu button the list
`is opened Clicking
`clicks
`menu button
`time choosing
`second
`an item in the list or clicking
`another
`control closes the list
`
`the
`
`Provide
`
`field label
`
`for the control and assign an access
`static text
`key Use the access key so the user can navigate
`You
`to the control
`the TAB key or arrow keys for navigation to the
`can also support
`control when the control has the input
`focus when the user presses
`the UP ARROW or DOWN ARROW or ALTUP ARROW or ALTDOWN
`ARROW key the list
`is displayed
`
`160
`
`The Windows
`
`Interface
`
`Guidelines
`
`for Software
`
`Design
`
`182
`
`

`

`Menus Contrnls and Tunibars
`
`Chapter
`
`as
`
`When
`navigation key such
`focus pressing
`the control has the input
`the TAB key or an access key or ALTUP ARROW or ALTDOWN
`ARROW to navigate
`control closes the list When
`to another
`the list
`any selection made while the list was open
`closed
`preserve
`cummand buttun The ESC key
`Cancel
`alsu closes
`the user presses
`the list
`
`is
`
`unless
`
`When
`relationship between
`the interdependent
`the list
`is displayed
`combo boxes
`the text box and list
`is the same as
`it is for standard
`into the text box When
`when the user types text
`the user chooses
`is the same as
`for drop-down lists
`item in the list the interaction
`the entry in the text box
`the selected item becomes
`
`an
`
`Spin Boxes
`
`Spin boxes are text boxes that accept
`that make up
`ordered
`input values
`loop
`text box and
`combination
`of
`special control
`pair of buttons also known as an up-down control
`Figure 7.21
`
`limited set of discrete
`spin box is
`
`circular
`
`that
`
`incorporates
`as shown in
`
`Text box
`
`J.Up-down
`
`control
`
`Figure
`
`7.21
`
`spin box
`
`is
`
`text
`
`When the user clicks
`on the text box or the buttons
`the input
`focus
`The user can type
`to the text box component of the control
`or de
`into the control or use the buttons to increment
`value directly
`the value The unit of change
`depends on what you define
`the control
`
`set
`
`crement
`
`to represent
`
`Use caution when using the control
`in situations where the meaning
`For example with numeric values
`of the buttons may be ambiguous
`it may not be clear whether
`the top button increments
`such
`as dates
`to the previous date Define
`the date or changes
`the top button to
`increase the value by one unit and the bottom button to decrease
`the
`end of the set of
`value by one unit Typically
`wrap around
`at either
`You may need to provide some additional
`values
`communicate how the buttons apply
`
`information
`
`to
`
`The Windows Interface
`
`Guidelines
`
`for Software Design
`
`161
`
`183
`
`

`

`Chapter
`
`Menus Controls and Toolbars
`
`By including
`fining an associated
`
`for the spin box and de
`static text
`field as
`label
`access key you can provide direct keyboard
`You can also support keyboard access using the
`access to the control
`TAB key or optional
`arrow keys Once the control has the input
`change the value by pressing UP ARROW or
`focus the user can
`DOWN ARROW
`
`single set of spin box buttons to edit
`You can also use
`sequence
`in hours min
`of related text boxes for example time as expressed
`utes and seconds The buttons affect only the text box that currently
`focus
`has the input
`
`Static Text Fields
`
`You can use static
`information
`fields to present read-only text
`text
`is not selectable How
`Unlike read-only text box controls
`can still alter read only static text
`ever your application
`in state For example
`you can use static text
`change
`current directory path or the status
`such
`information
`key states or time and date Figure 7.22 illustrates
`
`to reflect
`
`to display the
`as page number
`field
`static text
`
`the text
`
`Static
`
`Test Field
`
`Figure
`
`7.22
`
`static text
`
`field
`
`You can also use static
`
`text
`
`fields to provide labels or descriptive
`for other controls Using static text
`information
`fields as labels
`for
`other controls allows you to provide access key activation for the
`Make certain
`control with which it is associated
`the input
`focus
`that
`control and not to the static field Also re
`moves
`to its associated
`member to include
`at the end of the text Not only does
`colon
`help communicate that
`represents the label
`the text
`also used by screen review utilities
`
`this
`
`for
`
`control
`
`it is
`
`For more
`
`information
`
`about
`
`of static
`
`text fields
`the layout
`see Chapter 13 Visual Design For
`about
`
`information
`
`the use
`
`of
`
`static
`
`text
`
`fields as
`
`labels and
`re
`see Chapter 14 Spe
`view utilities
`cial Design Considerations
`
`screen
`
`162
`
`The Windows
`
`Interface
`
`Guidelines
`
`for Software Design
`
`184
`
`

`

`Shortcut Key Input Controls
`
`Menus Controls and Toolbars
`
`Chapter
`
`key input control also known as
`hot key control
`shortcut
`special kind of text box to support user input of
`key or key combi-
`shortcut key assignment Use it when you pro%ide
`nation to define
`an interface for the user to customize
`by
`shortcut keys
`supported
`command di
`Because
`shortcut keys carry out
`interface for common or fre
`more efficient
`
`your application
`
`rectly they provide
`
`is
`
`For more
`
`information
`
`about
`
`the use of shortcut
`input Basics
`
`Chapter
`
`keys see
`
`quently used actions
`
`The control allows you to define invalid keys or key combinations
`the control will only access valid keys You
`ensure valid user input
`to use when the user enters
`default modifier
`an invalid
`also supply
`key The control displays the valid key or key combination
`any modifier
`keys
`
`including
`
`to
`
`When
`the user clicks
`shortcut key input control
`Like most
`text boxes the control
`to the control
`set
`its own label so use
`field to provide
`static text
`an appropriate access key You can also support
`vide keyboard access to the control
`
`focus is
`
`the input
`does not
`include
`label and assign
`the TAB key to pro
`
`Other General Controls
`
`The system also pros ides support
`for controls designed
`to organize
`other controls and controls for special
`types of interfaces
`
`Group Boxes
`
`group box is
`set of
`special control you can use to organize
`group box is
`frame with an optional
`controls
`rectangular
`as shown
`that surrounds
`set of controls
`in Figure 7.23 Group
`process any input However you can
`boxes generally do not directly
`access to items in the group using the TAB key
`provide navigational
`label
`or by assigning an access key to the group
`
`label
`
`The Windows Interface
`
`Guidelines
`
`for Software
`
`Design
`
`163
`
`185
`
`

`

`Chapter
`
`Menus Controls and Toolbars
`
`Options
`
`Figure
`
`7.23
`
`group box
`
`You can make the label
`group box
`for controls that you place in
`to the group boxs label For example
`labeled Align
`relative
`group
`ment can have option buttons labeled Left Right and Center Use
`sentence capitalization for multiple word label
`
`Column Headings
`
`Using
`
`also known as
`column headitg control
`header
`control
`above columns of text or numbers You
`you can display
`heading
`into two or more parts
`can divide the control
`for
`to provide headings
`as shown in Figure 7.24 The list view control also
`multiple columns
`column heading
`control
`for
`
`provides support
`
`Column
`
`heading
`
`Tpe --
`
`Bitmap
`
`Bitmap
`
`Eitmap
`
`Bitmap
`
`Image
`
`Image
`
`Image
`
`Image
`
`233KB
`
`47Ot9
`
`151KB
`
`151KB
`
`Mudthad
`
`1/23/95
`
`1/23/95
`
`1/17/35
`
`1/17/955
`
`300 PM
`301 PM
`5.05 PM
`Oh PM
`
`111 2.bmp
`
`11.13
`
`hrap
`
`f11 14.beip
`11 1P bmp
`
`--
`
`Column part
`
`Figure
`
`7.24
`
`column heading
`
`divided
`
`into four parts
`
`can include text and
`Each header
`label
`part
`graphic image to show information
`can align the title elements
`right or centered
`
`graphic image Use the
`the sort direction You
`
`such
`
`as
`
`left
`
`You can configure
`
`funt
`
`command button to
`to behave
`each part
`like
`tion when the user clicks
`on it For example
`support
`specific
`the list by clicking on
`consider supporting sorting
`header
`particular
`part Also you can support clicking on the part with button
`commands
`pop up menu containing
`such
`display
`Ascending and Sort Descending
`
`specific
`
`to
`
`as Sort
`
`164
`
`The Windows Interface
`
`Guidelines
`
`for Software Design
`
`186
`
`

`

`Menus Controls and Toolbars
`
`Chapter
`
`The control
`
`on the divisions that
`also supports the user dragging
`the width of each column
`As an option
`separate header
`to set
`parts
`com
`on
`division as
`you can support double-clicking
`shortcut
`mand that applies to formatting
`the column such
`as automatically
`sizing the column to the laigest
`value in that colunm
`
`to
`
`Tabs
`
`file cabinet or notebook
`tab control
`divider in
`is analogous
`to
`as shown
`in Figure 7.25 You can use this control
`to define multiple
`pages or sections of information within the same window
`
`logical
`
`Fori
`
`Ahqrtment
`
`Number
`
`Figure
`
`7.25
`
`tab control
`
`Tab labels
`
`or both Usually
`can include text or graphic information
`the tab to the size of its label how
`the control automatically
`sizes
`fixed width Use the system
`ever you can define your
`tabs to have
`tabs and use the same capitalization
`font
`for the text
`labels of your
`and command buttons
`for multiple word labels
`as you use for menus
`book title capitalization If you use only graph
`in English versions
`tab label support
`tabs
`for your
`
`ics as your
`
`tooltips
`
`By default
`tab control displays only one row of tabs While the
`single row of tabs
`control supports multiple rows or scrolling
`they add complexity
`avoid these alternatives
`because
`to the interface
`by making it harder to read and access
`tab You may
`particular
`want
`to consider alternatives
`such
`as separating the tabbed pages
`into
`to move between the sets However if
`sets and using another
`docu
`the tabs seems appropriate
`follow the conventions
`scrolling
`mented in this guide
`
`control
`
`focus
`
`When
`tab with mouse button
`the input
`the user clicks
`tab When
`and switches
`focus LEFT
`moves
`tab has the input
`to that
`ARROW or RIGHT ARROW keys move between tabs CTRLTAB also
`between tabs Optionally
`switches
`you can also define access keys
`for navigating between tabs If the user switches
`pages using the tab
`focus on the particular
`control on that page If
`you can place the input
`there is no appropriate control or
`field in which to place the tab
`focus on the tab itself
`leave the input
`
`The Windows
`
`Interface
`
`Guidelines
`
`for Software Design
`
`165
`
`187
`
`

`

`Chapter
`
`Menus Controls and Toolbars
`
`Property Sheet Controls
`
`property
`
`sheet control provides the basic framework
`It provides the common controls used
`property sheet
`in
`property
`sheet and accepts modeless
`dialog box layout definitions to auto
`matically create tabbed property pages
`
`for defining
`
`for creating wiz
`The property sheet control also includes support
`ards Wizards are
`form of user assistance that guide
`the user
`special
`operation or process When
`of steps in
`through
`sequence
`specific
`as wizard tabs are not included and the standard
`using the control
`OK Cancel
`Back Next or
`and Apply buttons are replaced with
`Cancel button
`Finish button and
`
`Scroll Bars
`
`For more
`
`information
`
`aboul
`
`sheets
`property
`Secondary Windows
`intormation
`about wizards
`Chapter 12 User Assistance
`
`see Chapter
`For more
`
`see
`
`only for supporting scrolling
`
`to provide an interface
`
`other control
`
`such
`
`as
`
`Scroll bars are horizo ital or vertical
`controls you can use to
`scrolling
`areas other than on the window frame or
`list box
`create scrollable
`where they can be automatically
`included Use scroll bar controls
`contexts For contexts where you want
`or adjusting values use
`slider or
`for setting
`spin box Because
`scroll bars are designed
`scroll bar to set values may confuse
`using
`or interaction of the control
`
`for scrolling
`the user as
`
`information
`to the purpose
`
`follow the recommended
`
`When using scroll bar controls
`conven
`for disabling the scroll bar arrows Disable
`scroll bar arrow
`tions
`button when the user scrolls
`or end
`the information
`to the beginning
`of the data unless the structure
`permits the user to scroll beyond the
`data For more information
`about scroll bar conventions see Chapter
`Windows
`
`While scroll bar controls can support
`focus avoid defining
`the input
`Instead define the keyboard interface of your
`this type of interface
`requiring the user to move
`it can scroll without
`area so that
`scrollable
`scroll bar This makes your scrolling
`interface
`the input
`more consistent with the user interaction
`for window
`and list box
`
`focus
`
`to
`
`scroll bars
`
`166
`
`The Windows
`
`Interface
`
`Guidelines
`
`for Software
`
`Design
`
`188
`
`

`

`Sliders
`
`Menus Controls and Toolbars
`
`Chapter
`
`Use
`
`slider
`
`such
`
`values
`times called
`
`for setting or adjusting values
`range of
`some
`as volume or brightness
`that consists of
`bar that defines the
`trackbar control
`range of the adjustment and an indicator that both shows
`extent or
`the current value for the control and provides the means
`for changing
`the value as shown
`in Figure 7.26
`
`on
`
`continuous
`
`slider
`
`is
`
`control
`
`IIIS
`
`iv
`
`Figure 716
`
`slider
`
`include its own label use
`Because
`slider does not
`static text
`to create one You can also add text and graphics to the control
`and range of the control
`the scale
`help the user interpret
`
`field
`
`to
`
`Sliders
`
`support
`
`number of options You can
`the slider orienta
`set
`define the length and height of the slide
`or horizontal
`tion as vertical
`indicator and the slide bar component
`define the increments
`of the
`slider and whether
`to display tic