Dropdownbutton restrict shown items

Question

Ive got the following Problem: I want the user to choose a day of month with a dropdownbutton. So my items are the numbers 1 to 31. Now the list got pretty long and the Dropdownbutton is really large. Is there a Solution to show e.g. only 5 Elements at the same time?

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());

}

In the link you see my problem with the large list.

enter image description here

Answer 1

For this problem you can use listview, inside a container and show manage its size according to the list items shown, you don't need to use dropdown items at all.

Answer 2

Use the menuMaxHeight property of the DropdownButton class. It's a recent addition to control the height of the menu.

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());