Components / Timeline

Timeline

Blocks along time on named tracks.

Example

The component itself, running in WebAssembly, beside its code in a playground. Try it.

Code

use ravenrs::prelude::*;

fn timeline() -> impl View {
    Timeline::new(vec![
        TimelineTrack::new(
            "Notes",
            34.0,
            vec![TimelineItem::new(1, 2_000, 3_000, "Callout").selected(true).movable()],
        ),
        TimelineTrack::new(
            "Screen",
            34.0,
            vec![TimelineItem::new(2, 6_000, 4_000, "Zoom").tone(Tone::Success)],
        ),
        TimelineTrack::new(
            "Film",
            44.0,
            vec![TimelineItem::new(3, 0, 14_000, "Take 1").tone(Tone::Accent).trimmable()],
        ),
    ])
    .markers(vec![TimelineMarker { at_ms: 6_000, title: "Chapter two".to_owned() }])
    .position_ms(4_000)
}

Open in the playground, with every example →

Full API of Timeline →