Plasma/Active/Development/ActiveHIG/SelectionDialog: Difference between revisions

From KDE Community Wiki
(Added distinction from ComboBox and ListView)
 
Line 3: Line 3:
== Purpose of the Widget ==
== Purpose of the Widget ==


The Selection Dialog is used when users have to select ''one'' element out of more than five - or an unknown number of - items, i.e. cases where traditionally comboboxes (or HTML <select> elements) are used.
The Selection Dialog is used when users have to select ''one'' element out of a number of items that would not fit into the drop-down of a [[../ComboBox | ComboBox]] and there is not enough space to show them in a [[../ListView | ListView ]]. It has the advantages of being able to use the complete vertical space to present a list and offering a filter.


== Description of the Widget ==
== Description of the Widget ==

Latest revision as of 16:41, 16 August 2013

Guideline for the widget "Selection Dialog"

Purpose of the Widget

The Selection Dialog is used when users have to select one element out of a number of items that would not fit into the drop-down of a ComboBox and there is not enough space to show them in a ListView . It has the advantages of being able to use the complete vertical space to present a list and offering a filter.

Description of the Widget

The dialog is called by pressing a button. This button is labeled "Select (a/an) [item type]" (e.g. "Select timezone") if no item is selected and is labeled with the item name if an item is selected. The dialog is centered on the screen, with height and width to fit its content, and consists of the following elements:

  • A title: "Select (a/an) [item type]" if no item is selected, and "[item type]: [selected item]" if one was selected before the dialog is opened
  • A search field which instantly filters the list of items
  • A finger-scrollable list of items

The dialog has no close button.

  • If the user taps outside of the dialog, the dialog is closed and the selection remains unchanged
  • When the user taps an item in the list, the dialog is closed and the item is selected.
  • If the dialog loses focus by other means, it is closed as well


TODO: Insert screenshot

Code to Implement the Widget

TODO: Insert code