MenuStyle class Null safety

The visual properties that menus have in common.

Menus created by MenuBar and MenuAnchor and their themes have a MenuStyle property which defines the visual properties whose default values are to be overridden. The default values are defined by the individual menu widgets and are typically based on overall theme's ThemeData.colorScheme and ThemeData.textTheme.

All of the MenuStyle properties are null by default.

Many of the MenuStyle properties are MaterialStateProperty objects which resolve to different values depending on the menu's state. For example the Color properties are defined with MaterialStateProperty<Color> and can resolve to different colors depending on if the menu is pressed, hovered, focused, disabled, etc.

These properties can override the default value for just one state or all of them. For example to create a SubmenuButton whose background color is the color scheme’s primary color with 50% opacity, but only when the menu is pressed, one could write:

SubmenuButton(
  menuStyle: MenuStyle(
    backgroundColor: MaterialStateProperty.resolveWith<Color?>(
      (Set<MaterialState> states) {
        if (states.contains(MaterialState.focused)) {
          return Theme.of(context).colorScheme.primary.withOpacity(0.5);
        }
        return null; // Use the component's default.
      },
    ),
  ),
  menuChildren: const <Widget>[ /* ... */ ],
  child: const Text('Fly me to the moon'),
),

In this case the background color for all other menu states would fall back to the SubmenuButton's default values. To unconditionally set the menu's backgroundColor for all states one could write:

const SubmenuButton(
  menuStyle: MenuStyle(
    backgroundColor: MaterialStatePropertyAll<Color>(Colors.green),
  ),
  menuChildren: <Widget>[ /* ... */ ],
  child: Text('Let me play among the stars'),
),

To configure all of the application's menus in the same way, specify the overall theme's menuTheme:

MaterialApp(
  theme: ThemeData(
    menuTheme: const MenuThemeData(
      style: MenuStyle(backgroundColor: MaterialStatePropertyAll<Color>(Colors.red)),
    ),
  ),
  home: const MyAppHome(),
),

See also:

Mixed in types
Annotations

Constructors

Create a MenuStyle.
const

Properties

alignment AlignmentGeometry?
Determines the desired alignment of the submenu when opened relative to the button that opens it.
final
backgroundColor MaterialStateProperty<Color?>?
The menu's background fill color.
final
elevation MaterialStateProperty<double?>?
The elevation of the menu's Material.
final
fixedSize MaterialStateProperty<Size?>?
The menu's size.
final
hashCode int
The hash code for this object.
read-onlyoverride
maximumSize MaterialStateProperty<Size?>?
The maximum size of the menu itself.
final
minimumSize MaterialStateProperty<Size?>?
The minimum size of the menu itself.
final
mouseCursor MaterialStateProperty<MouseCursor?>?
The cursor for a mouse pointer when it enters or is hovering over this menu's InkWell.
final
padding MaterialStateProperty<EdgeInsetsGeometry?>?
The padding between the menu's boundary and its child.
final
runtimeType Type
A representation of the runtime type of the object.
read-onlyinherited
shadowColor MaterialStateProperty<Color?>?
The shadow color of the menu's Material.
final
shape MaterialStateProperty<OutlinedBorder?>?
The shape of the menu's underlying Material.
final
side MaterialStateProperty<BorderSide?>?
The color and weight of the menu's outline.
final
surfaceTintColor MaterialStateProperty<Color?>?
The surface tint color of the menu's Material.
final
visualDensity VisualDensity?
Defines how compact the menu's layout will be.
final

Methods

copyWith({MaterialStateProperty<Color?>? backgroundColor, MaterialStateProperty<Color?>? shadowColor, MaterialStateProperty<Color?>? surfaceTintColor, MaterialStateProperty<double?>? elevation, MaterialStateProperty<EdgeInsetsGeometry?>? padding, MaterialStateProperty<Size?>? minimumSize, MaterialStateProperty<Size?>? fixedSize, MaterialStateProperty<Size?>? maximumSize, MaterialStateProperty<BorderSide?>? side, MaterialStateProperty<OutlinedBorder?>? shape, MaterialStateProperty<MouseCursor?>? mouseCursor, VisualDensity? visualDensity, AlignmentGeometry? alignment}) MenuStyle
Returns a copy of this MenuStyle with the given fields replaced with the new values.
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
override
merge(MenuStyle? style) MenuStyle
Returns a copy of this MenuStyle where the non-null fields in style have replaced the corresponding null fields in this MenuStyle.
noSuchMethod(Invocation invocation) → dynamic
Invoked when a non-existent 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
toStringShort() String
A brief description of this object, usually just the runtimeType and the hashCode.
inherited

Operators

operator ==(Object other) bool
The equality operator.
override

Static Methods

lerp(MenuStyle? a, MenuStyle? b, double t) MenuStyle?
Linearly interpolate between two MenuStyles.