我有一个下拉按钮在扑动,我想改变所选选项的颜色(见图片)。默认颜色为灰色。我找不到DropdownButton的参数来改变这一点。我在ThemeData中尝试了selectedRowColor
,但它不影响这种颜色。可以换个颜色吗?
形象最小可复制示例:
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(),
),
),
);
}
}
.
.
].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(),
我找到了解决方案。ThemeData
中的focusColor
影响颜色
如果我用Theme
小部件包装DropdownButton
并更改focusColor
参数,我将得到所需的结果。或者直接在材质应用的主题中设置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(),
),
)
//...
结果:输入图片描述