Skip to content

Toolbar

Groups actions and inputs under one roving-focus keyboard model.

Loading interactive demo…

#Import

Import Toolbar from quickgui.

use quickgui::*;

#Usage

let bar = Toolbar::new("main", &state, &items);
bar.root().flex_row().gap(8.0)

#Anatomy

  • Toolbar::root
  • Toolbar::item
  • Toolbar::button
  • Toolbar::link
  • Toolbar::input
  • Toolbar::group
  • Toolbar::separator

#API reference

Expand an entry for its description and complete signature. A dash means no declaration default is documented.

pub fn new( root_id: impl Into<ElementId>, state: &ToolbarState, items: &'a [ToolbarItem], ) -> Self

Create a toolbar over the caller's ordered items. # Panics Panics with more than [`MAX_TOOLBAR_ITEMS`] items or duplicate item values.

orientationpub const fn orientation(mut self, orientation: ToolbarOrientation) -> Self—

Configures orientation for this part.

pub const fn orientation(mut self, orientation: ToolbarOrientation) -> Self
View source
verticalpub const fn vertical(self) -> Self—

Configures vertical for this part.

pub const fn vertical(self) -> Self
View source
loop_focuspub const fn loop_focus(mut self, loop_focus: bool) -> Self—

Wrap from the last item to the first. The default is `true`.

pub const fn loop_focus(mut self, loop_focus: bool) -> Self
View source
root_idpub const fn root_id(self) -> ElementId—

Configures root id for this part.

pub const fn root_id(self) -> ElementId
View source
itemspub const fn items(self) -> &'a [ToolbarItem]—

Configures items for this part.

pub const fn items(self) -> &'a [ToolbarItem]
View source
axispub const fn axis(self) -> ToolbarOrientation—

Configures axis for this part.

pub const fn axis(self) -> ToolbarOrientation
View source
item_idpub fn item_id(self, value: impl Into<ElementId>) -> ElementId—

Configures item id for this part.

pub fn item_id(self, value: impl Into<ElementId>) -> ElementId
View source
roving_valuepub fn roving_value(self) -> Option<ElementId>—

The item that currently owns the toolbar's single Tab stop. This is the controlled active value while it names an enabled mounted item, and otherwise the first enabled item, matching the composite-widget convention.

pub fn roving_value(self) -> Option<ElementId>
View source
itempub fn item(self, value: impl Into<ElementId>) -> Option<ToolbarEntry<'a>>—

Describe one declared item.

pub fn item(self, value: impl Into<ElementId>) -> Option<ToolbarEntry<'a>>
View source

Toolbar::root_with

View source
pub fn root_with(self, root: Element) -> Element

Decorate an application-owned toolbar root without adding layout or appearance.

Toolbar::root

View source
pub fn root(self) -> Element

Create the unstyled root part. Use [`Self::root_with`] to supply an existing element.

Toolbar::group_with

View source
pub fn group_with(self, group: Element) -> Element

Decorate a caller-owned group of related toolbar items, Base UI's Toolbar.Group. The group is a labelling and structural unit only: every item inside it keeps taking part in the toolbar's single roving Tab stop, so grouping never creates a second focus scope.

Toolbar::group

View source
pub fn group(self) -> Element

Create the unstyled group part. Use [`Self::group_with`] to supply an existing element.

Toolbar::separator_with

View source
pub fn separator_with(self, separator: Element) -> Element

Decorate a caller-owned divider between toolbar groups, Base UI's Toolbar.Separator. A separator carries the Separator role across the toolbar's cross axis and never takes focus, so arrow navigation steps straight past it.

Toolbar::separator

View source
pub fn separator(self) -> Element

Create the unstyled separator part. Use [`Self::separator_with`] to supply an existing element.