Flutter如何查找Icon及其他组件的默认颜色？

对于你的场景，有几个直接的方法可以找到Icon默认对应的ColorScheme颜色：

1. 查看组件源码 #

Flutter的Material组件默认样式都基于Theme实现，直接看组件源码就能定位颜色来源。以Icon为例：

• Icon的color参数默认是null，在build阶段会读取IconTheme.of(context).color；
• Material3模式下，ThemeData里的默认IconTheme颜色，取自ColorScheme.onSurfaceVariant（你可以验证这个颜色和你的Icon棕色是否匹配）。

2. 打印Theme颜色值对比 #

在MyHomePage的build方法里添加代码，直接输出相关颜色的十六进制值，对比后就能确认：

@override
Widget build(BuildContext context) {
  // 打印IconTheme的默认颜色
  print('Icon默认颜色: ${Theme.of(context).iconTheme.color}');
  // 打印ColorScheme中可能的候选颜色
  print('ColorScheme.onSurfaceVariant: ${Theme.of(context).colorScheme.onSurfaceVariant}');
  print('ColorScheme.primary: ${Theme.of(context).colorScheme.primary}');
  return Scaffold(...);
}

运行后查看控制台输出，哪个颜色和Icon实际颜色一致，就是对应的ColorScheme项。

3. 使用Flutter DevTools Inspector #

打开DevTools并选中你的Icon组件，在右侧「Properties」面板找到color属性，就能看到它的取值来源；或者切换到「Theme」面板，直接查看当前Theme下的IconTheme和ColorScheme所有颜色值，直观对比即可。

确认对应的ColorScheme颜色后，你就可以直接用Theme.of(context).colorScheme.xxx给其他设计元素设置相同颜色了。

内容的提问来源于stack exchange，提问作者Mercutio1243