Skip to main content

Command Palette

Search for a command to run...

The case of assigning the id of PlutoMenuItem.

Updated
1 min read
The case of assigning the id of PlutoMenuItem.
M

I've mainly been doing backend web development. I also have a technology for web front-end, and recently I mainly develop Flutter packages.

A unique id can be set for PlutoMenuItem.

PlutoMenuItem(
  id: 'unique_id',
  title: 'Menu 1',
)

If PlutoMenuItem is created in build method, you should set a unique id for PlutoMenuItem.
Otherwise, when PlutoMenuBar is rebuilt, incorrect actions such as flickering or closing of open menus may occur.
(id must be unique throughout the app.)

class TestWidget extends StatelessWidget {
  const TestWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return PlutoMenuBar(menus: [
      PlutoMenuItem(
        id: 'Menu1',
        title: 'Menu1',
      ),
      PlutoMenuItem(
        id: 'Menu2',
        title: 'Menu2',
      ),
    ]);
  }
}

If PlutoMenuItem is created only once in a method such as initState, there is no need to set id.
Even if PlutoMenuBar is rebuilt, PlutoMenuItem is reused.
(The internal PlutoMenuItem.key is not changed.)

class TestWidget extends StatefulWidget {
  const TestWidget({Key? key}) : super(key: key);

  @override
  State<TestWidget> createState() => _TestWidgetState();
}

class _TestWidgetState extends State<TestWidget> {
  late final List<PlutoMenuItem> menus;

  @override
  void initState() {
    super.initState();

    menus = [
      PlutoMenuItem(title: 'Menu1'),
      PlutoMenuItem(title: 'Menu2'),
    ];
  }

  @override
  Widget build(BuildContext context) {
    return PlutoMenuBar(menus: menus);
  }
}

PlutoMenuBar

Part 1 of 3

PlutoMenuBar is a menu bar that can add multiple sub menus.

Up next

PlutoMenuItemWidget

Example code to add custom widget to PlutoMenuBar.