Seek bar

This article is in need of a technical review.

Seek bars have a draggable thumb the user can touch and drag back and forth to scroll through content (such as to set playback position in a media file) or to set a new value for a given control, such as sound volume or display brightness.

See the Coding guide for information on how to implement seek bars in your apps.

Characteristics

  • A seek bar consists of a track with a knob that indicates the current playback position.
  • The knob has both normal and "pressed" states.
  • The values for the ends of the seek bar can be specified as either text or images.
  • Seek bars may be oriented either horizontally or vertically.

Visuals

Thumb states

Here you see the appearance of the seek bar for both horizontal and vertical seek bars, with the thumb pressed or not pressed.

  Horizontal Vertical
Normal image coming soon
While dragging image coming soon

Seek bars with images as labels

You can use images as the labels at the ends of a seek bar. Here's an example from the Display preferences:

Interaction

See also

Attachments

File Size Date Attached by
seekbar: horizontal - dragging
2886 bytes 2013-02-24 11:30:16 Sheppy
seekbar: horizontal - normal
2255 bytes 2013-02-24 11:30:24 Sheppy
seekbar: sample
87826 bytes 2013-02-24 11:36:33 Sheppy

Document Tags and Contributors

Contributors to this page: Sheppy, chrisdavidmills, kscarfone
Last updated by: chrisdavidmills,