Popup Menu Customization in Flutter | by Gajendra Pandeya | Feb, 2022

Do more than just dropdown

Gajendra Pandeya
Photo by Clark Tibbs on Unsplash

Table of Contents

  1. Introduction
  2. Popup Menu Button Constructor
  3. Creating Normal Popup Menu
  4. Customizing Menu Button according to our need

Popup menus are one of the most used widgets that display a menu when pressed and calls onselected when the menu is dismissed because an item was selected. Think of it as when you right-click your mouse, you see a list of menu items such as view, sort by, refresh, and …

PopupMenuButton({Key? key, required PopupMenuItemBuilder<T> itemBuilder, T? initialValue, PopupMenuItemSelected<T>? onSelected, PopupMenuCanceled? onCanceled, String? tooltip, double? elevation, EdgeInsetsGeometry padding = const EdgeInsets.all(8.0), Widget? child, Widget? icon, double? iconSize, Offset offset = Offset.zero, bool enabled = true, ShapeBorder? shape, Color? color, bool? enableFeedback})

In most cases, we will be using a popup menu as a trailing widget in our appbar. We will also do so but can be used anywhere, the method will remain the same.

Now our need is to put PopupMenu below the appbar and it should have some rounded corner shape. To achieve that, we will supply the property named offset inside the PopupMenuButton that expects x and y coordinates.

Leave a Comment