[kde-guidelines] Styleguide: Inline editing
Heiko Tietze
heiko.tietze at user-prompt.com
Thu Jul 4 10:41:10 UTC 2013
Unconstrained input
* For complex views with direct input provide inline editing.
http://techbase.kde.org/Projects/Usability/HIG/inline_editing
Purpose
Inline editing is a feature of some controls. For example, list views are
controls that can be used for editing purpose as well. When the user accesses
an editable cell, usually by clicking the cell, its behavior (and appearance)
is changed from viewing mode to an editing control. The input control can be
applied as an unconstrained edit or as constrained input, e.g. selection from
a predefined set using a drop-down list. The advance of direct input is a
concise layout since no additional control is needed for input. The approach
is usually less error-prone because a list with direct input has no dependency
to other controls (in contrast to the combination of a list with an edit which
needs to be enabled or disabled appropriate to the list entry the user
clicks). The drawback is reduced discoverability for lists with restricted
editing function, at least when only a few cells can be changed. User does not
know which cell is editable and which is not. Furthermore, native access via
tab or access key is not available within a list which means keyboard
navigation needs to be implemented.
Guidelines
* Switch from viewing mode to edit mode after single click on the editable
cell.
* Change appearance of cells when switching from viewing to editing. Editable
cells have a lowered bevel; they look like they can be filled.
* Mark currently changed cells with a red corner.
* Define keyboard navigation within the list since the control receives focus
as a whole. By pressing arrow-down key the next row is focused; respectively
arrow-up for previous row. The arrow-left or arrow-right key navigates to
adjacent columns if available.
* Use the appropriate control for constrained input. Show the control’s UI
(e.g. arrow for drop-down list) not until the cell is in edit mode.
* Distinguish editable cells from those that are read-only.
More information about the kde-guidelines
mailing list