How do I display an animated gif in React Native?

How can I display an animated gif in react native. This is what I've tried.

<Image source={{uri: "loading"}} />

It works fine with a .png file but when I use a .gif file it's blank. I read somewhere to try renaming the .gif to a .png but that just displays one frame of the animated gif with no animation. Any ideas?

For RN < 0.60

By default the Gif images are not supported in android react native app. You need to set use Fresco to display the gif images. The code:

Edit your android/app/build.gradle file and add the following code:

dependencies: { 

    ...

    compile 'com.facebook.fresco:fresco:1.+'

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

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

then you need to bundle the app again, You can display the gif images in two ways like this.

1-> <Image 
        source={require('./../images/load.gif')}  
        style={{width: 100, height: 100 }}
    />

2-> <Image 
        source={{uri: 'http://www.clicktorelease.com/code/gif/1.gif'}}  
        style={{width: 100, height:100 }} 
    />

For RN >= 0.60

implementation 'com.facebook.fresco:animated-gif:1.12.0' //instead of

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

I hope it is helpful to others,

You need to add the extension and require it this way :

<Image source={require('./path/to/image/loading.gif')} />

or

<Image source={{uri: 'http://www.urltogif/image.gif'}} />

For React Native 0.60 and higher

Open your android/app/build.gradle file and add following lines to first of dependencies section

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

And then

cd android
gradlew clean
react-native run-android

For me on React native 0.65.1 The solution in react-native docs did not work I had to use the latest version of Fresco:

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

Now GIF works on Android for me.

You can check Fresco latest from their website.