如何在 react-native android 应用程序中显示 GIF? [英] How to display GIF in react-native android app?

问题描述

我想通过 URL 在我的 android react-native 应用程序中的图像标签中显示一个简单的 gif，但是当我启动它时没有显示图像.docs 中提供的代码仅适用于 iOS，但不适用于安卓:

这里有一个类似的问题，但正如已经说过的，这仅适用于 iOS:如何在 React Native 中显示动画 gif?
关于这个提交，它应该可以工作:https://github.com/facebook/react-native/commit/fcd7de5301655b4973dd8d4973d8eca72ecaf7e

解决方案

我们将 GIF 支持等内容设为可选，从而缩小了核心库.

因此 我们必须手动选择在 Android 中启用 gif 支持.将以下行添加到您的 android/app/build.gradle 文件中的依赖项下:

编译com.facebook.fresco:animated-gif:1.3.0"编译com.facebook.fresco:animated-base-support:1.3.0"

因此您的依赖项部分可能如下所示:

依赖项{编译文件树(目录:libs"，包括:[*.jar"])编译com.android.support:appcompat-v7:23.0.1"编译 "com.facebook.react:react-native:+"//从 node_modules编译com.facebook.fresco:animated-gif:1.3.0"编译com.facebook.fresco:animated-base-support:1.3.0"

这解决了您的调试版本的问题，但如果您想同时在您的发布版本中解决它，您必须将以下行添加到您的 proguard-rules 文件中:

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

这里有更多信息:https://github.com/facebook/fresco/issues/第1177章

此问题已通过此提交解决，并将包含在下一个版本中.

I want to display a simple gif via URL in my Image tag in my android react-native app but when I start it no image is shown. The code as provided in the docs does work only for iOS but not for android:

<Image
  style={styles.gif}
  source={{uri: 'http://38.media.tumblr.com/9e9bd08c6e2d10561dd1fb4197df4c4e/tumblr_mfqekpMktw1rn90umo1_500.gif'}}
/>

There was a similar question here but as already said this only works for iOS: How do I display an animated gif in React Native?
Regarding this commit it should work though: https://github.com/facebook/react-native/commit/fcd7de5301655b39832d49908e5ca72ddaf91f7e

解决方案

We made the core library smaller by making things like GIF support optional.

Because of that we have to manually opt-in for gif support in Android. Add both of the following lines to your android/app/build.gradle file under dependencies:

compile "com.facebook.fresco:animated-gif:1.3.0"
compile "com.facebook.fresco:animated-base-support:1.3.0"

So your dependencies section might look like this:

dependencies {
  compile fileTree(dir: "libs", include: ["*.jar"])
  compile "com.android.support:appcompat-v7:23.0.1"
  compile "com.facebook.react:react-native:+"  // From node_modules
  compile "com.facebook.fresco:animated-gif:1.3.0"
  compile "com.facebook.fresco:animated-base-support:1.3.0"

This solves the problem for your debug build but if you want to solve it also in your release build at them moment you have to add the following line to your proguard-rules file:

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

More information on this here: https://github.com/facebook/fresco/issues/1177

This was fixed with this commit and will be included in the next release.

这篇关于如何在 react-native android 应用程序中显示 GIF?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！