change dropdown text colour from selected text - flutter

Question

i have a dropdown which contain list of text, then i want have different color of select text and color the text from the dropdown item.
DropdownButton<String>(
hint: Text(
'Topic',
style: TextStyle(fontFamily: 'Cairo', fontSize: 20),
),
isExpanded: true,
value: dropdownValue,
dropdownColor: Colors.black,
elevation: 4,
//notices 1
style: const TextStyle(
color: Colors.deepPurple, fontFamily: 'Cairo'),
onChanged: (String? newValue) {
setState(() {
dropdownValue = newValue;
});
},
items: tpoicList
.map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Container(
// alignment: Alignment.centerRight,
child: Text(
value,
style: const
//notices 2
TextStyle(color: Colors.black),
),
),
);
}).toList(),
)
i notices that in the notice 1 style is also affect the notice 2 style. All i want to is to have different color in the text dropdown and selected text
what i am trying to archive
In the image you will notices the background color is different from the text color also if i select a item from the select item, the text should be in another colors

Answer 1

The DropdownButton has a selectedItemBuilder parameter that should solve your problem. Add something like this to your code:
selectedItemBuilder: (context) {
final List<DropdownMenuItem<String>> list = [];
for (int i = 0; i < tpoicList.lenght; i++) {
list.add(DropdownMenuItem<String>(
value: tpoicList[i],
child: Container(
child: Text(
value,
style: i == dropdownValue?
[YourNewTextStyle],
const TextStyle(color: Colors.black),
),
),
));
}
return list;
},

Answer 2

[official] change dropdown text colour from selected text
selectedItemBuilder: (BuildContext context) {
return tpoicList.map((String value) {
return Align(
alignment: Alignment.centerLeft,
child: Text(
dropdownValue,
style: const TextStyle(color: Colors.white),
),
);
}).toList();
},