如何更改 DropdownButton 选中的选项颜色？

Question

我在 Flutter 中有一个 DropdownButton，我想更改所选选项的颜色（见图）。默认颜色为灰色。我找不到 DropdownButton 的参数来更改它。我在 ThemeData 中尝试了 selectedRowColor 但它不会影响该颜色。是否可以更改该颜色？

image

最小可重现示例：

import 'package:flutter/material.dart';

main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        highlightColor: Colors.red,
      ),
      home: MyHome(),
    );
  }
}

class MyHome extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _MyHomeState();
}

class _MyHomeState extends State<MyHome> {
  List<String> options = ['A', 'B', 'C', 'D'];
  String selectedOption;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: DropdownButton(
          hint: Text('Please choose an option'),
          value: selectedOption,
          onChanged: (String newValue) {
            setState(() {
              selectedOption = newValue;
            });
          },
          items: options.map((option) {
            return DropdownMenuItem(
              child: Text(option),
              value: option,
            );
          }).toList(),
        ),
      ),
    );
  }
}

Answer 1

 .
 .
 ].map<DropdownMenuItem<String>>((String value) {
         return GestureDetector(
           onTap: () {
              setState() {
                _selectedItemValue = value;
              }
           } ,
           child:DropdownMenuItem<String>(
             value: value,
             child: Container(
               color: value == _selectedItemValue ? Colors.blue : Colors.white,
               child: new Text(
                 value,
                 style: TextStyle(color: Colors.white),
             ),),
         ),);
       }).toList(),

Answer 2

我找到了解决方案。 ThemeData 中的 focusColor 正在影响此颜色。

如果我用 Theme 小部件包装 DropdownButton 并更改 focusColor 参数，我会得到想要的结果。或者直接在 material 应用程序主题中设置 focusColor。

像这样：

//...
Theme(
  data: Theme.of(context).copyWith(focusColor: Colors.red),
  child: DropdownButton(
    hint: Text('Please choose an option'),
    value: selectedOption,
    onChanged: (String newValue) {
      setState(() {
        selectedOption = newValue;
      });
    },
    items: options.map((option) {
      return DropdownMenuItem(
        child: Text(option),
        value: option,
      );
    }).toList(),
  ),
)
//...

结果： enter image description here

如何更改 DropdownButton 选中的选项颜色？

How to change DropdownButton selected option color?

flutter

flutter-web