Selection Handles

Selection Handles

Overview of using selection handles for the Tablet PC.

When users select an item, they need visual feedback that distinguishes the selected item from items that they did not select. The appearance of the selected item generally depends on the object and the context in which the selection appears. The visual feedback must appear at the same time that users perform a selection action. For example, change the selection appearance when users tap a graphic object or, as shown in the first figure, the poles (control point) of a Bezier curve. In some cases, smaller graphic objects are easier to tap if you make the hot spot larger than the actual object, as shown in the second figure.

It is best to change the selection appearance only for the active scope, area, or level (window or pane). This helps users to recognize the current selection and its scope. Sometimes, you may need to show both a primary (active) selection and a secondary (inactive) selection. In these cases, you can draw an outline in the selection highlight color around the secondary selection or use some similar variant of the standard selection highlight technique.

Handles provide access to operations for an object, but they can also indicate selection for some kinds of objects. The typical handle is a solid, filled square box that appears on the edge of the object, as shown below.

The handle is hollow when it indicates selection but is not a control point by which users can manipulate the object.

With Tablet PC, handle size is typically based on the default size of the current system settings for resizable window border thickness and on the line thickness in the current system setting for an edge. If users change window border widths or use resolutions such as on high-dpi LCDs running 1024x768, handles are not sized for visibility or ease of tapping. Therefore, use the above recommended sizes. Similarly, base the colors of the handles on system color metrics so that, if users change the default system colors, the color of the handles change appropriately.

When you use a handle to indicate selection, display the handle in the system highlight color. To help distinguish the handle from the variable background, draw a border around the edge of the handle that uses the system setting for highlighted text. For hollow handles, do the opposite: use the selection highlight color for the border and the highlighted text color for the fill color. If you display handles for an object even when it is not selected, display the handles in a different color, such as the window text color, so that users do not confuse it as part of the active selection.