CODEWITHSUNDEEP
flutterflutter-web
Cyrus the Great
Cyrus the Great

Reputation: 5922

ImageCodecException was thrown resolving an image codec

I am using 1.27.0-4.0.pre sdk version to my flutter pwa. Before upgrading I used 1.24.0-10.2.pre sdk version. in 1.24.0-10.2.pre version everything was good and I don't have any problem is showing svg image with Image.network. But now When I launch my pwa None of my Image is shown ?

enter image description here

This read squarer appear instead of image . And I get this error on console:

══╡ EXCEPTION CAUGHT BY IMAGE RESOURCE SERVICE ╞════════════════════════════════════════════════════
The following ImageCodecException was thrown resolving an image codec:
Failed to decode image data.
Image source: http://localhost:33033/assets/svgs/splash.svg

When the exception was thrown, this was the stack:
dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 236:49      throw_
lib/_engine/engine/canvaskit/image.dart 102:7                                     createDefault
lib/_engine/engine/canvaskit/skia_object_cache.dart 141:41                        new
lib/_engine/engine/canvaskit/image.dart 92:3                                      decodeFromBytes
lib/_engine/engine/canvaskit/image.dart 75:53                                     <fn>
dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/operations.dart 324:14  _checkAndCall
dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/operations.dart 329:39  dcall
dart-sdk/lib/html/dart2js/html_dart2js.dart 37283:58                              <fn>
dart-sdk/lib/async/zone.dart 1370:13                                              _rootRunUnary
dart-sdk/lib/async/zone.dart 1265:19                                              runUnary
dart-sdk/lib/async/zone.dart 1170:7                                               runUnaryGuarded
dart-sdk/lib/async/zone.dart 1207:26                                              <fn>

Image provider: NetworkImage("assets/svgs/splash.svg", scale: 1)
Image key: NetworkImage("assets/svgs/splash.svg", scale: 1)

When I open http://localhost:33033/assets/svgs/splash.svg on chrome, this image exist and is loaded. What is a problem?

Upvotes: 10

Views: 9453

Answers (2)

Balaji N
Balaji N

Reputation: 11

I have resolved this issue by seen this video "https://www.youtube.com/watch?v=U0Ez4CS6frc".

option 1: "flutter run -d chrome --web-renderer html"

option2: in the Andriod Studio application go to : Run -> Edit Configuration. in the Arguments type inputbox put this line "--web-renderer html"

[ here is the screen shot of option2 ] [1]: https://i.sstatic.net/ZDB8I.png

Upvotes: 1

Christopher Moore
Christopher Moore

Reputation: 17113

SVGs are not supported by Flutter by default. If it worked in the past, you were likely using the HTML web renderer where you can get away with using SVG a little bit, but it's not made to do that so there are issues with it.

I see that you're now using the CanvasKit renderer, which likely treats images differently than the HTML renderer and removes any possibility of using SVGs.

You can use the flutter_svg package and use only the CanvasKit renderer to possibly reliably use SVGs.

Upvotes: 6

Related Questions