Flutter资源生成插件res_generator的使用

Flutter资源生成插件res_generator的使用

pub package

这是一个用于生成项目资产中图片、图标和文字的插件。

使用

在项目文件夹中创建一个名为 res_generator.yaml 的文件,位于 pupspec.yaml 下方。该文件包含配置信息。根据需要进行更改。它包含文字、图标和图片,如果你不需要它们,就不要添加它们,只需要添加你需要的并包含所有属性的项目。

res_generator.yaml

words:
  assets_directory: assets/tr/
  class_directory: lib/core/common/words/
  class_file: words.dart
  class_name: Words
  supported_locales: [ 'uz', 'en' ]
  target_locale: 'uz'

icons:
  assets_directory: assets/icons/
  class_directory: lib/widgets/
  class_file: custom_icons.dart
  class_name: CustomIcons

images:
  assets_directory: assets/images/
  class_directory: lib/widgets/
  class_file: custom_images.dart
  class_name: CustomImages

pubspec.yaml 中添加依赖

dev_dependencies:
  res_generator: ^version

在终端运行命令以生成资源(图片、图标、文字)

dart run res_generator:generate

在终端运行命令以翻译资源(文字)

dart run res_generator:translate

更多关于Flutter资源生成插件res_generator的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter资源生成插件res_generator的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是如何在Flutter项目中使用res_generator插件的一个示例。res_generator插件通常用于从JSON、YAML等格式的文件自动生成Dart代码,以便在Flutter应用中轻松使用这些资源。

步骤 1: 添加依赖

首先,你需要在pubspec.yaml文件中添加res_generator依赖:

dependencies:
  flutter:
    sdk: flutter
  res_generator: ^x.y.z  # 替换为最新版本号

dev_dependencies:
  build_runner: ^x.y.z  # 替换为最新版本号

运行flutter pub get来安装依赖。

步骤 2: 创建资源文件

假设你有一个名为data.json的JSON文件,内容如下:

{
  "greeting": "Hello, World!",
  "farewell": "Goodbye!"
}

将此文件放置在项目的assets文件夹中(如果尚未创建该文件夹,请创建它)。

步骤 3: 更新pubspec.yaml以包含资源文件

pubspec.yaml中添加对资源文件的引用:

flutter:
  assets:
    - assets/data.json

步骤 4: 创建生成配置文件

在项目根目录下创建一个名为build.yaml的文件,并添加以下内容以配置资源生成器:

targets:
  $default:
    builders:
      res_generator:
        generate_for:
          - assets/data.json
        options:
          class_name: MyResources  # 生成的Dart类的名称

步骤 5: 运行构建命令

在项目根目录下运行以下命令以生成Dart代码:

flutter pub run build_runner build

这将在.dart_tool/build_generator/目录下生成一个Dart文件(例如my_resources.dart,具体名称取决于你的配置)。

步骤 6: 使用生成的资源类

生成的Dart文件将包含一个类(在本例中为MyResources),你可以在你的Flutter应用中使用该类来访问资源。例如:

import 'package:your_app_name/generated/my_resources.dart'; // 导入生成的资源类

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Res Generator Example'),
        ),
        body: Center(
          child: Text(MyResources.greeting),  // 使用生成的资源
        ),
      ),
    );
  }
}

注意事项

  1. 生成的代码位置:生成的代码通常位于.dart_tool/build_generator/目录下,不应手动编辑这些文件,因为它们是由构建过程自动生成的。
  2. 热重载/重启:在修改资源文件或构建配置后,你可能需要重新启动应用而不是仅仅热重载,以确保更改生效。
  3. 版本兼容性:确保你使用的res_generator插件版本与你的Flutter SDK版本兼容。

通过上述步骤,你就可以在Flutter项目中使用res_generator插件来自动生成和使用资源了。

回到顶部