Projects/Usability/HIG/ListView

< Projects‎ | Usability‎ | HIG
Revision as of 13:37, 21 June 2013 by Htietze (Talk | contribs) (Purpose)

Jump to: navigation, search


Purpose

A list view is basically used to show some items. It offers orientation thereby and allows navigation without the need of other controls. Additionally, a list view may be used for single selection (users select one item from a list of mutually exclusive values) or multiple selection (selections in combination with the Shift key or Control key). However, because there is no common visual clue whether a list box’ mode is single or multiple and since other controls are more efficient for single selection, a list box should be used for single selection only. HT: Recommendation should be checked

Guidelines

  • Use a list box for multiple selections with more than five options.
  • Do not have blank list items; use meta-options, e.g. (None) instead.
  • Place options that represent general options (e.g. All, None) at the beginning of the list.
  • Provide extended multiple selection with Shift+Click or Ctrl+Click to select groups of contiguous or non-adjacent values, respectively.
  • Sort list items in a logical order. Make sure sorting fits translation.

DE:

 QListView / QListWidget
 http://static.davidedmundson.co.uk/hig/widgets/QListView.png
 This can be single selection or multiple item selection
 This can be checkable or based on selected items.
 http://static.davidedmundson.co.uk/hig/widgets/QListView2.png
 This can also be in a tree with a QTreeView
 These can be more fancy (i.e Dolphin)
 QComboBox
 http://static.davidedmundson.co.uk/hig/widgets/QComboBox.png
 KComboBox is exactly the same but with optional auto-completion
 KEditListWidget
 http://static.davidedmundson.co.uk/hig/widgets/KEditListWidget.png
 KActionSelector
 http://static.davidedmundson.co.uk/hig/widgets/KActionSelector.png

HT: Todo: Add Check box feature

TP:

  • Use the check box list if it is easy for users to know which items are checked at any given time, for one or more of these reasons:
    • There are no more than twice the number of options then are visible at a time
    • The options are well-known (for example months of a year or days of a week)
    • Usually the selected options are close to each other in the list
  • In any other case, use the dual-list pattern because it allows users to easily see which items are selected at any point, without having to scroll through the available options

Code snippets


Content is available under Creative Commons License SA 4.0 unless otherwise noted.