Flutter: Could not instantiate image codec when calling Image.memory

Question

I want to create a simple profile picture for my app. I thought it would work like this, but it throws an exception when calling it and I can't figure out why.

Widget _buildProfilePicture(double size) {
      if (user.profileImage != null) {
        return ClipRRect(
          borderRadius: BorderRadius.circular(8.0),
          child: Image.memory(
            user.profileImage,
            width: size,
            height: size,
          ),
        );
      }
}

The attribute user.profileImage has the datatype Uint8List.

When I call it, it throws this exception:

════════ Exception caught by image resource service ════════════════════════════════════════════════
The following _Exception was thrown while resolving an image:
Exception: Could not instantiate image codec.

When the exception was thrown, this was the stack: 
#0      _futurize (dart:ui/painting.dart:4304:5)
#1      instantiateImageCodec (dart:ui/painting.dart:1682:10)
#2      PaintingBinding.instantiateImageCodec (package:flutter/src/painting/binding.dart:88:12)
#3      MemoryImage._loadAsync (package:flutter/src/painting/image_provider.dart:714:18)
#4      MemoryImage.load (package:flutter/src/painting/image_provider.dart:706:14)
...
Image provider: MemoryImage(Uint8List#2592a, scale: 1.0)
Image configuration: ImageConfiguration(bundle: PlatformAssetBundle#633d8(), devicePixelRatio: 2.6, locale: en_US, textDirection: TextDirection.ltr, size: Size(50.0, 50.0), platform: android)
Image key: MemoryImage(Uint8List#2592a, scale: 1.0)

I think it's caused by Image.memory.

Thanks for answers in advance!

Solution 1

I ran into the exact same problem. The image was a png file that was properly 'loaded' in the pubspec file. However I got the same error:

Exception: Could not instantiate image codec.

It turned out the image was corrupted. Replacing the image solved it for me.

Solution 2

It could be that you have to encode it to an appropriate type with https://pub.dev/packages/image like:

    import 'package:image/image.dart' as imageUtils;

    var encodedImage = Image.memory(
                    imageUtils.encodePng(user.profileImage));

Solution 3

I was having a similar exception when trying to load the contacts avatar using Image.memory. It basically takes in Uint8List as the input source.

And I found that you receive that exception when the list is empty(length=0). so you can prevent that exception by putting a check something like this

Widget myAvatarWidget(){
    final imageBytes = contact.avatar;
    return imageBytes == null || imageBytes.length == 0
           ? showDefaultWidget(path: profileUrl, radius: 30.0)
           : ClipRRect(
               borderRadius: BorderRadius.circular(30.0),
               child: Image.memory(imageBytes)
             );
 }

Comments

[Richard Heap]

It probably not one of the supported formats, like BMP, PNG or JPEG.

[hanslissi]

I retrieve my image from a server and I get content-type: [image/png] as the content-type, so it should be a png right?

[pskink]

what are the first 8 bytes of user.profileImage? in hex? is it 89 50 4E 47 0D 0A 1A 0A? if not, compare them with en.wikipedia.org/wiki/List_of_file_signatures

[Richard Heap]

If the image is coming from the network, try Image.network

[hanslissi]

Ok, so I think it may be that the image i get from the server is corrupted, but I'm not quite sure yet.

[hanslissi]

By the way, the image was corrupted.

[vannak]

I have the same problem

[hanslissi]

Yes that was the problem with mine too!