Menubar
Coordinate horizontal application menus with arrow-key movement and cascading items.
Coordinate horizontal application menus with arrow-key movement and cascading items.
Contract
| Axis | Contract |
|---|---|
| Composition | TRMenubar lays out ordered TRMenubarMenu entries horizontally. Each entry owns one trigger and one popup child list. |
| Keyboard | Material menu traversal coordinates arrow keys across top-level triggers and nested submenus. Escape closes the active cascade. |
| Availability | Set enabled: false on one TRMenubarMenu to remove its commands without disabling sibling menus. |
| Nested layers | Place TRMenuSubmenu entries inside menuChildren; each nested popup keeps its own bordered layer surface. |
Give the menubar a semanticLabel that names the command group. Menubar and active triggers are borderless; popup layers retain their border, while focused items use a background highlight without changing border geometry.
Install
Add the package, then import its public library.
flutter pub add tinyrack_uiimport 'package:tinyrack_ui/tinyrack_ui.dart';Playground
Usage
import 'package:material_ui/material_ui.dart';
import 'package:tinyrack_ui/tinyrack_ui.dart';
TRMenubar(
semanticLabel: 'Application menu',
menus: [
TRMenubarMenu(
trigger: const Text('File'),
menuChildren: [
TRMenuItem(onPressed: createRack, child: const Text('New rack')),
TRMenuItem(onPressed: openRack, child: const Text('Open')),
],
),
],
)Examples
API
TRMenubar properties
| Prop | Type / default | Purpose |
|---|---|---|
menus | List<TRMenubarMenu> · required | Defines the ordered top-level menus. |
semanticLabel | String? · null | Names the application command group for assistive technology. |
uiSize | TRUiSize · TRUiSize.md | Sets the control size every menu in this bar resolves by default. Use TRUiSize.sm for dense application chrome such as a title bar. |
TRMenubarMenu properties
| Prop | Type / default | Purpose |
|---|---|---|
trigger | Widget · required | Renders the top-level menu label. |
menuChildren | List<Widget> · required | Provides commands, settings, separators, and nested submenus for the popup. |
enabled | bool · true | Controls whether the trigger can open its menu. |
controller | MenuController? · null | Lets the parent open, close, or inspect this menu. |
focusNode | FocusNode? · null | Lets the parent coordinate focus for the top-level trigger. |
onOpen / onClose | VoidCallback? · null | Reports this menu opening and closing. |
uiSize | TRUiSize? · null | Overrides the size the enclosing bar resolves for this trigger. Leave it unset so the bar keeps one size across its menus. |