GIF 图像未在 react-native 中显示动画

Question

我在 react-native 中遇到 gif 图像的问题。如何在 react native 中使用 gif 图像。这是我的代码，我已将图像放在 images.js 文件中。

Answer 1

以前我修复了在 ReactNative 中显示 gif 图像的问题。如果您按照以下步骤操作，您也可以解决此问题，

默认情况下，Android React Native 应用程序不支持 Gif 图像。您需要设置使用 Fresco 来显示 gif 图像。编码：

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.+' 

}

然后您需要再次捆绑应用程序，您可以通过两种方式显示gif图像。

对于 RN >= 0.60

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

 implementation 'com.facebook.fresco:animated-gif:2.0.0'   //use
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 }} 
/>

我希望它对其他人有帮助

Answer 2

就像其他资产图像一样：

<Image
  source={require('./images/loading.gif')}
  style={{height: 200, width: 200}}
  resizeMode='contain'
/>

注意：Android版本需要开启GIF支持