Flutter 主题

主题是包含我们网站或移动应用程序屏幕的图形外观的预设包。它使用户界面更具吸引力。我们主要使用主题来共享应用程序中的颜色和字体样式。

在移动开发中，为我们的应用程序添加亮色和深色主题变得至关重要。如今，大多数人更喜欢深色主题，而不是浅色主题，因为它使他们的眼睛更舒适并延长了电池寿命。

在 Flutter 中，我们可以使用主题小部件，该小部件包含应用程序特定区域的颜色和字体样式，或定义全应用程序主题。全应用程序主题也是主题小部件，它们是在我们的应用程序根目录下的 MaterialApp 小部件中创建的。

定义主题后，我们可以在应用程序中任何需要的地方使用它。Flutter 中的 Material 小部件也可以使用我们的主题来设置 AppBars、Buttons、Buttons、Checkboxes 等的字体样式和背景颜色。

Flutter 在创建应用程序时使用默认主题。如果我们想将自定义主题共享到整个应用程序，我们需要在 MateialApp() 小部件下使用 ThemeData。

有时我们想覆盖应用程序的一部分中的全应用程序主题。在这种情况下，我们需要将应用程序的部分包装在主题小部件中。Flutter 允许我们使用两种方法来执行此操作

1. 通过创建唯一的主题数据
2. 通过扩展父主题

通过创建唯一的主题数据

当我们不想继承任何应用程序颜色或字体样式时，使用第一种方法。在这种情况下，我们将创建一个 ThemeData() 实例并将其传递给 Theme 小部件，如以下代码片段所示

通过扩展父主题

如果您不想覆盖任何内容，请使用第二种方法，该方法扩展父主题。它可以使用 copyWith() 方法来处理。请参阅以下代码片段

如何使用主题

定义主题后，我们可以使用 Theme.of(context) 方法将其放入 widget build() 方法中。此方法查看小部件树，并返回树中的第一个主题。如果您没有在您的小部件之上定义，则将返回应用程序的主题。

在下面的代码片段中，FloatingActionButton 使用此技术来返回 accentColor。

让我们通过下面的例子来了解如何在 Flutter 应用程序中使用 ThemeData。

输出

当我们在设备或模拟器中运行该应用程序时，我们将看到类似于以下屏幕截图的 UI。