Search packages, repositories and app categories

ducafecatFlutter ecosystem guide
Package detailsv0.0.6

popup_menu_plus

A Flutter Popup Menu Widget, written completely in dart, and it supports both iOS and Android.

AndroidiOSWebmacOSWindowsLinux
pub.dev API documentation Source code
30-day downloads
898
Likes
30
Pub points
150

Install package

flutter pub add popup_menu_plus

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

popup_menu_plus is a Flutter package that provides a customizable popup menu widget, fully implemented in Dart. It offers native-like functionality on iOS and Android, with support across multiple platforms including Web, macOS, Windows, and Linux. The package enhances user interaction by enabling context-sensitive menus triggered by taps or gestures. It is designed to be lightweight, easy to integrate, and compatible with modern Flutter practices. Developers can extend its behavior with custom items and styling options.

Use cases

  • Contextual actions in apps
  • User settings menus
  • Dropdown-style navigation
  • Customizable popups for forms
  • Platform-consistent UI elements

Key features

  • Cross-platform compatibility
  • Fully written in Dart
  • Supports gesture triggers
  • Extensible item customization
  • Lightweight and performant

Suitable for

  • Developers building multi-platform apps
  • Teams needing consistent menu UI
  • Apps requiring contextual action menus
  • Projects with tight performance constraints
  • UI-heavy applications

Considerations

  • Requires manual handling of menu positioning
  • Limited built-in theming options
  • May need additional logic for complex interactions
  • Not optimized for very large menu items
  • Depends on Flutter's gesture system

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

Popup Menu Plus

This project is a fork of chinabrant/popup_menu.

This project was written completely in dart, and it supports both iOS and Android.

Screenshots

Todo

  • [ ] show/hide animation

Usage

You can find the demo at the 'example' folder.

PopupMenu menu = PopupMenu(
      context: context,
      config: const MenuConfig(
        backgroundColor: Colors.green,
        lineColor: Colors.greenAccent,
        highlightColor: Colors.lightGreenAccent,
      ),
      items: [
        PopUpMenuItem(title: 'Copy', image: Image.asset('assets/copy.png')), 
        PopUpMenuItem(title: 'Home', image: Icon(Icons.home, color: Colors.white,)), 
        PopUpMenuItem(title: 'Mail', image: Icon(Icons.mail, color: Colors.white,)), 
        PopUpMenuItem(title: 'Power', image: Icon(Icons.power, color: Colors.white,)),
        PopUpMenuItem(title: 'Setting', image: Icon(Icons.settings, color: Colors.white,)), 
        PopUpMenuItem(title: 'Traffic', image: Icon(Icons.traffic, color: Colors.white,))], 
      onClickMenu: onClickMenu, 
      onShow: onShow,
      onDismiss: onDismiss);

menu.show(rect: rect);

or

PopupMenu menu = PopupMenu(
        context: context,
        config: const MenuConfig(
            backgroundColor: Colors.green,
            lineColor: Colors.greenAccent,
            highlightColor: Colors.lightGreenAccent,
        ),
        items: [
          PopUpMenuItem(title: 'Copy', image: Image.asset('assets/copy.png')),
          PopUpMenuItem(
              title: 'Home',
              textStyle: TextStyle(fontSize: 10.0, color: Colors.tealAccent),
              image: Icon(
                Icons.home,
                color: Colors.white,
              )),
          PopUpMenuItem(
              title: 'Mail',
              image: Icon(
                Icons.mail,
                color: Colors.white,
              )),
          PopUpMenuItem(
              title: 'Power',
              image: Icon(
                Icons.power,
                color: Colors.white,
              )),
          PopUpMenuItem(
              title: 'Setting',
              image: Icon(
                Icons.settings,
                color: Colors.white,
              )),
          PopUpMenuItem(
              title: 'PopupMenu',
              image: Icon(
                Icons.menu,
                color: Colors.white,
              ))
        ],
        onClickMenu: onClickMenu,
        onDismiss: onDismiss);
    menu.show(widgetKey: btnKey2);

with custom content:

PopupMenu menu = PopupMenu(
        context: context,
        config: const MenuConfig(
            type: MenuType.custom,
            itemHeight: 200,
            itemWidth: 200,
            backgroundColor: Colors.green,
        ),
        content: Container(
            width: 50,
            height: 50,
            color: Colors.red,
          ),
        onClickMenu: onClickMenu,
        onDismiss: onDismiss);
    menu.show(widgetKey: btnKey2);

Categories

Menu

Source repository

Projects using this package

No data available yet.