Flutter AppBar无默认颜色且elevation属性（阴影）不生效问题咨询

嗨，我来帮你排查下这个问题～这种情况大概率不是Material SDK的问题，而是你的项目配置或者主题设置的问题，下面是几个常见的原因和对应的解决办法：

• 主题配置切换到了Material 3
  现在Flutter的新版本默认启用Material 3设计规范，和旧教程里的Material 2风格差异很大：Material 3的AppBar默认背景色是主题的surface色（通常为白色），而且阴影（elevation）的表现更柔和，甚至默认可能不明显。

  • 解决办法1：如果想还原到教程里的Material 2效果，可以在根组件MaterialApp中禁用Material 3：

    MaterialApp(
      theme: ThemeData(
        useMaterial3: false, // 关闭Material 3，回到Material 2风格
      ),
      home: const YourHomePage(),
    )
    

  • 解决办法2：如果想保留Material 3，又要调整AppBar样式，可以自定义AppBarTheme：

    MaterialApp(
      theme: ThemeData(
        useMaterial3: true,
        appBarTheme: const AppBarTheme(
          backgroundColor: Colors.lightBlue, // 设置默认背景色
          elevation: 4, // 指定阴影高度
          surfaceTintColor: Colors.transparent, // 让阴影更清晰显示
        ),
      ),
      home: const YourHomePage(),
    )
    

• elevation被全局样式或主题覆盖
  有时候全局主题会把AppBar的默认elevation设为0，导致阴影完全不显示；另外在Material 3中，surfaceTintColor会影响阴影的呈现，如果这个值是和背景色接近的颜色，阴影会几乎看不见。

  • 解决办法：直接在AppBar组件中显式指定相关属性，强制覆盖全局设置：

    AppBar(
      title: const Text('我的应用'),
      backgroundColor: Colors.lightBlue,
      elevation: 4, // 强制设置阴影高度
      surfaceTintColor: Colors.transparent, // 消除表面色调对阴影的遮挡
    )
    

• 不小心使用了Cupertino风格配置
  如果你的根组件是CupertinoApp而不是MaterialApp，或者混用了Cupertino主题，AppBar会变成iOS风格，默认是白色且没有阴影。

  • 解决办法：确保项目根组件是MaterialApp，并且没有引入Cupertino相关的全局主题配置。

总的来说，先检查Material 3的启用状态，这是最常见的诱因。手动设置backgroundColor其实是合理的解法，只要配合elevation和surfaceTintColor就能让阴影正常显示啦～

备注：内容来源于stack exchange，提问作者Kalhara Batangala