使用 Fresco 加載 WebP 動圖設置循環次數

時間 2019-11-06

標籤使用 fresco 加載 webp 設置循環次數简体版

原文原文鏈接

背景

前幾天作一個需求，社區文章若是是視頻類型，須要在文章列表播放視頻預覽動圖。java

這裏咱們使用了視頻部門的服務，生成視頻預覽，對方給出的可選格式爲 webp、mp四、flv、hls，後面三個都是視頻格式，確定不能做爲預覽圖，並且考慮到 webp 有用較小的體積，咱們使用的 fresco 也支持 WebP 的動圖，所以果斷選擇了 WebP 格式。git

fresco 加載動圖的方法github

val uri = Uri.parse("http://voddafz06jj.vod.126.net/voddafz06jj/videoPreview_1821338293_IQAB9DSR.webp")
val controller = Fresco.newDraweeControllerBuilder()
        .setUri(uri)
        .setAutoPlayAnimations(true)
        .build()
drawee_view.controller = controller
複製代碼

看起來好像沒什麼問題，但是等開發完成拿給產品看的時候，產品不樂意了，這個動圖怎麼只能播放一次呢，我須要循環播放。web

趕忙去補了下課，原來 WebP 動圖是能夠設置循環次數的，詢問了視頻部門的同事，原來是他們生成的預覽圖沒有設置循環播放屬性，坑爹。。bash

而視頻部門也須要排期來支持預覽圖循環屬性，只能這樣告訴產品了，產品果真仍是不滿意，「我無論，我就要無限循環播放！」ide

只能硬着頭皮搞了oop

社區尋找幫助

果真找到了一個相似的問題ui

github.com/facebook/fr…spa

emm..不過這位仁兄遇到的問題是圖片的循環次數是1，但是使用 fresco 卻無限循環播放，並且這位仁兄使用的是 gif 動圖，這就尷尬了，不過這些都不重要，根本問題是一致的，就是要強行設置動圖的播放次數，繼續往下看，找到一條點贊數比較多的回答.net

趕忙試一下，納尼，怎麼仍是隻放一遍？

仔細看了一下，這位仁兄的版本是 0.10.0，而咱們用的版本是 1.2.0，看起來應該是 fresco 改了代碼

因而看了下源碼，果真不叫 mTotalLoops，改成 mLoopCount 了

趕快修改代碼，再試一次，此次果真能夠了

上代碼

val uri = Uri.parse("http://voddafz06jj.vod.126.net/voddafz06jj/videoPreview_1821338293_IQAB9DSR.webp")
val controller = Fresco.newDraweeControllerBuilder()
        .setUri(uri)
        .setAutoPlayAnimations(true)
        .setControllerListener(object : BaseControllerListener<ImageInfo>() {
            override fun onFinalImageSet(id: String?, imageInfo: ImageInfo?, animatable: Animatable?) {
                try {
                    if (imageInfo is CloseableAnimatedImage) {
                        val animatedImage = imageInfo.image
                        if (animatedImage is WebPImage) {
                            if (animatable != null) {
                                val field = AbstractAnimatedDrawable::class.java.getDeclaredField("mLoopCount")
                                field.isAccessible = true
                                field.set(animatable, Integer.MAX_VALUE)
                            }
                        }
                    }
                } catch (e: Throwable) {
                    e.printStackTrace()
                }
            }
        })
        .build()
drawee_view.controller = controller
複製代碼

這裏只針對 webp 圖片設置無限循環，以避免影響 gif 圖片。