Question 259754 in Flutter Question posted in
The official Flutter documentation can be found here.

create a flutter dropdown button like this

i want to create a flutter dropdown button like shown in the images below. this is an InkWell at the end of the row widget with text and assetImage. i want when a user clicks on the inkwell it display the options as below:
enter image description here

and after selecting from the options the inkwell will appear like this:
enter image description here

the selected option should appear in red color in the menu list

Tags:

2

Answers


  1. 0

    No need of dropdown use PopupMenuButton for it.

    Login or Signup to reply.
  2. 0

    You can use MenuAnchor for this.
    https://api.flutter.dev/flutter/material/MenuAnchor-class.html
    Make a function that selects what item you clicked on and updates the ui accordingly

    MenuAnchor(
      style: MenuStyle(
        side: MaterialStatePropertyAll(BorderSide(color: blue)),
        backgroundColor: MaterialStateProperty.all<Color?>(blue),
      ),
      builder: (context, controller, child) {
        return InkWell(
          child: Padding(
            padding: const EdgeInsets.all(5),
            child: Transform.scale(
              scaleX: -1,
              child: Icon(Icons.),
            ),
          ),
          onTap: () {
            if (controller.isOpen) {
              controller.close();
            } else {
              controller.open();
            }
          },
        );
      },
      menuChildren: [MenuItemButton(
          child: Text(
            title,
          ),
        )],
    );
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search