Popup menu button or Option menu in toolbar
class NetworkDiagnosis extends StatefulWidget {
@override
_NetworkDiagnosisState createState() => _NetworkDiagnosisState();
}
class _NetworkDiagnosisState extends State<NetworkDiagnosis> {
String _selectedHome = "-Select-";
List<String> homeList=List();
@override
void initState() {
super.initState();
homeList.add('one');
homeList.add('Two');
homeList.add('Three');
homeList.add('Four');
}
@override
Widget build(BuildContext context) {
final homeSelector = Stack(
alignment: Alignment.centerRight,
children: <Widget>[
Container(
margin: EdgeInsets.fromLTRB(0, 0, 25, 0),
child: Text(_selectedHome,
style: TextStyle(color: AppTheme.whiteTextColor, fontSize: 16,fontWeight: FontWeight.bold)),
),
DropdownButtonHideUnderline(
child: DropdownButton<String>(
icon: Icon(Icons.arrow_drop_down, color: Colors.white,),
items: homeList.map((value) => DropdownMenuItem<String>(
child: Text(value, style: TextStyle(color: AppTheme.blackTextColor)),
value: value,
)).toList(),
onChanged: (String value) {
setState(() => _selectedHome = value);
}),
),
],
);
return Scaffold(
appBar: AppBar(
title: Text('Title'),
centerTitle: true,
backgroundColor: AppTheme.appBarColor,
actions: <Widget>[homeSelector],
),
body: Center(child: Text('Hi this is body'))
);
}
}
@override
_NetworkDiagnosisState createState() => _NetworkDiagnosisState();
}
class _NetworkDiagnosisState extends State<NetworkDiagnosis> {
String _selectedHome = "-Select-";
List<String> homeList=List();
@override
void initState() {
super.initState();
homeList.add('one');
homeList.add('Two');
homeList.add('Three');
homeList.add('Four');
}
@override
Widget build(BuildContext context) {
final homeSelector = Stack(
alignment: Alignment.centerRight,
children: <Widget>[
Container(
margin: EdgeInsets.fromLTRB(0, 0, 25, 0),
child: Text(_selectedHome,
style: TextStyle(color: AppTheme.whiteTextColor, fontSize: 16,fontWeight: FontWeight.bold)),
),
DropdownButtonHideUnderline(
child: DropdownButton<String>(
icon: Icon(Icons.arrow_drop_down, color: Colors.white,),
items: homeList.map((value) => DropdownMenuItem<String>(
child: Text(value, style: TextStyle(color: AppTheme.blackTextColor)),
value: value,
)).toList(),
onChanged: (String value) {
setState(() => _selectedHome = value);
}),
),
],
);
return Scaffold(
appBar: AppBar(
title: Text('Title'),
centerTitle: true,
backgroundColor: AppTheme.appBarColor,
actions: <Widget>[homeSelector],
),
body: Center(child: Text('Hi this is body'))
);
}
}
After Successful run above code it will looks like
On tap on Select form option menu
After made a selection,
ConversionConversion EmoticonEmoticon