Выпадающая кнопка ограничивает отображаемые элементы

Question

У меня возникла следующая проблема: я хочу, чтобы пользователь выбрал день месяца с помощью раскрывающейся кнопки. Итак, мои элементы - это числа от 1 до 31. Теперь список стал довольно длинным, а раскрывающаяся кнопка стала действительно большой. Есть ли решение показать, например, только 5 элементов одновременно?

      Widget buildDropdownMonthlyTurnus() {
return DropdownButton<int>(
    value: _selectedDay,
    icon: Icon(Icons.arrow_downward),
    iconSize: 24,
    elevation: 16,
    style: TextStyle(color: Colors.blue),
    underline: Container(
      height: 2,
      color: Colors.blue,
    ),
    onChanged: (int newValue) {
      setState(() {
        _selectedDay = newValue;
      });
    },
    items: Constants.daysOfMonth.map((int value) {
      return new DropdownMenuItem<int>(
        value: value,
        child: new Text(
          value.toString(),
          style: new TextStyle(color: Colors.black),
        ),
      );
    }).toList());

}

По ссылке вы видите мою проблему с большим списком.

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

Answer 1

Для этой проблемы вы можете использовать listview внутри контейнера и управлять его размером в соответствии с показанными элементами списка, вам вообще не нужно использовать выпадающие элементы.

Answer 2

Использовать menuMaxHeightсвойство класса DropdownButton. Это недавнее дополнение для управления высотой меню.

      Widget buildDropdownMonthlyTurnus() {
return DropdownButton<int>(
    menuMaxHeight: 200.0,
    value: _selectedDay,
    icon: Icon(Icons.arrow_downward),
    iconSize: 24,
    elevation: 16,
    style: TextStyle(color: Colors.blue),
    underline: Container(
      height: 2,
      color: Colors.blue,
    ),
    onChanged: (int newValue) {
      setState(() {
        _selectedDay = newValue;
      });
    },
    items: Constants.daysOfMonth.map((int value) {
      return new DropdownMenuItem<int>(
        value: value,
        child: new Text(
          value.toString(),
          style: new TextStyle(color: Colors.black),
        ),
      );
    }).toList());