如何在React Native Fast Image中启用动画webp(awebp)?

zdwk9cvp  于 2023-08-07  发布在  React
关注(0)|答案(2)|浏览(151)

我们有animated webp files working great in our React Native app,使用默认的<Image>组件。
我们希望能从react-native-fast-image中内置的一些额外缓存中受益。但是,它对所有东西都很好用除了awebp文件;我们有很多。
the github issues中有很多解决方案,但我们无法让它们中的任何一个工作。
有没有一个经过验证的方法让awebp工作?

bvpmtnay

bvpmtnay1#

我已经为Expo创建了一些配置插件(一个基于您的工作),这可能会有所帮助:
https://gist.github.com/Hirbod/07c6641970c9406ff35a7271dda1f01c
使用FastImage添加对动画webP的支持非常简单。配置插件只是在AppDelegate.m中添加3行代码,在android/app/build.gradle中添加一行实现代码
这就是FastImage对动画webp的支持。
TL;DR:
Android:将以下内容添加到您的android/app/build.gradle

implementation "com.github.zjupure:webpdecoder:2.0.4.12.0

字符串
iOS:打开AppDelegate.m,在第一个AppDelegate. h导入后,添加以下内容:

#import "SDImageCodersManager.h"
#import <SDWebImageWebPCoder/SDImageWebPCoder.h>


向下滚动一点(相同的文件),直到您找到此启动标识符:

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {


并在{:

[SDImageCodersManager.sharedManager addCoder: SDImageWebPCoder.sharedCoder];


就是这样。重新构建你的项目(重新运行gradlew),你就有了FastImage动画webP支持。
P.S:当你在Android上需要APNG +动画webP支持时,添加这个实现:

implementation 'com.github.penfeizhou.android.animation:glide-plugin:2.17.0'

8aqjt8rx

8aqjt8rx2#

现在有expo-image。使用它,忘记所有的头痛。
https://docs.expo.dev/versions/unversioned/sdk/image/


的数据

相关问题