How do i add a gif in flutter

Question

I'm trying to add a gif from the local assets folder. Flutter throws an error named "login.gif" even though I checked multiple times if my folder structure or file name or path is correct or not or I didn't imported the path in the pubspec.yaml. But there's not a single mistake.. Tried searching for the answer everywhere but couldn't solve the issue! I'm a complete beginner in flutter...

home: const Scaffold(
    body: SafeArea(
      child: Image(
        image: AssetImage('login.gif'),
      ),
    ),
  ),

pubspec.yaml file:

  assets:
    - assets/images/

The Error:

======== Exception caught by image resource service 
================================================
The following assertion was thrown resolving an image codec:
Unable to load asset: /login.gif
<asynchronous suspension>
Image provider: AssetImage(bundle: null, name: "login.gif")
Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#08feb(), name: 
"login.gif", scale: 1.0)

Show your folder structure – Alex Rintt Aug 06 '22 at 20:06 — Alex Rintt, Aug 06 '22 at 20:06

score 1 · Answer 1 · answered Aug 06 '22 at 20:09

1

Try using:

AssetImage('assets/images/login.gif'),

You must include the key used in the pubspec.yaml to load your asset.

answered Aug 06 '22 at 20:09

Alex Rintt

1,618
1
11
18

score 1 · Accepted Answer · answered Aug 07 '22 at 04:02

1

Change

image: AssetImage('login.gif')

to

image: AssetImage('assets/images/login.gif')

If this doesn't solve your issue,

Follow this question : how to display animated gif in flutter?

answered Aug 07 '22 at 04:02

krishnaacharyaa

14,953
4
49
88

score 0 · Answer 3 · answered Aug 06 '22 at 23:57

0

Try below code:

Image.asset("assets/images/login.gif",
                gaplessPlayback: true, fit: BoxFit.fill)

answered Aug 06 '22 at 23:57

Rohan Jariwala

1,564
2
7
24

How do i add a gif in flutter

3 Answers3