CODEWITHSUNDEEP
androidreact-native
pallav test
pallav test

Reputation: 223

Gif image is not working in android in react native

Animation is not working in gif image in android

Android gif image without animation

Upvotes: 15

Views: 25011

Answers (8)

Parth Adhikari
Parth Adhikari

Reputation: 21

Fresco updated it's versions so older versions are not working, for new versions - Visit fresco page here

dependencies {

// For animated GIF support implementation 'com.facebook.fresco:animated-gif:3.1.3'

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

// For WebP support, without animations implementation 'com.facebook.fresco:webpsupport:3.1.3'

// Provide the Android support library (you might already have this or a similar dependency) implementation 'com.android.support:support-core-utils:24.2.1' }

Upvotes: 0

Valdemar
Valdemar

Reputation: 91

Update for React Native version : 0.73

As I understood, RN 0.73 uses fresco 3.1, so I had to change version in ./android/app/build.gradle like that

// For animated GIF support
implementation ("com.facebook.fresco:animated-gif:3.1.0")

That worked for me

Upvotes: 9

Ali Raza Khan
Ali Raza Khan

Reputation: 138

I have resolved my issue by doing this in android/app/build.gradle

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

Upvotes: 2

Gaurav Rathore
Gaurav Rathore

Reputation: 11

Add the Following line on android/app/build.gradle

 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'
}

Upvotes: 0

Mohit thakur
Mohit thakur

Reputation: 59

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%' }}
/>

Upvotes: 6

Kishan Bharda
Kishan Bharda

Reputation: 5700

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'

Upvotes: 43

wkoutre
wkoutre

Reputation: 304

Update: [email protected]

// 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'

Upvotes: 13

Prince
Prince

Reputation: 851

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);
}

Upvotes: 11

Related Questions