반응형
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- GitHub
- 데스크테리어
- react
- TextField
- 간단리뷰
- 라이언
- AppBar
- list
- sqflite
- wrap
- 데스크셋업
- 내돈내산
- 춘식
- visualstudiocode
- listview
- Git
- AppleSilicon
- VSCode
- swift
- database
- Flutter
- 플러터
- xcode
- ios
- M1
- datetime
- GetX
- 카카오
- error
- Android
Archives
- Today
- Total
welcome to my blog
[Flutter] DropdownButton 본문
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
반응형
'Flutter' 카테고리의 다른 글
[Flutter] 단위/위젯테스트 코드 정리 (0) | 2021.12.17 |
---|---|
[Flutter] 자동완성 단축키 (0) | 2021.12.16 |
[Flutter] android release build 앱빌드하기 (0) | 2021.12.06 |
[Flutter] android apk 설치하기 / database 꺼내 보기 (0) | 2021.12.03 |
[Flutter] GetX + obs 업데이트가 안돼 (0) | 2021.11.26 |