如何在 pubspec.yaml 中轻松添加 100 多个手动图像？答案

【问题标题】：How to add 100+ manual images in pubspec.yaml in a easy way?如何在 pubspec.yaml 中轻松添加 100 多个手动图像？
【发布时间】：2019-02-27 09:27:05
【问题描述】：

我需要在我的应用程序中添加相当多的图像。并计划让应用程序离线。写“assets/image1.jpg”对大脑来说是痛苦的。我是新来的，我不知道是否还有其他方法。有吗？

【问题讨论】：

只需在 pubspec.yaml 中添加文件夹 - assets/ - &in 代码访问您必须使用的图像 - 'assets/image1.jpg'
非常感谢.. 有时简单的事情不会通过头脑。

标签： flutter imagesource

【解决方案1】：

要包含资产：

flutter:
  assets:
    - assets/my_icon.png
    - assets/background.png

要包含目录下的所有资产，请以 / 字符结尾指定目录名称：

flutter:
  assets:
    - assets/

请注意，仅包含直接位于目录中的文件；要添加位于子目录中的文件，请为每个目录创建一个条目。

来自 Flutter 文档：(https://flutter.dev/docs/development/ui/assets-and-images)

【讨论】：

【解决方案2】：

这是一个名为 Flr(Flutter-R) 的 Flutter 开发工具，可以帮助您在 pubspec.yaml 中自动指定图像/文本/字体资产并生成 r.g.dart 文件。然后你可以通过引用它的资产ID函数在代码中应用资产，例如：

import 'package:flutter_r_demo/r.g.dart';

// test_sameName.png
var normalImageWidget = Image(
  width: 200,
  height: 120,
  image: R.image.test_sameName(),
);

// test_sameName.gif
var gifImageWidget = Image(
  image: R.mage.test_sameName_gif(),
);

// test.svg
var svgImageWidget = Image(
  width: 100,
  height: 100,
  image: R.svg.test(width: 100, height: 100),
);

// test.json
var jsonString = await R.text.test_json();

// test.yaml
var yamlString = await R.text.test_yaml();

// Amiri Font Style
var amiriTextStyle = TextStyle(fontFamily: R.fontFamily.amiri);

到目前为止，Flr 已支持 Android Studio Plugin、CLI 和 VSCode Extension：

Flr Android Studio 插件版本
- GitHub：https://github.com/Fly-Mix/flr-as-plugin
- 插件主页：https://plugins.jetbrains.com/plugin/13789-flr
- flr-as-plugin 使用示例 Gif：
Flr CLI 版本
- GitHub：GitHub：https://github.com/Fly-Mix/flr-cli
- 插件主页：https://rubygems.org/gems/flr
- flr-cli 使用示例 Gif：
Flr VSCode 扩展版本
- GitHub：GitHub：https://github.com/Fly-Mix/flr-vscode-extension
- 分机主页：https://marketplace.visualstudio.com/items?itemName=LincolnLaw.flr
- flr-vscode-extension 使用示例：

现在你可以根据自己的开发环境安装任意版本的Flr工具，然后轻松添加大量图片/文字/字体，尽情享受吧~

【讨论】：