Toolbar

In plain words

A thin bar with the actions of what you are looking at.

The bar below the tabs of a code editor: widgets at the start (usually breadcrumbs) and at the end (buffer actions).

ui.toolbar · Category: Navigation · Full reference →

Preview

Code

ui.toolbar(
    [ui.breadcrumbs([("file-code", "src"), "main.rs", "fn main"])],
    [ui.icon_button("search", on_search, size="sm"), ui.icon_button("sparkles", on_assist, size="sm")],
)

When to use

• Between the tab bar and the editor, or at the top of any content view.

Usage

from pyzed import ui

ui.toolbar(
    [ui.breadcrumbs([("file-code", "src"), "main.rs", "fn main"])],
    [ui.icon_button("search", on_search, size="sm"), ui.icon_button("sparkles", on_assist, size="sm")],
)

Variants

About these captures

Each capture is recorded by pyzed itself, off-screen at 2x, in One Dark or One Light to match this site’s theme, and cropped to the component so it shows at its real size. The pointer hovers, presses or types into it; a component that does not react to the pointer cycles through a few themes. With reduced motion you see the first frame. Open Code under a capture to see the snippet that draws it; free names such as on_save stand for your own callbacks.

Content

Start only

Code

pz.container(ui.toolbar([ui.breadcrumbs(["src", "main.rs"])]), width=400)

End only

Code

pz.container(ui.toolbar([], [ui.icon_button("search", on_search, size="sm"),
                            ui.icon_button("sparkles", on_assist, size="sm")]), width=400)

height=40

Code

pz.container(ui.toolbar([ui.label("Preview")], [ui.button("Publish", on_publish, size="sm", variant="solid")],
                        height=40), width=400)

States and events

center=

Code

pz.container(ui.toolbar([ui.breadcrumbs(["src", "app.py"])], [ui.icon_button("play", on_press)],
                        center=ui.muted("Running…", size="sm")), width=440)

Events

Toolbar has no events of its own: it shows what you give it. Like every widget it also has the 18 common events (click, double_click, right_click, mouse_enter, drag, key_down, resize…), attached with .on(...): see Events and Events of every component.

Properties and API

ui.toolbar

toolbar(start=(), end=(), *, center=None, height=32, theme=None)

The bar below the tabs: breadcrumbs on the left and buffer actions on the right.

Property	Default	Description
start	()	Widgets at the start (left).
end	()	Widgets at the end (right).
center	None	Kept in the middle of the bar whatever the widths of both sides.
height	32	Height.
theme	None	Theme to use instead of the current one (pyzed.theme.current()).

Full reference →

Related

Tab barEditor tabs with icons, dirty dots and close buttons.

Breadcrumbs`src › main.rs › fn main`, optionally clickable.

Icon buttonA square button with just an icon and an optional tooltip.