Components / Tabs

Tabs

Tab bar with one content view per tab.

Example

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

Code

use ravenrs::prelude::*;

fn tabs() -> impl View {
    let tab = State::new(0);
    Tabs::new(tab.binding())
        .tab("Activity", Text::new("Ana merged #482").foreground(Semantic::InkMuted))
        .tab("Settings", Text::new("Each tab builds when selected.").foreground(Semantic::InkMuted))
        .tab("Billing", Stat::new("Next invoice", "R$ 1.240"))
        // `TabsVariant::Segmented` makes it a track, `.item` a tab without content.
        .variant(TabsVariant::Underline)
}

Open in the playground, with every example →

Full API of Tabs →