Skip to content

TabBar

import { TabBar } from "@material";
export component Example inherits Window {
width: 400px;
height: 100px;
background: transparent;
TabBar {
width: parent.width;
items: [
{ icon: @image-url("../icons/share.svg"), text: "Home" },
{ icon: @image-url("../icons/search.svg"), text: "Search" },
{ icon: @image-url("../icons/settings.svg"), text: "Settings" }
];
}
}
slint

A TabBar displays a row of tabs for navigation between different views or content sections.

int (in-out) default: 0

The index of the currently selected tab.

[struct] default: a struct with all default values

An array of tab items to display in the bar.

Invoked when the current-index changes.


© 2026 SixtyFPS GmbH