[flutter] DropdownButton 위젯으로 상태 변경 기능 구현하기
Flutter 앱을 개발할 때, DropdownButton 위젯은 사용자가 선택한 항목에 따라 화면을 업데이트하는 기능을 구현하는 데 유용합니다. 이번 포스트에서는 DropdownButton 위젯을 사용하여 상태 변경 기능을 구현하는 방법을 살펴보겠습니다.
DropdownButton 위젯 소개
DropdownButton 위젯은 드롭다운 목록을 표시하고, 사용자가 항목을 선택할 수 있는 기능을 제공합니다. 이를 통해 사용자가 선택한 항목에 따라 다른 동작이나 UI를 보여줄 수 있습니다.
DropdownButton 위젯으로 상태 변경 구현하기
다음은 DropdownButton 위젯을 사용하여 상태 변경을 구현하는 간단한 예제 코드입니다.
import 'package:flutter/material.dart';
class MyDropdownButton extends StatefulWidget {
@override
_MyDropdownButtonState createState() => _MyDropdownButtonState();
}
class _MyDropdownButtonState extends State<MyDropdownButton> {
String _selectedItem = '항목 1';
@override
Widget build(BuildContext context) {
return DropdownButton<String>(
value: _selectedItem,
items: <String>['항목 1', '항목 2', '항목 3']
.map((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
onChanged: (String newValue) {
setState(() {
_selectedItem = newValue;
// 선택된 항목에 따른 상태 변경 로직 추가
});
},
);
}
}
위 코드에서, DropdownButton을 구성할 때 현재 선택된 값을 나타내는 value와 선택지 목록을 나타내는 items를 설정합니다. 또한, onChanged 콜백을 통해 선택된 항목이 변경될 때마다 해당 값을 상태에 반영하고 상태를 업데이트하는 로직을 추가할 수 있습니다.
마무리
이렇게 DropdownButton 위젯을 사용하여 Flutter 앱에서 간단한 상태 변경 기능을 구현할 수 있습니다. 변경된 선택지에 따라 화면을 업데이트하거나, 선택된 항목에 따라 다른 작업을 수행하는 등 다양한 활용이 가능합니다.
위의 예제를 참고하여 DropdownButton 위젯을 사용해보시기 바랍니다. Happy coding!