Skip to main content
Go to Editor

Viewer: Timeline

viewertimelineanimationplaybackguide

The Timeline panel is a dockable animation sequencer at the bottom of the Viewer. It lets you arrange animation clips on multiple tracks, control playback, and preview transitions.

Tracks & Clips

  • Up to 4 animation tracks — each track maps to a Spine trackIndex layer. Higher tracks blend on top of lower ones.
  • Add animation — click the + button on any track to open the animation picker (with search filter).
  • Drag & resize clips — drag the clip body to move it along the track; drag left/right edges to change start time or duration.
  • Delete clips — select a clip and press Delete or Backspace.
  • Overlap detection — overlapping clips on the same track are highlighted in red.

Transport Controls

  • Play / Pause / Stop — standard playback controls.
  • Previous / Next — jump to the start of the previous or next clip.
  • Animation speed — slider from 0.1× to 3.0×.
  • Auto-stop — playback stops automatically at the end of the timeline.

Transition Mixing

  • Global mix duration — sets the default crossfade time between consecutive clips.
  • Per-transition overrides — click the transition bubble between two clips to set a custom mix duration. You can reset individual overrides back to the global value.

Seeking & Scrubbing

  • Playhead — drag the handle on the time ruler or click the ruler to seek.
  • Cursor time preview — hovering over the track area displays the time under the cursor.
  • Web Worker — seek and event computation is offloaded to a background worker for smooth performance.

Physics-Aware Playback

  • Toggle physics between Update (active constraints) and None (disabled).
  • During seek, the skeleton time is advanced to properly settle physics constraints.

Multi-Skeleton Support

  • Target pair selector — each track can target all pairs (🌐 All pairs) or a specific skeleton.
  • Per-skeleton position and scale — X/Y offset and scale inputs for individual skeletons.
  • Draw order — numeric input to control render layer priority.

Debug Draw

Toggle visibility for: Bones, Bone Names, Regions, Meshes, Hulls, Bounds, Paths, Clipping, Points.

Skin Selection

Multi-select checkboxes for all skins defined in the loaded skeleton.

View Settings

  • Spacing X / Y — gap between skeleton pairs.
  • Offset X / Y — global viewport shift.
  • PMA toggle — premultiplied alpha mode (Spine 3.x) or atlas alpha mode (Spine 4.x: auto / pma / bleed / none).
  • Skeleton labels — toggle label overlay.