I am trying to use dropdown, and want to have Colors.white
for the selected text, and Colors.black54
for the text of drop down list. But when I tried to use color
attribute and change it to White, it also change the color of drop down text.
DropdownButton<String>(
//this changed the color of both text, intial text as well dropdown text color
dropdownColor: Colors.white,
value: value,
style: TextStyle(color: Colors.white),
icon: CircleAvatar(
radius: 12,
backgroundColor: Colors.white,
child: Icon(Icons.arrow_drop_down),
),
items: places.map((String value) {
return new DropdownMenuItem<String>(
value: value,
child: new Text(
value,
//I tried giving text style here , but same result
style: TextStyle(color: Colors.white),
),
);
}).toList(),
onChanged: (_) {
setState(() {
value = _;
});
},
)
Here is the picture of it.
Okay I found the Solution using selectedItemBuilder
attribute of dropdown
final List<String> places = ['Delhi', 'Mumbai', 'Kerela', 'Agra'];
DropdownButton<String>(
selectedItemBuilder: (_) {
return places
.map((e) => Container(
alignment: Alignment.center,
child: Text(
e,
style: TextStyle(color: Colors.white),
),
))
.toList();
},
value: value,
icon: CircleAvatar(
radius: 12,
backgroundColor: Colors.white,
child: Icon(Icons.arrow_drop_down),
),
items: places.map((String value) {
return new DropdownMenuItem<String>(
value: value,
child: new Text(
value,
style: TextStyle(color: Colors.black54),
),
);
}).toList(),
onChanged: (_) {
setState(() {
value = _;
});
},
)
Here is the result
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.