Gif image is not working in android in react native

Question

Animation is not working in gif image in android

Android gif image without animation

Possible duplicate of [How to display GIF in react-native android app?](https://stackoverflow.com/questions/38169519/how-to-display-gif-in-react-native-android-app) — Laura, Oct 08 '19 at 20:58

Kishan Bharda · Answer 1 · 2021-11-25T10:56:55.757

29

For react native version>=0.60 :

When building your own native code, GIF and WebP are not supported by default on Android.

You will need to add some optional modules in android/app/build.gradle, depending on the needs of your app.

implementation 'com.facebook.fresco:fresco:2.0.0'
implementation 'com.facebook.fresco:animated-gif:2.0.0'

For latest react native version 0.66 :

implementation 'com.facebook.fresco:animated-gif:2.6.0'

edited Nov 25 '21 at 10:56

answered Oct 08 '19 at 09:47

Kishan Bharda

4,851
3
25
48

2

Where exactly are you supposed to put this? Do you first need to install a package? – kojow7 Nov 16 '19 at 21:10
6

Just put it in YourProject/android/app/build.gradle, under dependencies – Zvonimir Peran Nov 28 '19 at 14:12
This worked for me using react native 0.64.2 – Manuel Sansone Jun 25 '21 at 14:03
Not work after update react native 0.65 any update? – Mitesh jadav Oct 14 '21 at 09:50
Not working for react native 0.66 – Aakash Rathee Oct 24 '21 at 08:15
Use `implementation 'com.facebook.fresco:animated-gif:2.6.0'` for RN 0.66 – Annie Tan Nov 25 '21 at 09:14
1

Thank you @AnnieTan I have added this in my answer. – Kishan Bharda Nov 25 '21 at 10:57
Yes, working as well on RN 0.66 with `implementation 'com.facebook.fresco:animated-gif:2.6.0'`, Thanks @KishanBharda – DarkHorse Dec 15 '21 at 05:54

score 13 · Answer 2 · answered Sep 18 '18 at 17:34

13

Update: react-native@0.57.0

// For animated GIF support
// ./android/app/build.gradle

implementation 'com.facebook.fresco:fresco:1.10.0'
implementation 'com.facebook.fresco:animated-gif:1.10.0'

answered Sep 18 '18 at 17:34

wkoutre

195
3
4

i tried various libraries, just this works for me, react-version: 0.59.9, thanks – Elyas Nategh Jul 18 '19 at 06:43
https://facebook.github.io/react-native/docs/0.60/image#gif-and-webp-support-on-android – wkoutre Oct 09 '19 at 15:51

score 7 · Accepted Answer · answered May 25 '18 at 07:26

please follow the details in the FB docs it will specify the required things that you need.

You will need to add some optional modules in android/app/build.gradle, depending on the needs of your app.

dependencies {
  // If your app supports Android versions before Ice Cream Sandwich (API level 14)
  compile 'com.facebook.fresco:animated-base-support:1.3.0'

  // For animated GIF support
  compile 'com.facebook.fresco:animated-gif:1.3.0'

  // For WebP support, including animated WebP
  compile 'com.facebook.fresco:animated-webp:1.3.0'
  compile 'com.facebook.fresco:webpsupport:1.3.0'

  // For WebP support, without animations
  compile 'com.facebook.fresco:webpsupport:1.3.0'
}

Also, if you use GIF with ProGuard, you will need to add this rule in proguard-rules.pro :

-keep class com.facebook.imagepipeline.animated.factory.AnimatedFactoryImpl {
  public AnimatedFactoryImpl(com.facebook.imagepipeline.bitmaps.PlatformBitmapFactory, com.facebook.imagepipeline.core.ExecutorSupplier);
}

score 1 · Answer 4 · answered Jan 04 '22 at 11:55

For React Native version : 0.66.4

Add these below lines in android/app/build.gradle file,

  implementation 'com.facebook.fresco:fresco:2.0.0'
    // For animated GIF support

 implementation 'com.facebook.fresco:animated-gif:2.6.0'
    // For WebP support, including animated WebP

 implementation 'com.facebook.fresco:animated-webp:2.0.0'

 implementation 'com.facebook.fresco:webpsupport:2.0.0'

And Use it like:

<Image
   source={require('../assets/splah.gif')}
   style={{ width: '100%',height:'100%' }}
/>

Gif image is not working in android in react native

4 Answers4

Linked