The editor UI
This page explains what the editor shows, and how your app supplies what only it can: media, fonts, colours and text.
Preview and controls
| Part | What users do with it |
|---|---|
| Preview | Watch the video; tap a layer to select it; drag, pinch or use its handles to move, resize and rotate it. |
| Controls | A transport row (time, undo and redo, play, keyframe), the timeline, a bar of tools, and the panels those tools open. |
The tool bar follows the selection: with a video selected it offers speed, volume, transform, effects and more; with text, its content, font, style and animation.
You can show both parts, the timeline alone (without the transport row and tool bar), or just the preview with controls of your own built on the editing API.
On phones the timeline keeps the playhead in the middle and the video scrolls under it. On the web, wide layouts use a desktop timeline: a free playhead, and clips you drag with the mouse.
Your pickers
The editor never browses the user's files or shows a media library of its own. When it needs media, a font, a colour or text, it asks your app, which returns the answer from its own picker. See Pickers.
Customising
Theme, tools, icons, pickers, wording, fonts and layouts: see Customisation.
Selection
The selection is shared: selecting a clip in the timeline selects its layer in the preview, and the other way round. Your code can read it, change it and be told when it changes.