* If activating a choice affects the appearance or the enabled state of other controls, place them next to the drop down.

* If activating a choice affects the appearance or the enabled state of other controls, place them next to the drop down.

* If certain controls in a configuration dialog are only relevant if a certain item is selected (i.e. they are dependent controls), disable them instead of hiding.

* If certain controls in a configuration dialog are only relevant if a certain item is selected (i.e. they are dependent controls), disable them instead of hiding.

−

* Label the drop down with a descriptive caption to the left (cf. [[Projects/Usability/HIG/Form_Label_Alignment| alignment]]).

+

* Label the drop down with a descriptive caption to the left (cf. [[Projects/Usability/HIG/Alignment| alignment]]).

* Create a buddy relation so access keys are assigned.

* Create a buddy relation so access keys are assigned.

* Do not use ending punctuation (neither dot nor colon) for caption.

* Do not use ending punctuation (neither dot nor colon) for caption.

Revision as of 13:21, 31 July 2013

Purpose

A drop-down list is a GUI control which allows the user to choose one value from a list. When a drop-down list is inactive, it displays a single value. When activated, it displays (drops down) a list of values, from which the user may select one. When the user selects a new value, the control reverts to its inactive state, displaying the selected value. A drop-down list works similar to a list box but hides the complete list until the user initiate the drop down. The disadvantage of drop-down lists compared to related controls like radio buttons or lists is that the options are not visible without further interaction.

The list provides auto-complete feature for the whole string, independently of the "editable" property. Given the items of "bike", "boat", and "car":

If one types "b", the list selects "bike".

If one (rapidly) types "bo", it selects "boat".

If one types "c", it selects "car".

One can repeatedly type a letter to cycle through items of the (read-only) drop-down list starting with this letter.

Guidelines

Is this the right control

Use a drop-down list for single selection of one out of many items. If users should be able to add items use a combo box.

Make sure the items are easily accessible via keyboard by moving distinctive letters to the beginning of each option. For example, in a list of countries on continents, write "Germany (Europe)" instead of "Europe/Germany".

Do not have blank list items; use meta-options, e.g. (None) instead

Appearance

If activating a choice affects the appearance or the enabled state of other controls, place them next to the drop down.

If certain controls in a configuration dialog are only relevant if a certain item is selected (i.e. they are dependent controls), disable them instead of hiding.

Label the drop down with a descriptive caption to the left (cf. alignment).