Flutter 主题

灵感来自 Panache，一个 Flutter Material 主题编辑器，用于配置您的 Material App 的整体视觉主题。

用法

Flutter Theme 是使用 Flutter 开发和构建的，适用于 Web 和桌面。

免责声明：我只在 Web 和 MacOS 上测试了该应用，因为我没有 Windows 或 Linux 机器。该应用可能在这些平台上无法正常工作。

对于 Web，您可以通过 此处 访问。

对于 Mac、Windows 和 Linux，您可以从 此处 下载。

使用生成的 Theme

Flutter Theme 允许您使用 json_theme 将生成的 Theme 导出为 json 文件。要将此 Theme 用于您的应用，请按照以下步骤操作：

  1. 将 json_theme 添加为 pubspec.yaml 文件中的依赖项。

    dependencies:
  json_theme: ^2.1.0+2

  2. 将生成的 json 文件复制到您的应用项目中，并将其放在 assets/ 文件夹下。

  3. 更新您的 pubspec.yaml 文件以包含您的资源。

    flutter:
  assets:
    - assets/flutter_theme.json

  4. 更新您的 main 函数以加载您的 Theme。

    void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  final themeStr = await rootBundle.loadString('assets/flutter_theme.json');
  final themeJson = jsonDecode(themeStr);
  final theme = ThemeDecoder.decodeThemeData(themeJson)!;
}

  5. 然后，您可以将 theme 传递给您的 MaterialApp widget 来使用它。

    MaterialApp(
  theme: theme,
  title: 'Flutter Theme',
  home: HomePage(),
);

有关使用生成的 json Theme 文件的完整示例应用，请参阅 example/ 文件夹下的应用。

GitHub

https://github.com/zeshuaro/flutter_theme