hasan-hm1 / circular_menu

A simple animated circular menu for Flutter, Adjustable radius, colors, alignment, animation curve and animation duration.
MIT License
101 stars 54 forks source link

Use the circular_menu in appbar #8

Closed areeba-arshad closed 4 years ago

areeba-arshad commented 4 years ago

Hi, Can I use the circular_menu widget in the app bar, I have a IconButton upon which I open a PopupMenuButton, but this formation looks old in front of your widget please guide me how can I use this widget in the app bar.

Thanks,

hasan-hm1 commented 4 years ago

Hi @areeba-arshad Thanks for creating this issue , Please wrap the Scaffoldwith CircularMenuand set the alignment to Alignment.topLeft or Alignment.topRight or Alignment.topCenter as you want , so the circular menu floats above the app bar and it seems like placed in it , like this :

CircularMenu(
        backgroundWidget: Scaffold(
          appBar: AppBar(),
          body: Center(
            child: Text(
              "Circular Menu in the app bar",
              style: TextStyle(fontSize: 25),
            ),
          ),
        ),
        toggleButtonColor: Colors.pink,
        alignment: Alignment.topLeft,
        items: [
          CircularMenuItem(
            onTap: () {
              print("amber");
            },
            icon: Icons.search,
            color: Colors.amber,
          ),
          CircularMenuItem(
            onTap: () {
              print("green");
            },
            icon: Icons.settings,
            color: Colors.green,
          ),
          CircularMenuItem(
            onTap: () {
              print("orange");
            },
            icon: Icons.home,
            color: Colors.deepOrange,
          ),
        ],
      )