Animation is not working in gif image in android
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.
Now, react-native has that flexibility to support GIFs.
To render an animated gif in a React component: Import the gif as import myGif from './path-to-my-gif. gif' . Add an img element that shows the gif, e.g. <img src={myGif} alt="" /> .
The JavaScriptvar gif = getGif(); We run the function and save the output in a variable gif , as above. The gif variable now contains the path of the GIF from the images in the page.
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'
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%' }}
/>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With