Motif and Common Desktop Environment: Style Guide Reference Migration Version

Motif and CDE 2.1 Style Guide Reference

Container (Control)

Reference

Description

A container is a control whose specific purpose is to display objects as icons and allow them to be selected and operated upon.

Figure 9. Container.

View figure.

The objects in a container may be viewed in two ways:

Spatial view

Icons are laid out in two dimensions, possibly with additional layout constraints imposed by the application, and may be positioned (within those constraints) by the user.

Linear view

The icons are laid out linearly from top to bottom, one row per icon. A linear view may have one or both of the following characteristics:

Detailed

A detailed linear view provides additional columns in which various properties or additional data associated with each object may be shown. Each row then also contains the detail elements specific to the object whose icon is shown.

Hierarchical

A hierarchical linear view allows objects that contain other objects (such as directories, folders, or any object that can itself be viewed as a container) to have its subobjects displayed in-line. Each row may also contain a display control button (which cannot take focus) that indicates whether the object's subobjects are displayed or not.

Guidelines

Recommended

When a container is the main control in a view, allow a user to choose a spatial or a linear view through the View menu.

Recommended

When a container is the main control in a view, allow a user to determine which details are displayed in a linear view and the order in which they appear.

Recommended

When a container is the main control in a view, and it contains objects of the same type as the object being viewed (using the container), allow the view to be hierarchical.

Recommended

Provide an Include choice for a view based on a container.

Required

Based on a task analysis, allow a container to either support a single, browse, multiple, or extended selection model.

Required

If you design a container so that the container as a whole can take focus, then the following should occur:

If the container has not had focus previously, initially moving focus to the container places the active cursor only on the container as a whole (not on an element within the container).

If the container previously had focus, moving the focus to the container places the active cursor on the element that was last cursored when the container had focus -- either the container as a whole or an element within the container if it still can be cursored.

When focus is on an element within the container and the user presses Ctrl Home, move the active cursor to the container as a whole. If normal mode is being used, this should deselect all selected objects in the container.

When the user presses V or > and the active cursor is on the container as a whole, move focus to the top-left element within the container that can be cursored. For information on bidirectional and vertical language, see Chapter 11.

Required

When a container as a whole can take focus, the following should occur:

If the user clicks the SELECT button in the background of the container, move the active cursor to the container as a whole. If select mode is used within the container, all objects should be deselected.

If the user clicks Ctrl SELECT in the background of the container, move the active cursor to the container as a whole without affecting the selection state of the objects within the container.

Required

When the container as a whole has focus, a transfer operation whose destination depends upon the focus (for example, Paste) transfers into the object represented by the container as a whole. If the elements being transferred are not objects, the application encapsulates them as objects where this is possible.

Required

Design a container so that the container as a whole can take focus if support for transferring objects to the container is required, unless the user can switch to a spatial view by using a graphics cursor.

Required

In a spatial view, either use an element cursor or a graphics cursor.

Recommended

When displaying a spatial view of a container, provide a choice or choices (for example, Arrange) in the View menu to lay out the objects in the container.

Recommended

When using a spatial view to select multiple elements in a container, support the area and touch selection techniques.

Required

In a linear view, use an element cursor.

Required

In a linear view, when the active cursor is on an object, pressing V (except on the last object) moves it to the object in the row below.

Required

In a linear view, when the active cursor is on an object, pressing ^ (except on the first object) moves it to the object in the row above.

Required

In a linear view that is neither detailed nor hierarchical, pressing > has the same effect as V, and < has the same effect as ^. For bidirectional and vertical language support, see Chapter 11.

Required

In a linear view, to represent an object use a small icon with the text label adjacent to the image if both are present.

Required

In a linear view, do not allow the icon's text label to be cursored separately from the icon image. If you want to allow the user to change the label text, support direct editing techniques, property-editing dialogs, or both.

Required

In a linear view, only the text label or the image of an icon needs to be shown. However, whichever one is present should uniquely identify the object.

Recommended

Provide a Sort choice when displaying a linear view of a container.

Required

Support the range technique when multiple elements can be selected in a container that uses a linear view.

Required

In a linear detailed view, either all detail elements take focus or they all do not take focus. If they do not take focus, and you want to allow the user to change the details, support direct editing techniques, property-editing dialogs, or both. Detail elements are not selectable, even when they can take focus.

Required

When multiple elements in a row of a nonhierarchical linear view can be cursored (because detail elements can take focus in addition to the icon in each row), follow the standard rules for directional navigation; that is, < and > traverse through rows, and ^ and V traverse through columns, with the objects treated as a single column.

Required

In normal mode, if keyboard navigation is used to move focus to a detail element, deselect all objects in the container.

Required

If the user clicks Ctrl SELECT on a detail element in the container that can take focus, move the focus to that element without affecting the selection state of the objects within the container or having any other effect.

Required

If the user clicks SELECT on a detail element in the container that can take focus, move the focus to that element. If select mode is used within the container, all objects are deselected as well.

Required

In a linear hierarchical view, each object that contains subobjects should be displayed with a display control button to its left. The button should contain a value choice that may be toggled between an "expanded" and a "contracted" state and should not take focus.

Required

When an object's display control button is in the contracted state, the subobjects of the object should not be shown; in the contracted state, they should be shown. All of an object's subobjects should be laid out vertically immediately below the object, but indented to the right (only the object column -- not the detail columns). If any subobject itself contains subobjects, it should also be shown with a display control button that indicates whether its subobjects should be displayed. For information on bidirectional and vertical language support, see Chapter 11.

Required

When focus is on an object with a display control button and the user presses Ctrl <, set the button to its expanded state. If the user presses Ctrl >, set the button to its contracted state. For information on bidirectional and vertical language support, see Chapter 11.

Required

If the user clicks the SELECT button on a display control button, toggle its state and move focus to its corresponding object icon.

Required

Toggling a display control button (either with a standard keyboard or mouse) has the following effect:

If the display control button toggles from the contracted to expanded state, the selection state of the objects in the container is unchanged.

If the display control button toggles from the expanded to the contracted state, objects that are no longer displayed are deselected, but the selection state of other objects is unchanged. If the active cursor is on an element that is no longer displayed, move the cursor to the object icon that corresponds to the display control button.

Recommended

In a linear hierarchical view, when the active cursor is on an object, pressing Ctrl ^ moves the cursor upward to the nearest sibling object. If there is no sibling, it moves the cursor to its parent object.

Recommended

In a linear hierarchical view, when the active cursor is on an object, pressing Ctrl V moves the cursor downward to the nearest sibling object. If there is no sibling, it acts as if Ctrl V were pressed with the cursor on its parent object.

Recommended

When a display control button is in its expanded state, it should be shown as a right-pointing arrow; in its contracted state, it should be shown as a down-pointing arrow. For information on bidirectional and vertical language support, see Chapter 11.

Optional

In a linear hierarchical view in which detail elements do not take focus (or without detail elements), when focus is on a subobject, pressing < moves focus to its parent object. For information on bidirectional and vertical language support, see Chapter 11.

Essential Related Topics

For more information, see the Control and Selection reference pages.

Supplemental Related Topics

For more information, see Chapter 4 and the Data Transfer, Icon, Include (Choice and Dialog), Object, Primary Window, Sort (Choice and Dialog), Status Area, and View reference pages.