Flutter Material 3 更改了颜色和字体

Question

所以我决定在 Flutter 中尝试一下 Material 3，它改变了很多颜色、字体等。

我知道某些东西看起来会有所不同，例如卡片上的圆角，但我没想到所有字体和卡片颜色都会改变。我实际上只是将其添加useMaterial3: true,到下面的代码中：

child: MaterialApp(
          debugShowCheckedModeBanner: false,
          routes: appRoutes,
          theme: ThemeData(
            useMaterial3: true,
            scaffoldBackgroundColor: const Color(0xFF2b8293),
          ),
          home: const CheckLogin(),
        ),

以下是前后图片变化的示例：

无论如何要更改默认的卡片颜色和标题字体，这样我就不必在应用程序的每个视图中一一更改它们？

同样奇怪的是，垂直的三点图标变成了黑色，而搜索图标却没有。谢谢！

Answer 1

您可以覆盖materialApp 上的默认主题。

theme: ThemeData(
  useMaterial3: true,
  scaffoldBackgroundColor: const Color(0xFF2b8293),
  appBarTheme: AppBarTheme(
    titleTextStyle: TextStyle(...),
    iconTheme: IconThemeData(
      ...
    )
  )
),

Answer 2

每当您在material3中遇到颜色问题时，只需在小部件内使用 surfaceTintColor属性即可。

surfaceTintColor：Colors.customColor

Answer 3

Material 3 使用动态颜色，您可以使用colorScheme内部覆盖主题ThemeData并调整那里的颜色。然后，您可以转到应用程序中的小部件并使用Theme.of(context).colorScheme然后.primary或任何您想要的东西。

要了解有关 Flutter 中的 Material 3 的更多信息，您可以查看https://m3.material.io/develop/flutter