Flutter资源生成插件sds_assets_generator的使用

Flutter资源生成插件sds_assets_generator的使用

sds_assets_generator 是一个用于自动生成 Flutter 项目中资源配置(yaml)和常量的工具。它适用于单个项目和多个模块,由 Gapo 定制并应用。

环境设置

首先,你需要将 pub 的二进制路径添加到你的系统路径中。

macOS 或 Linux

$HOME/.pub-cache/bin

Windows*

%APPDATA%\Pub\Cache\bin

可以通过以下命令激活插件:

dart pub global activate sds_assets_generator

命令行使用

帮助信息

sds_agen -h

示例

sds_agen -t d -s -r lwu

所有命令

-h, --[no-]help 帮助信息 -p, --path Flutter项目根目录路径 (默认为".") -f, --folder 资源文件夹的根目录 (默认为"assets") -w, --[no-]watch 是否持续监控资源变化 (默认为开启) -t, --type pubspec.yaml 中的类型 “d” 表示目录 “- assets/images/” “f” 表示文件 “- assets/images/xxx.jpg” (默认为"d") -s, --[no-]save 是否保存参数到本地 如果仅运行 “gp_agen” 而不带任何参数,则会执行本地参数 -o, --out 常量类的路径 (默认为"lib") -r, --rule 资源常量名称的规则 “lwu” 表示小写下划线 “assets_images_xxx_jpg” “uwu” 表示大写下划线 “ASSETS_IMAGES_XXX_JPG” “lcc” 表示小驼峰 “assetsImagesXxxJpg” (默认为"lwu") -c, --class 常量类的名称 (默认为"Assets") –const-ignore 忽略某些常量的正则表达式


## 在项目中使用

在项目中使用生成的资源常量,可以这样写:

```dart
Image.asset(Assets.assets_images_xxx_jpg);

在模块中使用

在模块中使用时,需要指定包名:

Image.asset(
  Assets.assets_images_xxx_jpg,
  package: Assets.package,
);

示例代码

以下是一个完整的示例代码,展示了如何在项目中使用 sds_assets_generator

import 'package:flutter/material.dart';

import 'assets.dart'; // 导入生成的资产类

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            const Text('你已经点击按钮的次数:'),
            Text('$_counter'),
            Image.asset(Assets.assets_images_flutter_candies_logo_png), // 使用生成的常量
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}

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

1 回复

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


sds_assets_generator 是一个用于 Flutter 项目的资源生成插件,它可以帮助开发者自动生成资源文件(如图片、字体等)的 Dart 代码,从而简化资源引用的过程。以下是使用 sds_assets_generator 的基本步骤:

1. 添加依赖

首先,在你的 pubspec.yaml 文件中添加 sds_assets_generatorbuild_runner 作为开发依赖:

dev_dependencies:
  sds_assets_generator: ^版本号
  build_runner: ^2.1.0

请确保将 ^版本号 替换为当前可用的最新版本。

2. 配置资源文件

pubspec.yaml 文件中,确保你已经正确配置了需要生成代码的资源文件。例如:

flutter:
  assets:
    - assets/images/
  fonts:
    - family: MyCustomFont
      fonts:
        - asset: assets/fonts/MyCustomFont-Regular.ttf

3. 创建资源文件

在项目的 lib 目录下创建一个新的 Dart 文件,例如 assets.dart。在这个文件中,你可以定义需要生成的资源类。

import 'package:sds_assets_generator/sds_assets_generator.dart';

part 'assets.g.dart';

@AssetsGen()
class Assets {
  const Assets._();
}

4. 生成代码

使用 build_runner 生成资源代码。在终端中运行以下命令:

flutter pub run build_runner build

这将会生成一个 assets.g.dart 文件,其中包含了所有资源的引用。

5. 使用生成的代码

在项目中,你可以通过生成的代码来引用资源。例如:

import 'assets.dart';

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Image.asset(Assets.images.myImage);
  }
}

6. 自动生成代码

如果你希望在每次资源文件发生变化时自动生成代码,可以使用以下命令:

flutter pub run build_runner watch

这将监控文件变化,并在需要时自动重新生成代码。

7. 清理生成的文件

如果你想要清理生成的文件,可以运行以下命令:

flutter pub run build_runner clean
回到顶部