GtkStack

Preview

CSS Node Tree

stack
  └── <page child> (one per page)

stackswitcher.linked[.horizontal|.vertical]
  └── button.toggle[.text-button|.image-button][.needs-attention][:checked] (per page)
      └── label | image

Props

GtkStackPage

GtkStackSwitcher

Behavior

• Use GtkStackPage children to declare each page with a name. Every page stays mounted, so the state inside a hidden page (an entry's text, a toggle) is kept.
• A homogeneous stack (the default) is as large as its largest page. With hhomogeneous or vhomogeneous off, it follows the visible page along that axis.
• transitionType animates page changes: crossfade, slides, over-*, under-* and rotate-*, as in GTK. The *-left-right and *-up-down types take their direction from the order of the pages. Nothing is animated when the user prefers reduced motion.
• When the focus is inside the page being hidden, it moves to the new page: to the widget last focused there, or else its first focusable widget.
• Pair with GtkStackSwitcher for a tab bar: pass it the same pages, the visible page as activePageName, and switch pages in onPageChanged. A page with an iconName gets an icon tab with its title as the tooltip, and a page with neither a title nor an icon gets no tab. The tabs share the switcher's width and don't take the focus when clicked.

GTK4 Documentation →