Как создать выпадающую кнопку без отображения выбранного значения

Question

Я пытаюсь создать страницу с DropdownButton компонентом виджета в ней. Это мой код:

Padding(
  padding: const EdgeInsets.only(
    right: 16.0,
  ),
  child: DropdownButtonHideUnderline(
    child: DropdownButton<String>(
      icon: Icon(
        Icons.more_vert,
      ),
      iconSize: 24,
      elevation: 16,
      style: TextStyle(color: Colors.deepPurple),
      items: <String>['Edit', 'Delete']
          .map<DropdownMenuItem<String>>((String value) {
        return DropdownMenuItem<String>(
          value: value,
          child: Text(value),
        );
      }).toList(),
      onChanged: (newValue) {},
    ),
  ),
),

Все выглядит хорошо и хорошо.

However, the code above creates a unnecessary space on the left as you can see here:

введите описание изображения здесь

Мне нужно удалить это ненужное место слева. Есть идеи?

Answer 1

Если вы хотите удалить пробел, я бы рекомендовал вам использовать виджет всплывающего меню:

    PopupMenuButton(
        padding: const EdgeInsets.only(left: 0.0, right: 16.0), 
        elevation: 3.2,
        initialValue: choices[1],
        onCanceled: () {
          print('You have not chossed anything');
        },
        tooltip: 'This is tooltip',
        onSelected: _select,
        itemBuilder: (BuildContext context) {
          return choices.map((CustomPopupMenu choice) {
            return PopupMenuItem(
              value: choice,
              child: Text(choice.title),
            );
          }).toList();
        },
      )

Answer 2

Я попытался найти для вас наилучший ответ и определенно обнаружил, что PopupMenuButton flutter - это то, что вам нужно.

Вы можете использовать его в своем коде вот так, и вы достаточно хороши для go.

           Container(
             color: Colors.indigo, // this is for your reference, can be removed
             // here is your padding
             padding: const EdgeInsets.only(left: 0.0, right: 16.0), 
             child: PopupMenuButton<String>(
                itemBuilder: (context) {
                  return <String>["Edit", "Delete"].map((str) {
                    return PopupMenuItem(
                      value: str,
                      child: Text(str),
                    );
                  }).toList();
                },
                child: Icon(Icons.more_vert, color: Colors.white),
                onSelected: (value) {}
              )
           )

Результат

Изображение результата