Components / Popover

Popover

Floating content anchored below a view.

Example

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

Code

use ravenrs::prelude::*;

fn popover() -> impl View {
    let open = State::new(false);
    let flip = open.clone();
    Popover::new(
        open.binding(),
        Button::new("Show details").style(ButtonStyle::Secondary).on_click(move || flip.update(|o| *o = !*o)),
        VStack::new((Text::new("Storage").style(TextStyle::Headline), ProgressBar::new(0.62)))
            .spacing(8.0)
            .width(220.0),
    )
    // `Placement::Above` and the others work too; `.surface(false)` drops the panel.
    .placement(Placement::Below)
}

Open in the playground, with every example →

Full API of Popover →