Skip to main content

floating_toolbar

Function floating_toolbar 

Source
pub fn floating_toolbar() -> FloatingToolbarBuilder
Expand description

§floating_toolbar

Group frequent actions in a rounded horizontal or vertical floating surface.

§Usage

Show contextual editing actions while preserving room for page content.

§Parameters

  • modifier — placement and size constraints for the toolbar.
  • orientation — horizontal by default, or vertical.
  • color_style — standard surface or vibrant primary container colors.
  • container_color, content_color — optional color overrides.
  • elevation — shadow elevation, 6dp by default; override with zero when the background provides enough visual separation.
  • expanded — whether optional leading and trailing actions are visible.
  • leading, trailing — additional actions shown while expanded.
  • content — persistent actions, preferably with 48dp touch targets.
  • accessibility_label — name announced for the toolbar group.

§Examples

use tessera_components::{text::text, toolbar::floating_toolbar};
use tessera_ui::{remember, tessera};

#[tessera]
fn editor_actions() {
    let expanded = remember(|| true);
    floating_toolbar().expanded(expanded.get()).content(|| {
        text("Editing actions");
    });
}