welcome to my blog

[Flutter] DropdownButton 본문

Flutter

[Flutter] DropdownButton

_annie_ 2021. 12. 10. 20:18
728x90

mfc에서 combobox와 같은 기능을 가진 dropdownbutton 정리

String dropdownValue = '1';
List<String> itemList = ['1', '2', '3', '4','5','6','7','8'];
DropdownButton(
  value: dropdownValue,
  menuMaxHeight: 150,
  items: itemList.map((String itemText) {
    return DropdownMenuItem<String>(
      value: itemText,
      child: SizedBox(
          child: Text(itemText)),
    );
  }).toList(),
  onChanged: (String? newValue) {
    setState(() {
      dropdownValue = newValue!;
    });
  },
)

value : 현재 선택된 아이템

리스트에 있는 항목으로 초기화가 되어야 함.

onChange에서 선택된 값으로 변경시켜주는 로직 작성

 

menuMaxHeight : dropdownbutton을 눌렀을 때 리스트들이 나오게되는데, 그 리스트 전체 height를 설정해 줄 수 있음 

(항목이 많을 때 설정을 안해주면 화면 전체를 가리게되는 불상사를 맛볼수있음)

150정도로 설정하면 3개정도 보임

 

items : 전체 아이템

itemList의 값을 하나씩 가져와서 dropdownMenuItem으로 생성, 반환시켜주는 로직을 추가

마지막에 toList로 dropdownMenuItem list로 반환해줌

 

onChange : 값이 변경되었을 경우 타는 로직

현재 선택된 값이 전달인자로 넘어옴(newValue) 

setState로 현재 선택된 값 업데이트 시켜주는 로직 작성해줌

 

 

 

728x90
반응형