詳解Android官推Kotlin-First的圖片加載庫(kù)
前言
Coil 是一個(gè)非常年輕的圖片加載庫(kù),在 2020 年 10 月 22 日才發(fā)布了 1.0.0 版本,但卻受到了 Android 官方的推廣,在 Android Developers Backstage 這個(gè)博客中專(zhuān)門(mén)聊過(guò)一期。推廣的原因比較簡(jiǎn)單:一方面是這個(gè)庫(kù)確實(shí)做得很好,另一方面是這個(gè)庫(kù)完全是用 Kotlin 寫(xiě)的,而且運(yùn)用了大量 Kotlin 的特性,尤其是協(xié)程。所以 Google 嘴上說(shuō)著不會(huì)放棄 Java,但實(shí)際上咱們都懂的。
Coil 名字的由來(lái):取 Coroutine Image Loader 首字母得來(lái),可以看出通過(guò) Kotlin 協(xié)程來(lái)進(jìn)行圖片加載,特點(diǎn)如下:
- 更快:Coil 在性能上有很多優(yōu)化,包括內(nèi)存緩存和磁盤(pán)緩存、把縮略圖保存在內(nèi)存中、通過(guò) BitmapPool 循環(huán)利用 Bitmap、自動(dòng)暫停和取消網(wǎng)絡(luò)請(qǐng)求等
- 更輕量級(jí):Coil 只有 2000 個(gè)方法,跟 Picasso 的方法數(shù)差不多,相比 Glide 和 Fresco 要輕量非常多
- 更容易使用:Coil 的 API 充分利用 Kotlin 的新特性,而且還有豐富的拓展函數(shù),簡(jiǎn)化和減少了很多樣板代碼
- 更流行:Coil 通過(guò) Kotlin 來(lái)開(kāi)發(fā),并且使用包含 Coroutines、okhttp、okio 和 AndroidX Lifecycles 在內(nèi)的非常多流行的開(kāi)源庫(kù)
從 Coil 的特性可以看出,這是一個(gè)非常適合個(gè)人 App 使用的圖片加載庫(kù),特別是純 Kotlin 開(kāi)發(fā)的 App。而且 Coil 里面運(yùn)用了大量 Kotlin 的新特性以及協(xié)程,對(duì)于我們學(xué)習(xí) Kotlin 有非常大的價(jià)值。相比于 glide 和 fresco 有著非常復(fù)雜的結(jié)構(gòu)和驚人的代碼量,Coil 只有 2000 左右的方法數(shù),所以也很適合進(jìn)行源碼研究和學(xué)習(xí),
基本使用
Coil 可以在 mavenCentral() 下載:
- implementation("io.coil-kt:coil:1.1.1")
Coil 給 ImageView 加了很多拓展函數(shù),所以我們一行代碼便能進(jìn)行圖片加載:
- // URL
- imageView.load("https://www.example.com/image.jpg")
- // Resource
- imageView.load(R.drawable.image)
- // File
- imageView.load(File("/path/to/image.jpg"))
同時(shí)我們也可以使用 lambda 語(yǔ)法輕松進(jìn)行圖片加載的配置:
- imageView.load("https://www.example.com/image.jpg") {
- crossfade(true)
- placeholder(R.drawable.image)
- transformations(CircleCropTransformation())
- }
常用的 API
ImageLoader
ImageLoader 是 Coil 中對(duì)于圖片加載的大管家,負(fù)責(zé)處理緩存、數(shù)據(jù)獲取、圖像解碼、請(qǐng)求管理、Bitmap 緩存池、內(nèi)存管理等工作,一般建議只創(chuàng)建一個(gè) ImageLoader 并在 App 中進(jìn)行共享,這樣性能是最優(yōu)的。這是因?yàn)槊總€(gè) ImageLoader 都有自己的內(nèi)存緩存和 Bitmap 緩存池。
我們可以通過(guò)構(gòu)造器來(lái)創(chuàng)建和配置 ImageLoader。
- val imageLoader = ImageLoader.Builder(context)
- .availableMemoryPercentage(0.25)
- .crossfade(true)
- .build()
同時(shí)由于 ImageLoader 是一個(gè)接口,也就意味著我們可以非常方便地進(jìn)行測(cè)試,例如可以注入一個(gè) fake 的 ImageLoader,從而每次都返回相同的 drawable。
- val fakeImageLoader = object : ImageLoader {
- private val drawable = ColorDrawable(Color.BLACK)
- override fun enqueue(request: ImageRequest): Disposable {
- request.target?.onStart(drawable)
- request.target?.onSuccess(drawable)
- return disposable
- }
- override suspend fun execute(request: ImageRequest): ImageResult {
- return SuccessResult(
- drawable = drawable, request = request,
- metadata = ImageResult.Metadata(
- memoryCacheKey = MemoryCache.Key(""),
- isSampled = false,
- dataSource = DataSource.MEMORY_CACHE,
- isPlaceholderMemoryCacheKeyPresent = false
- )
- )
- }
- }
ImageRequest
ImageRequest 為 ImageLoader 加載圖片提供所有的必要信息,同時(shí)我們也可以使用自定義的 Target 進(jìn)行處理。
- val request = ImageRequest.Builder(context)
- .data("https://www.example.com/image.jpg")
- .target { drawable ->
- // Handle the result.
- }
- .build()
- context.imageLoader.enqueue(request)
ImageRequest 基于 Builder 模式來(lái)進(jìn)行創(chuàng)建,包含了加載圖片的各個(gè)配置項(xiàng),這里重點(diǎn)看下最常用的配置項(xiàng)。
Disposable
Disposable 是調(diào)用 load() 方法之后的返回值,主要是用于取消圖片加載:
- interface Disposable {
- /**
- * 如果圖片加載請(qǐng)求已經(jīng)完成或者取消,則返回 true
- */
- val isDisposed: Boolean
- /**
- * 取消正在進(jìn)行的圖片加載請(qǐng)求以及釋放相關(guān)的資源,而且該方法是冪等的
- */
- fun dispose()
- /**
- * 非阻塞式地等待任務(wù)結(jié)束
- */
- @ExperimentalCoilApi
- suspend fun await()
- }
圖片變換
圖片變換是圖片加載庫(kù)中很常見(jiàn)的功能,Coil 將其抽象成 Transformation 接口,可以看到在 transform() 方法中有一個(gè) BitmapPool 參數(shù),這是因?yàn)樵趯?shí)現(xiàn)圖形變換的時(shí)候往往需要一個(gè) Bitmap,此時(shí)可以直接在 BitmapPool 中獲取,從而復(fù)用已有的 Bitmap。
- interface Transformation {
- fun key(): String
- suspend fun transform(pool: BitmapPool, input: Bitmap, size: Size): Bitmap
- }
- imageView.load("https://www.example.com/image.jpg") {
- transformations(CircleCropTransformation())
- }
Coil 主要提供了這幾個(gè)圖片變換的效果:
功能拓展
Coil 在提供了很多必要功能的基礎(chǔ)上,預(yù)留了很多的拓展點(diǎn)給開(kāi)發(fā)者實(shí)現(xiàn)自定義。Coil 的圖片加載主要包括四個(gè)主要的模塊:
Interceptors
Coil 的 Interceptor 無(wú)疑是借鑒了 okhttp 的設(shè)計(jì)思路,極大方便了后續(xù)的功能拓展,例如我們可以給 Coil 添加一個(gè)自定義的緩存層:
- class CustomCacheInterceptor(
- private val context: Context,
- private val cache: LruCache<String, Drawable>
- ) : Interceptor {
- override suspend fun intercept(chain: Interceptor.Chain): ImageResult {
- val value = cache.get(chain.request.data.toString())
- if (value != null) {
- return SuccessResult(
- drawable = value.bitmap.toDrawable(context),
- request = chain.request,
- metadata = TODO()
- )
- }
- return chain.proceed(chain.request)
- }
- }
Mappers、Fetchers
外部在調(diào)用 load() 時(shí),傳入的 String 參數(shù)既可能指向本地資源文件,也可能指向網(wǎng)絡(luò)圖片,Mappers 和 Fetchers 搭配使用,可以對(duì)資源類(lèi)型進(jìn)行區(qū)分,舉個(gè)例子:
- imageView.load("android.resource://example.package.name/drawable/image")
- imageView.load("https://www.example.com/image.jpg")
StringMapper 會(huì)將傳入的 String 轉(zhuǎn)換為對(duì)應(yīng)的 Uri。
- internal class StringMapper : Mapper<String, Uri> {
- override fun map(data: String) = data.toUri()
- }
ResourceUriFetcher 會(huì)判斷 Uri 的 scheme 類(lèi)型是否為 android.resource,是的話(huà)代表本地資源文件,而 HttpUriFetcher 則判斷 Uri 的 scheme 是否為 http 或 https,是的話(huà)代表網(wǎng)絡(luò)圖片。
- internal class HttpUriFetcher(callFactory: Call.Factory) : HttpFetcher<Uri>(callFactory) {
- override fun handles(data: Uri) = data.scheme == "http" || data.scheme == "https"
- override fun key(data: Uri) = data.toString()
- override fun Uri.toHttpUrl(): HttpUrl = HttpUrl.get(toString())
- }
Decoders
Android 支持了很多圖像格式,但也有很多它不支持的格式(例如:Gif、SVG、視頻幀等),所以 Coil 便提供了對(duì)應(yīng)的拓展庫(kù)。
① Gif(GifDecoder 支持所有 API 級(jí)別,但速度較慢,ImageDecoderDecoder 的加載速度快,但僅在 API 28 及更高版本可用)
- implementation("io.coil-kt:coil-gif:1.1.1")
- val imageLoader = ImageLoader.Builder(context)
- .componentRegistry {
- if (SDK_INT >= 28) {
- add(ImageDecoderDecoder())
- } else {
- add(GifDecoder())
- }
- }
- .build()
② SVG(如果請(qǐng)求的 MIME 類(lèi)型是 image/svg+xml,則會(huì)自動(dòng)檢測(cè)并解碼所有 SVG)
- implementation("io.coil-kt:coil-svg:1.1.1")
- val imageLoader = ImageLoader.Builder(context)
- .componentRegistry {
- add(SvgDecoder(context))
- }
- .build()
③ 視頻幀(僅支持 File 和 Uri)
- implementation("io.coil-kt:coil-video:1.1.1")
- val imageLoader = ImageLoader.Builder(context)
- .componentRegistry {
- add(VideoFrameFileFetcher())
- add(VideoFrameUriFetcher())
- }
- .build()