import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
resizeToAvoidBottomPadding: false,
body: SafeArea(
child: DropDownApp()
),
),
);
}
}
class DropDownApp extends StatefulWidget {
@override
_DropDownAppState createState() => _DropDownAppState();
}
class _DropDownAppState extends State<DropDownApp> {
String _value = "1";
DropdownButton _dropDown() => DropdownButton<String>(
items: [
DropdownMenuItem<String>(
value: "1",
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
Icon(Icons.add_alarm),
Text('Flutter 1',style: TextStyle(color: Colors.black),)
],
)
),
DropdownMenuItem<String>(
value: "2",
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Icon(Icons.add_comment),
Text('Flutter 2',style: TextStyle(color: Colors.black),)
],
)
),
DropdownMenuItem<String>(
value: "3",
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Icon(Icons.add_shopping_cart),
Text('Flutter 3',style: TextStyle(color: Colors.black),)
],
)
),
],
onChanged: (value){
setState(() {
_value = value;
});
},
//hint: Text('Go for it!'),
value: _value,
elevation: 4,
style: TextStyle(fontSize: 30.0),
isDense: false, //reduce the height of the button
iconSize: 40.0, //size of the triangle-arrow
disabledHint: Text('Options Disabled'), //When items and onchanged is null
isExpanded: false,
);
static String dropdownValue = 'Tango';
DropdownButton _dropDown2() => DropdownButton<String>(
value: dropdownValue,
icon: Icon(Icons.arrow_downward),
iconSize: 24,
elevation: 16,
style: TextStyle(
color: Colors.deepPurple
),
underline: Container(
height: 2,
color: Colors.deepPurpleAccent,
),
onChanged: (String newValue) {
setState(() {
dropdownValue = newValue;
});
},
items: <String>['Tango', 'Charlie', 'Watson', 'Walter']
.map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
})
.toList(),
);
@override
Widget build(BuildContext context) {
return Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Center(child:_dropDown(),), //without underline
Center(child:_dropDown2(),), // with underline
],
)
);
}
}