CNToolbar class

The Apple toolbar: at the top of the window on macOS, at the bottom of the screen on iPhone and iPad.

• macOS (every supported version): while the widget is mounted, the window gets an NSToolbar with these items, in the style chosen, and the window title shows title and subtitle. The widget itself takes no space: put it anywhere in the page. The window keeps its frame, so the Flutter content is resized to the area under the toolbar. When the widget is removed, or its route is covered by another page, the window gets back the toolbar, title and appearance it had. Of several mounted toolbars the most recently shown one owns the window.
• iOS 26+: a UIToolbar drawn where the widget is laid out, 44 points high (typically the bottom of a page, inside its safe area), with Liquid Glass and items grouped on shared glass backgrounds. CNToolbarSearch and the sidebar and inspector items have no iOS toolbar counterpart and are left out.
• iOS below 26 and other platforms: a toolbar drawn in Flutter.

Changes to the items update the native items in place; give items an CNToolbarItem.id to keep them when others are added or removed.

CNToolbar(
  title: 'Inbox',
  subtitle: '3 unread',
  items: [
    CNToolbarButton(
      label: 'New Message',
      icon: const CNSymbol('square.and.pencil'),
      style: CNToolbarItemStyle.prominent,
      onPressed: compose,
    ),
    const CNToolbarSpace.flexible(),
    CNToolbarSearch(onChanged: filter),
  ],
)

VoiceOver reads each item's label; on macOS the items are also reached with Full Keyboard Access.

Inheritance

• Object
• DiagnosticableTree
• Widget
• StatefulWidget
• CNToolbar

Available extensions

• LiquidGlassExtension

Constructors

CNToolbar({Key? key, required List<CNToolbarItem> items, String? title, String? subtitle, bool showsTitle = true, CNToolbarStyle style = CNToolbarStyle.unified, Color? tint, bool autoHideOnModal = true})

Creates a toolbar.

const

Properties

autoHideOnModal → bool

When true (default), the iOS toolbar is replaced with an empty box of the same size while a modal sheet covers it (Issue #53). Requires CNTabBarRouteObserver() in the app's navigatorObservers.

final

hashCode → int

The hash code for this object.

no setter, inherited

items → List<CNToolbarItem>

The items, from the leading edge to the trailing one.

final

key → Key?

Controls how one widget replaces another widget in the tree.

final, inherited

runtimeType → Type

A representation of the runtime type of the object.

no setter, inherited

showsTitle → bool

Whether the window title is shown in the toolbar (macOS).

final

style → CNToolbarStyle

The layout of the window toolbar (macOS).

final

subtitle → String?

A second line under the title (macOS 11+), such as a count.

final

tint → Color?

Colour of the items' icons and titles (iOS).

final

title → String?

The window title while the toolbar is shown (macOS). Null keeps the window's own title.

final

Methods

createElement() → StatefulElement

Creates a StatefulElement to manage this widget's location in the tree.

inherited

createState() → State<CNToolbar>

Creates the mutable state for this widget at a given location in the tree.

override

debugDescribeChildren() → List<DiagnosticsNode>

Returns a list of DiagnosticsNode objects describing this node's children.

inherited

debugFillProperties(DiagnosticPropertiesBuilder properties) → void

Add additional properties associated with the node.

inherited

liquidGlass({CNGlassEffect effect = CNGlassEffect.regular, CNGlassEffectShape shape = CNGlassEffectShape.capsule, double? cornerRadius, Color? tint, bool interactive = false}) → Widget

Available on Widget, provided by the LiquidGlassExtension extension

Applies a Liquid Glass effect to this widget.

noSuchMethod(Invocation invocation) → dynamic

Invoked when a nonexistent method or property is accessed.

inherited

toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode

Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.

inherited

toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String

A string representation of this object.

inherited

toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) → String

Returns a string representation of this node and its descendants.

inherited

toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String

Returns a one-line detailed description of the object.

inherited

toStringShort() → String

A short, textual description of this widget.

inherited

Operators

operator ==(Object other) → bool

The equality operator.

inherited