Open pewh opened 6 years ago
Just after some more tests, showing webp
on android seems not supported but works fine on iOS.
Yeah I think the current answer is probably a no. If you want to make a case for adding support a new issue can be opened.
Animated gifs are supported, maybe you can use those.
I'm going to turn this issue into a feature request. Seems like it might be possible at some point.
@peteroid Hi there, could you please give more information about your tests? I can't display any webp image in my project.
I ejected my project to pure RN, generated Podfile with pod 'SDWebImage/WebP'
and built it with Xcode. My test is very simple:
import React from 'react';
import FastImage from 'react-native-fast-image';
const source = {
uri: 'https://user-gold-cdn.xitu.io/2017/12/28/1609d17b5af17a56?w=534&h=300&f=webp&s=39334',
};
export default () => (
<FastImage source={source} />
);
It shows nothing.
I also use FastImage
in the same project for remote JPGs and local GIFs and it works well with them. So I am wondering did I miss something?
BTW, I tried the native code with SDWebImage it works fine:
Podfile
project './test-webp.xcodeproj/'
platform :ios, '10.0'
target 'test-webp' do
use_frameworks!
pod 'SDWebImage' pod 'SDWebImage/WebP'
end
> `ViewController.swift`
```swift
import UIKit
import SDWebImage
class ViewController: UIViewController {
@IBOutlet weak var imgView: UIImageView!
override func viewDidLoad() {
super.viewDidLoad()
imgView.sd_setImage(with: URL(string: "https://user-gold-cdn.xitu.io/2017/12/28/1609d17b5af17a56?w=534&h=300&f=webp&s=39334"));
// Do any additional setup after loading the view, typically from a nib.
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
Animated WebP works well in iOS currently. It does not work well on Android. We rely on Glide for support though so it doesn't seem possible to fix on our end.
Adding the following to the build.gradle adds WebP support:
def GLIDE_VERSION = "4.9.0" // Needs to match the one defined in Fast Image build.gradle
implementation "com.zlc.glide:webpdecoder:1.6.${GLIDE_VERSION}"
are we be able to use animated WebP on Android now ?
@acerbastimur
I got it working based on this PR (#542) (React-Native 0.61.5)
I added the following to android/app/build.gradle
implementation "com.zlc.glide:webpdecoder:1.5.4.9.0"
Note: If this library ups its version you'll have to match the 4.9.0
part. Any future googlers refer to this line in the build.grade (or refer to this file for the most recent version).
Specifically
def _glideVersion = safeExtGet("glideVersion", "4.9.0")
Here is a list of glide webpdecoder versions: https://mvnrepository.com/artifact/com.zlc.glide/webpdecoder
If any Expo user needs this, I've prepared some config-plugins for you: https://gist.github.com/Hirbod/07c6641970c9406ff35a7271dda1f01c
Just wanted to inform, the library has changed their group id, you now need to put this:
implementation "com.github.zjupure:webpdecoder:2.1.${GLIDE_VERSION}"
FastImage 8.6 uses glide version 4.12.0 -> https://github.com/DylanVann/react-native-fast-image/blob/9ab80fcd570b7f56da66ab20e52c9a35934067c9/android/build.gradle#L60 The webp decoder library suggest to use 2.3.(glide version). read at https://github.com/zjupure/GlideWebpDecoder
And the version compatibility list on https://mvnrepository.com/artifact/com.github.zjupure/webpdecoder : 2.3.x
4.13.2 4.14.2 4.15.1
and if we consider glide version used in FastImage then compatible versions are.
if keep the 4.12.0 as used in FastImage 8.6.3 then the valid version numbers of com.github.zjupure:webpdecoder:
are
2.0 : 2.0.4.12.0 2.1 : 2.1.4.12.0 2.2 : 2.2.4.12.0
I tried both type of versions nothing worked.
Maybe I'm wrong, but from the readme.md:
The version rule of GlideWebpDecoder is "{major_version}.{glide_version}". For example, if you use glide 4.15.0, the corresponding version of GlideWebpDecoder should be 2.0.4.15.0
Library will only follow the latest three version of Glide. If you use a lower version glide, please clone the project and modify it yourself.
So 2.3.4.12.x (or some later major version version with ...12.x) would need to be cloned and modified, unless Fastimage can use 4.15.1 (or 4.13.1 at least).
This solution works like a charm. 👍🏼 🍭 😃
def glideVersion = safeExtGet('glideVersion', '4.12.0')
implementation "com.github.zjupure:webpdecoder:2.2.${glideVersion}"
(supports APNG, AWEBP, AVIF, GIF)
implementation 'com.github.penfeizhou.android.animation:glide-plugin:2.28.0'
// Check the official documentation for the specific decoder.
Glide 4.14.0 : changelog
Enable animated WebP Decoding on P+ using framework APIs
Changing Glide version to 4.14.0 or 4.16.0(I have tried) in gradle of FastImage supports animated webp without any third party plugins
- For Android P+
def glideVersion = safeExtGet('glideVersion', '4.16.0')
...
- For older Android versions compatibility,
use webpdecoder with Glide 2.16.0
implementation "com.github.zjupure:webpdecoder:2.6.${glideVersion}"
Troubleshooting
In my app, the animation does not start even after adding plugins or using Glide version 4.16.0
. I found that using cache:'web'
starts the animation.
<FastImage source={{uri: uri, cache: 'web'}}/>
Hi, as stated in README.md of this library, this is just wrapper around SDWebImage for iOS, which claims to support animated WebP, and Glide for Android, which seems to be problematic. You can give it a try and let others know.