Flutter 无法在物理设备上加载图像资产(但在模拟器上加载它就可以了)

Question

我正在构建一个颤振应用程序，当我在手机上运行该应用程序时，资产图像不会加载，但是当我在模拟器上运行该应用程序时，它加载正常。

这是我得到的错误：

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

这是我的pubspec.yaml

flutter:
uses-material-design: true
assets:
- images/

这是main.dart：

导入"包装：颤振/材料.dart";

void main() {
runApp(
MaterialApp(
home: Scaffold(
appBar: AppBar(
backgroundColor: Colors.blueGrey[900],
title: Text('Picture Motivation'),
),
body: Center(
child: Image(
image: AssetImage('images/diamond.png'),
),
),
),
),
);
}

非常令人困惑的是为什么图像在模拟器上而不是在物理设备上正确加载。有什么线索吗？

多谢。

Answer 1

一步一步地做这件事，这应该可以正常工作。基本上你做错了。

1. 将图像放在 assets 文件夹中，以便根目录assets/diamond.png
2. 或者，如果您的 assets 文件夹中有另一个文件夹，images，则根目录assets/images/diamond.png

Pubspec.yaml

flutter:
uses-material-design: true
//you have to give the proper path in order to get the image in your UI
assets: 
- assets/images/diamond.png

用户界面代码：

//this is how your image calling work, you just have to copy the path, same as pubspec.yaml
Center(
child: Image(
image: AssetImage('assets/images/diamond.png'),
)
)

我相信你现在就能得到这个图像。让我知道这是否有帮助。