class MyApp extends StatelessWidget {
const MyApp({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'DropdownButton下拉菜单按钮',
home: Scaffold(
appBar: AppBar(
title: Text('DropdownButton下拉菜单按钮'),
),
body: DemoPage(),
),
);
}
}
class DemoPage extends StatefulWidget {
DemoPage({Key key}) : super(key: key);
@override
_DemoPageState createState() => _DemoPageState();
}
class _DemoPageState extends State<DemoPage> {
String dropdownValue = 'One';
@override
Widget build(BuildContext context) {
return Center(
child: ListTile(
title: Text('下拉菜单按钮'),
trailing: DropdownButton(
value: dropdownValue,
onChanged: (String value) {
setState(() {
dropdownValue = value;
});
},
items: <String>['one', 'tow', 'three', 'four'].map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem(
value: value,
child: Text(value),
);
}).toList(),
),
),
);
}
} Flutter笔记40:DropdownButton下拉框按钮
DropdownButton相当于html的select下拉框,注意它与PopupMenuButton的区别。下面是代码演示:
