Exception whilst trying to display an image in flutter

1
votes

I am trying to display an image in a flutter app.

I have added an images directory and have a file in that directory called iu.png.

In pubspec.yaml I have: 

assets:
    - images/iu.png

in main.dart I have:

```

child: new Column(
    children: <Widget>[
        new Text('Image Demo'),
        new Image.asset('images/iu.png'),
    ],
),

```

When I run the code in either an Android or iOS simulator I get the following exception:

I/flutter ( 9252): ══╡ EXCEPTION CAUGHT BY IMAGE RESOURCE SERVICE ╞════════════════════════════════════════════════════ I/flutter ( 9252): The following assertion was thrown resolving an image codec: I/flutter ( 9252): Unable to load asset: images/iu.png I/flutter ( 9252): I/flutter ( 9252): When the exception was thrown, this was the stack: I/flutter ( 9252): #0 PlatformAssetBundle.load (package:flutter/src/services/asset_bundle.dart:221:7) I/flutter ( 9252): I/flutter ( 9252): #1
AssetBundleImageProvider._loadAsync (package:flutter/src/painting/image_provider.dart:427:44) I/flutter ( 9252): I/flutter ( 9252): #2
AssetBundleImageProvider.load (package:flutter/src/painting/image_provider.dart:412:14) I/flutter ( 9252): #3 ImageProvider.resolve.. (package:flutter/src/painting/image_provider.dart:266:86) I/flutter ( 9252): #4 ImageCache.putIfAbsent (package:flutter/src/painting/image_cache.dart:143:20) I/flutter ( 9252): #5 ImageProvider.resolve. (package:flutter/src/painting/image_provider.dart:266:63) I/flutter ( 9252): (elided 8 frames from package dart:async) I/flutter ( 9252): I/flutter ( 9252): Image provider: AssetImage(bundle: null, name: "images/iu.png") I/flutter ( 9252): Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#54de0(), name: "images/iu.png", scale: I/flutter ( 9252): 1.0) I/flutter ( 9252): ════════════════════════════════════════════════════════════════════════════════════════════════════

I am using the latest flutter master and flutter doctor output is:

Doctor summary (to see all details, run flutter doctor -v): [✓] Flutter (Channel master, v0.10.2-pre.21, on Mac OS X 10.13.6 17G65, locale en-GB) [✓] Android toolchain - develop for Android devices (Android SDK 28.0.3) [✓] iOS toolchain - develop for iOS devices (Xcode 10.0) [✓] Android Studio (version 3.2) [✓] IntelliJ IDEA Community Edition (version 2018.2.3) [✓] Connected device (2 available)

Anyone have any clues?

3
dartflutter
try `flutter clean. – Günter Zöchbauer
Do you have other entries in assets in pubspec.yaml? – Günter Zöchbauer
did a flutter clean but no good and no other entries in the spec file – err
Can you share your directory snapshot? Where is this images directory placed? – aubykhan
@aubykhan I am using Android Studio and the images dir is at the same level as the pubspec.yaml file. I check in a terminal and its the same structure on the disk – err

3 Answers

0
votes

I had the same problem, but if I put images direcly inside assets folder its working justg fine. In this case you also need to change pubspec.yaml (assets: -ui.png) and then you can load the image with Image.asset('ui.png').

0
votes

make sure your indentation is done properly in your pubspec.yaml. Subcategory should be indented two spaces than it's parent category. PS: The dash counts as the first character in subcategory. According to flutter docs Adding assets and images indentation should be as following:

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

Specify Image path as follows

Image.asset("assets/images/car_android.png")

OR

Image(image: AssetImage("assets/images/car_android.png"))

The problem is flutter can't recognize where your image is exactly stored.

If the problem continues then try to do HOT RESTART this will solve your problem.

Update your pubspec.yaml file before this

If you update pubspec.yaml file then run flutter pub get to update the libraries if your IDE doesn't update it automatically.