PopupMenuButton<T> class

Displays a menu when pressed and calls onSelected when the menu is dismissed because an item was selected. The value passed to onSelected is the value of the selected menu item.

One of child or icon may be provided, but not both. If icon is provided, then PopupMenuButton behaves like an IconButton.

If both are null, then a standard overflow icon is created (depending on the platform).

Updating to MenuAnchor

There is a Material 3 component, MenuAnchor that is preferred for applications that are configured for Material 3 (see ThemeData.useMaterial3). The MenuAnchor widget's visuals are a little bit different, see the Material 3 spec at m3.material.io/components/menus/guidelines for more details.

The MenuAnchor widget's API is also slightly different. MenuAnchor's were built to be lower level interface for creating menus that are displayed from an anchor.

There are a few steps you would take to migrate from PopupMenuButton to MenuAnchor:

  1. Instead of using the PopupMenuButton.itemBuilder to build a list of PopupMenuEntrys, you would use the MenuAnchor.menuChildren which takes a list of Widgets. Usually, you would use a list of MenuItemButtons as shown in the example below.

  2. Instead of using the PopupMenuButton.onSelected callback, you would set individual callbacks for each of the MenuItemButtons using the MenuItemButton.onPressed property.

  3. To anchor the MenuAnchor to a widget, you would use the MenuAnchor.builder to return the widget of choice - usually a TextButton or an IconButton.

  4. You may want to style the MenuItemButtons, see the MenuItemButton documentation for details.

Use the sample below for an example of migrating from PopupMenuButton to MenuAnchor.

This example shows a menu with three items, selecting between an enum's values and setting a selectedMenu field based on the selection.

To create a local project with this code sample, run:
flutter create --sample=material.PopupMenuButton.1 mysample

This example shows how to migrate the above to a MenuAnchor.

To create a local project with this code sample, run:
flutter create --sample=material.PopupMenuButton.2 mysample

This sample shows the creation of a popup menu, as described in: https://m3.material.io/components/menus/overview

To create a local project with this code sample, run:
flutter create --sample=material.PopupMenuButton.3 mysample

This sample showcases how to override the PopupMenuButton animation curves and duration using AnimationStyle.

To create a local project with this code sample, run:
flutter create --sample=material.PopupMenuButton.4 mysample

See also:



PopupMenuButton({Key? key, required PopupMenuItemBuilder<T> itemBuilder, T? initialValue, VoidCallback? onOpened, PopupMenuItemSelected<T>? onSelected, PopupMenuCanceled? onCanceled, String? tooltip, double? elevation, Color? shadowColor, Color? surfaceTintColor, EdgeInsetsGeometry padding = const EdgeInsets.all(8.0), Widget? child, double? splashRadius, Widget? icon, double? iconSize, Offset offset = Offset.zero, bool enabled = true, ShapeBorder? shape, Color? color, Color? iconColor, bool? enableFeedback, BoxConstraints? constraints, PopupMenuPosition? position, Clip clipBehavior = Clip.none, bool useRootNavigator = false, AnimationStyle? popUpAnimationStyle})
Creates a button that shows a popup menu.


child Widget?
If provided, child is the widget used for this button and the button will utilize an InkWell for taps.
clipBehavior Clip
The content will be clipped (or not) according to this option.
color Color?
If provided, the background color used for the menu.
constraints BoxConstraints?
Optional size constraints for the menu.
elevation double?
The z-coordinate at which to place the menu when open. This controls the size of the shadow below the menu.
enabled bool
Whether this popup menu button is interactive.
enableFeedback bool?
Whether detected gestures should provide acoustic and/or haptic feedback.
hashCode int
The hash code for this object.
no setterinherited
icon Widget?
If provided, the icon is used for this button and the button will behave like an IconButton.
iconColor Color?
If provided, this color is used for the button icon.
iconSize double?
If provided, the size of the Icon.
initialValue → T?
The value of the menu item, if any, that should be highlighted when the menu opens.
itemBuilder PopupMenuItemBuilder<T>
Called when the button is pressed to create the items to show in the menu.
key Key?
Controls how one widget replaces another widget in the tree.
offset Offset
The offset is applied relative to the initial position set by the position.
onCanceled PopupMenuCanceled?
Called when the user dismisses the popup menu without selecting an item.
onOpened VoidCallback?
Called when the popup menu is shown.
onSelected PopupMenuItemSelected<T>?
Called when the user selects a value from the popup menu created by this button.
padding EdgeInsetsGeometry
Matches IconButton's 8 dps padding by default. In some cases, notably where this button appears as the trailing element of a list item, it's useful to be able to set the padding to zero.
popUpAnimationStyle AnimationStyle?
Used to override the default animation curves and durations of the popup menu's open and close transitions.
position PopupMenuPosition?
Whether the popup menu is positioned over or under the popup menu button.
runtimeType Type
A representation of the runtime type of the object.
no setterinherited
shadowColor Color?
The color used to paint the shadow below the menu.
shape ShapeBorder?
If provided, the shape used for the menu.
splashRadius double?
The splash radius.
surfaceTintColor Color?
The color used as an overlay on color to indicate elevation.
tooltip String?
Text that describes the action that will occur when the button is pressed.
useRootNavigator bool
Used to determine whether to push the menu to the Navigator furthest from or nearest to the given context.


createElement() StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
createState() PopupMenuButtonState<T>
Creates the mutable state for this widget at a given location in the tree.
debugDescribeChildren() List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) String
A string representation of this object.
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug}) String
Returns a string representation of this node and its descendants.
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) String
Returns a one-line detailed description of the object.
toStringShort() String
A short, textual description of this widget.


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