[flutter]기본 위젯 DropDownButton

 

 

여러 아이템 중 하나를 고를 수 있는 콤보박스 형태의 위젯입니다.

value 프로퍼티에 인스턴스들을 담은 리스트로 지정해야 합니다. 상태를 가지므로 StatefulWidget으로 작성합니다.

 

map()함수를 사용하여 _valueList 리스트의 문자열 3개를 DropdownMenuItem인스턴스 3개로 변환했습니다. 그리고 toList() 함수를 사용하여 다시 리스트로 변환 시켜서 items 프로퍼티에 이 리스트를 지정했습니다. 

 

class _MyHomePageState extends State<MyHomePage> {
  final _valueList = ['첫 번째', '두 번째', '세 번째'];
  var _selectedValue = '첫 번째';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('DropDownButton'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Center(
          child: DropdownButton(
            value: _selectedValue,
            items: _valueList.map(
                (value) {
                  return DropdownMenuItem (
                    value: value,
                    child: Text(value),
                  );
                },
            ).toList(),
            onChanged: (value) {
              setState(() {
                _selectedValue = value;
              });
            },
          )
        ),
      ),
    );
  }
}