Flutter：无法加载资产

Question

我无法将图像作为背景上传到容器，我已将图像添加到 assets 文件夹中并将其添加到 pubspec.yaml 并显示该错误：

I/flutter ( 6664): ══╡ EXCEPTION CAUGHT BY IMAGE RESOURCE SERVICE ╞════════════════════════════════════════════════════
I/flutter ( 6664): The following assertion was thrown resolving an image codec:
I/flutter ( 6664): Unable to load asset: assets/images/img.png
I/flutter ( 6664): 
I/flutter ( 6664): When the exception was thrown, this was the stack:
I/flutter ( 6664): #0      PlatformAssetBundle.load (package:flutter/src/services/asset_bundle.dart:221:7)
I/flutter ( 6664): <asynchronous suspension>
I/flutter ( 6664): #1      AssetBundleImageProvider._loadAsync (package:flutter/src/painting/image_provider.dart:484:44)
I/flutter ( 6664): #2      AssetBundleImageProvider.load (package:flutter/src/painting/image_provider.dart:469:14)
I/flutter ( 6664): #3      ImageProvider.resolve.<anonymous closure>.<anonymous closure>.<anonymous closure> (package:flutter/src/painting/image_provider.dart:327:17)
I/flutter ( 6664): #4      ImageCache.putIfAbsent (package:flutter/src/painting/image_cache.dart:160:22)
I/flutter ( 6664): #5      ImageProvider.resolve.<anonymous closure>.<anonymous closure> (package:flutter/src/painting/image_provider.dart:325:84)
I/flutter ( 6664): (elided 13 frames from package dart:async)
I/flutter ( 6664): 
I/flutter ( 6664): Image provider: AssetImage(bundle: null, name: "assets/images/img.png")
I/flutter ( 6664): Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#99877(), name: "assets/images/img.png",
I/flutter ( 6664):   scale: 1.0)
I/flutter ( 6664): ════════════════════════════════════════════════════════════════════════════════════════════════════

代码：

body: Form(
          child: Column(
            children: <Widget>[
               Container(
                 decoration: BoxDecoration(
                   image: DecorationImage(
                     image: AssetImage("assets/images/img.png"),
                     fit: BoxFit.cover,
                   ),
                 ),

我已经添加了

assets:
  - assets/images/

到 pubspec.yaml

图片文件夹

在

assets:
  - assets/images/img.png

---

I/flutter ( 6664): ══╡ EXCEPTION CAUGHT BY IMAGE RESOURCE SERVICE ╞════════════════════════════════════════════════════
I/flutter ( 6664): The following assertion was thrown resolving an image codec:
I/flutter ( 6664): Unable to load asset: assets/images/img.png
I/flutter ( 6664): 
I/flutter ( 6664): When the exception was thrown, this was the stack:
I/flutter ( 6664): #0      PlatformAssetBundle.load (package:flutter/src/services/asset_bundle.dart:221:7)
I/flutter ( 6664): <asynchronous suspension>
I/flutter ( 6664): #1      AssetBundleImageProvider._loadAsync (package:flutter/src/painting/image_provider.dart:484:44)
I/flutter ( 6664): #2      AssetBundleImageProvider.load (package:flutter/src/painting/image_provider.dart:469:14)
I/flutter ( 6664): #3      ImageProvider.resolve.<anonymous closure>.<anonymous closure>.<anonymous closure> (package:flutter/src/painting/image_provider.dart:327:17)
I/flutter ( 6664): #4      ImageCache.putIfAbsent (package:flutter/src/painting/image_cache.dart:160:22)
I/flutter ( 6664): #5      ImageProvider.resolve.<anonymous closure>.<anonymous closure> (package:flutter/src/painting/image_provider.dart:325:84)
I/flutter ( 6664): (elided 13 frames from package dart:async)
I/flutter ( 6664): 
I/flutter ( 6664): Image provider: AssetImage(bundle: null, name: "assets/images/img.png")
I/flutter ( 6664): Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#c1182(), name: "assets/images/img.png",
I/flutter ( 6664):   scale: 1.0)
I/flutter ( 6664): ════════════════════════════════════════════════════════════════════════════════════════════════════

Answer 1

请不要使用反斜杠，如果有人试图在 Windows 之外编译您的项目，它可能会失败。

也没有什么可以保证未来的提交会拒绝反斜杠或将它们视为转义字符序列。那么您自己的项目将无法在任何地方编译。

pubspec.yaml 查找缩进，它需要 2 个空格，并确保资产在颤振后放置 2 个空格

如果您想要包含文件夹 assets/files/，您需要 - assets/files/，而不是 - assets/，既不是 - assets，也不是 -assets/files。你需要的图标也一样- assets/images/icons/

在 Flutter 的 pubsec.yaml 文件中，您需要从 uses-material-design: true 所在的同一列位置开始编写 assets: ...... 行 行开始于。

你的pubspect.yaml文件结构应该是这样的

flutter:
uses-material-design: true
  assets:
    - images/some_image.png
    - images/some_icon.png

这一切都命中了flutter clean 命令

Answer 2

就我而言，我需要 package 属性，因为图像位于我的 library 项目中，并且我正在运行 example 项目。

包：[你的父目录或项目名称]

例如。我的项目名称是'flutter_demo'

AssetImage('assets/images/ic_welcome.png', package: 'flutter_demo'),

pubspect.yaml

flutter:
  assets:
    - assets/images/

目录结构：

flutter_demo
  -- assets
    -- images
      -- ic_welcome.png

Answer 3

你需要这样添加

flutter:
  assets:
    - assets/images/img.png