Кнопки раскрывающегося списка — это распространенный компонент пользовательского интерфейса при разработке мобильных приложений, позволяющий пользователям выбирать параметры из раскрывающегося списка. Во Flutter вы можете использовать возможности перечислений, чтобы упростить реализацию и улучшить читаемость кода. В этой статье мы рассмотрим различные методы создания и работы с раскрывающимися кнопками с использованием перечислений во Flutter. Итак, приступим!

Метод 1: базовая кнопка раскрывающегося списка
Самый простой способ создать кнопку раскрывающегося списка с перечисляемыми значениями — использовать виджет DropdownButton. Вот пример:

enum Fruit { apple, banana, orange }
Fruit selectedFruit = Fruit.apple;
DropdownButton<Fruit>(
  value: selectedFruit,
  onChanged: (Fruit newValue) {
    // Handle dropdown value change
    setState(() {
      selectedFruit = newValue;
    });
  },
  items: Fruit.values.map<DropdownMenuItem<Fruit>>((Fruit value) {
    return DropdownMenuItem<Fruit>(
      value: value,
      child: Text(value.toString().split('.').last),
    );
  }).toList(),
)

Метод 2: пользовательская кнопка раскрывающегося списка
Если вы хотите настроить внешний вид кнопки раскрывающегося списка, вы можете использовать виджет DropdownButtonFormField. Он предоставляет дополнительные свойства для оформления кнопки раскрывающегося списка, такие как текст подсказки, проверка и т. д. Вот пример:

enum City { newYork, london, paris }
City selectedCity;
DropdownButtonFormField<City>(
  value: selectedCity,
  onChanged: (City newValue) {
    setState(() {
      selectedCity = newValue;
    });
  },
  items: City.values.map<DropdownMenuItem<City>>((City value) {
    return DropdownMenuItem<City>(
      value: value,
      child: Text(value.toString().split('.').last),
    );
  }).toList(),
  decoration: InputDecoration(
    labelText: 'Select City',
    border: OutlineInputBorder(),
  ),
)

Метод 3: кнопка раскрывающегося списка со значками.
Вы можете оживить кнопку раскрывающегося списка, добавив значки к каждому элементу. Вот пример:

enum Country { usa, canada, germany }
Country selectedCountry;
DropdownButtonFormField<Country>(
  value: selectedCountry,
  onChanged: (Country newValue) {
    setState(() {
      selectedCountry = newValue;
    });
  },
  items: Country.values.map<DropdownMenuItem<Country>>((Country value) {
    return DropdownMenuItem<Country>(
      value: value,
      child: Row(
        children: [
          Icon(Icons.flag),
          SizedBox(width: 5),
          Text(value.toString().split('.').last),
        ],
      ),
    );
  }).toList(),
  decoration: InputDecoration(
    labelText: 'Select Country',
    border: OutlineInputBorder(),
  ),
)

В этой статье мы рассмотрели различные методы создания раскрывающихся кнопок с использованием перечислений во Flutter. Мы начали с базовой реализации с помощью виджета DropdownButton, а затем перешли к настройке внешнего вида с помощью DropdownButtonFormField. Наконец, мы научились добавлять значки в раскрывающиеся списки. Используя возможности перечислений, вы можете писать более чистый и удобный в обслуживании код при работе с раскрывающимися кнопками в приложениях Flutter.