Skip to content
HuxerUIHuxerUIHuxerUI

TopAppBar

TopAppBar is a navigation layout with one title, an optional leading view, and zero or more trailing actions.

TopAppBar(
    "Inbox",
    IconButton(images::menu, "Open navigation").OnClick(OpenDrawer),
    {
      IconButton(images::search, "Search"),
      IconButton(images::more, "More actions"),
    }
)

The title accepts StringVariant, so literals, owned strings, string views, and StringResource values are supported. The second argument is std::optional<View> and the action collection may be a std::vector<View> or initializer list.

Use .TitleAlignment(TopAppBarTitleAlignment::Start) or Center to choose title placement. Common modifiers still apply to the resulting view.

Theme definitions supply TopAppBarStyle, including height, padding, title typography, background, and spacing. The leading and action views retain their own interaction and accessibility semantics; give icon-only actions meaningful labels.

Resource-backed title and actions

Section titled “Resource-backed title and actions”
View InboxBar() {
  return TopAppBar(
      strings::inbox,
      IconButton(images::menu, strings::open_navigation),
      {IconButton(images::search, strings::search)}
  ).TitleAlignment(TopAppBarTitleAlignment::Start);
}

API

Section titled “API”
  • TopAppBar(StringVariant title, std::optional<View> leading = std::nullopt, std::vector<View> actions = {}).
  • Initializer-list overload for actions.
  • TitleAlignment(TopAppBarTitleAlignment).
  • TopAppBarStyle and TopAppBarTitleAlignment define themed presentation.

See also NavigationBar and WindowTitleBar.

Layout, safe area, and actions

Section titled “Layout, safe area, and actions”

Declared in <huxerui/navigation.h>. Pass std::nullopt as the leading view when supplying only trailing actions. Action views are ordinary children: each needs its own handler and enabled state. The app bar does not infer that a menu icon opens a DrawerLayout, or that a back icon pops a NavigationStack.

TopAppBarStyle::height is the bar’s content height. horizontal_padding insets the bar contents; title_inset supplies the title inset, title_spacing separates it from neighboring content, and action_spacing separates trailing actions. background and title_style control the surface and title. These fields do not replace the styles of child IconButtons.

TitleAlignment defaults to Start; Center changes the title’s layout while the leading and action slots remain at their edges. Use a concise title and a bounded action set on narrow screens. This is not a scroll-collapsing large app bar.

On mobile, keep system insets separate from the app bar’s intrinsic height. Do not add a fixed top padding to compensate for status bars; use the window/safe-area contract. On desktop, use WindowTitleBar when the region must participate in window dragging and caption controls.