Home > Enterprise >  Flutter toast dialog
Flutter toast dialog

Time:03-17

How can I can make such toast dialog in flutter? (create service, create venue)

Interactive example: enter image description here

CodePudding user response:

Here's a neat package that takes care of that with different styles as well.

                StarMenu(
                  onStateChanged: (state) {
                    print('State changed: $state');
                  },
                  params: StarMenuParameters(
                      shape: MenuShape.linear,
                      linearShapeParams: LinearShapeParams(
                          angle: 270,
                          space: 30,
                          alignment: LinearAlignment.center),
                      onItemTapped: (index, controller) {
                        // don't close if the item tapped is not the ListView
                        if (index != 1) controller.closeMenu();
                      }),
                  // lazyItemsLoad let you build menu entries at runtime
                  lazyItems: () async {
                    return [
                      Container(
                        color: Color.fromARGB(255, Random().nextInt(255),
                            Random().nextInt(255), Random().nextInt(255)),
                        width: 60,
                        height: 40,
                      ),
                      Container(
                        width: 150, // CHANGE WIDTH
                        height: 200, // CHANGE HEIGHT
                        child: Card(
                          elevation: 6,
                          margin: EdgeInsets.all(6),
                          child: Column(
                              children: [
                                 // ADD YOUR ACTIONS HERE
                              ]
                            ),
                          ),
                        ),
                      ),
                    ];
                  },
                  child: FloatingActionButton( // THIS WILL BE YOUR BUTTON YOU WANT TO SHOW THE MENU FROM
                    onPressed: () {
                      print('FloatingActionButton Menu1 tapped');
                    },
                    child: Icon(Icons.looks_one),
                  ),
                ),

CodePudding user response:

You can use PopupMenuButton

PopupMenuButton<String>(
  icon: const Icon(Icons.add_circle_outline_outlined),
  color: Colors.grey, // background color
  itemBuilder: (BuildContext context) => <PopupMenuEntry<String>>[
    PopupMenuItem<String>(
      value: "create service",
      onTap: () {},
      child: const Center(
        child: Text(
          'create service',
        ),
      ),
    ),
    PopupMenuItem<String>(
      value: "create venue",
      child: const Center(
        child: Text(
          'create venue',
        ),
      ),
      onTap: () {},
    ),
  ],
)

  • Related