1、前言
系列文章
5分钟学会设计模式之策略模式(Strategy Pattern)
上一篇,我们举例一个View的例子,可能不是很清晰,所以根据公司用的图片加载Glide来封装一个图片加载框架,非常的简洁易懂~
有时候Glide已经不能完全满足需求,或者出现了一些性能或稳定性问题。这时候,如果我们在代码中直接使用了特定的框架,那么我们需要对整个应用程序进行修改,这将会带来很大的风险和困难。对于图片加载框架来说,我们需要封装一些抽象的接口,使得我们可以在不影响应用程序其他部分的情况下,轻松更换底层的图片加载库。同时,我们还需要将图片加载的逻辑封装在一个独立的模块中,使得我们可以单独对其进行更新和维护。
如果您有任何疑问、对文章写的不满意、发现错误或者有更好的方法,欢迎在评论、私信或邮件中提出,非常感谢您的支持。🙏
2、抽象行为(策略接口)
IImageEngine接口就是策略接口,定义了加载图片的三个方法:loadResource、loadUrl和loadBitmap。它抽象出了不同的图片加载库所需实现的核心功能,并为具体策略提供了统一的方法签名。
interface IImageEngine {
/**
* 给定的资源 ID 加载一个图片资源
*/
fun loadResource(
view: ImageView?,
@DrawableRes resourceId: Int,
radius: Int = 0,
callback: ImageLoadCallback?
)
/**
* 指定的 URL 加载一张图片
*/
fun loadUrl(view: ImageView?, url: String, radius: Int = 0, callback: ImageLoadCallback?)
/**
* 从指定的 URL 加载一张图片,并返回一个 Bitmap 对象。
*/
fun loadBitmap(context: Context, url: String, radius: Int = 0, callback: ImageLoadCallback?)
}
3、加载回调
当然,所有的加载,不会总是一帆风顺,所以我们需要一个加载回调
interface ImageLoadCallback {
fun onSuccess(resource: Bitmap?) {}
fun onLoadStarted(placeholder: Drawable?) {}
fun onLoadFailed(errorDrawable: Drawable?) {}
}
4、GlideEngine实现
GlideEngine是实现了IImageEngine接口的具体实现类,我们通过阅读代码就可以得知
internal object GlideEngine : IImageEngine {
override fun loadResource(
view: ImageView?,
resourceId: Int,
radius: Int,
callback: ImageLoadCallback?
) {
view?.run {
Glide.with(this)
.load(resourceId).also {
if (radius > 0) {
it.apply(RequestOptions().transform(RoundedCorners(radius)))
}
}.into(createTarget(view, callback))
}
}
override fun loadUrl(
view: ImageView?,
url: String,
radius: Int,
callback: ImageLoadCallback?
) {
view?.run {
Glide.with(context).load(url).also {
if (radius > 0) {
it.apply(RequestOptions().transform(RoundedCorners(radius)))
}
}.into(createTarget(view, callback))
}
}
override fun loadBitmap(
context: Context,
url: String, radius: Int,
callback: ImageLoadCallback?
) {
Glide.with(context).asBitmap().load(url).also {
if (radius > 0) {
it.apply(RequestOptions().transform(RoundedCorners(radius)))
}
}.into(createBitmapTarget(callback))
}
private fun createTarget(
view: ImageView?,
callback: ImageLoadCallback?
): CustomTarget<Drawable> {
return object : CustomTarget<Drawable>() {
override fun onResourceReady(resource: Drawable, transition: Transition<in Drawable>?) {
view?.setImageDrawable(resource)
callback?.onSuccess(null)
}
override fun onLoadStarted(placeholder: Drawable?) {
callback?.onLoadStarted(placeholder)
}
override fun onLoadFailed(errorDrawable: Drawable?) {
callback?.onLoadFailed(errorDrawable)
}
override fun onLoadCleared(placeholder: Drawable?) {}
}
}
private fun createBitmapTarget(callback: ImageLoadCallback?): CustomTarget<Bitmap> {
return object : CustomTarget<Bitmap>() {
override fun onResourceReady(resource: Bitmap, transition: Transition<in Bitmap>?) {
callback?.onSuccess(resource)
}
override fun onLoadStarted(placeholder: Drawable?) {
callback?.onLoadStarted(placeholder)
}
override fun onLoadFailed(errorDrawable: Drawable?) {
callback?.onLoadFailed(errorDrawable)
}
override fun onLoadCleared(placeholder: Drawable?) {}
}
}
}
5、COilEngine实现
COilEngine是实现了IImageEngine接口的具体实现类,我们通过阅读代码就可以得知
class COilEngine : IImageEngine {
override fun loadResource(
view: ImageView?,
@DrawableRes resourceId: Int,
radius: Int,
callback: ImageLoadCallback?
) {
view?.setImageResource(resourceId)
callback?.onSuccess(null)
}
override fun loadUrl(
view: ImageView?,
url: String,
radius: Int,
callback: ImageLoadCallback?
) {
view?.let { imageView ->
val request = createImageRequest(url, radius, callback)
imageLoader().execute(request) {
it.drawable?.let { drawable ->
imageView.setImageDrawable(drawable)
callback?.onSuccess(null)
} ?: run {
callback?.onLoadFailed(null)
}
}
}
}
override fun loadBitmap(
context: Context,
url: String,
radius: Int,
callback: ImageLoadCallback?
) {
val request = createImageRequest(url, radius, callback)
imageLoader().execute(request) {
it.toBitmap()?.let { bitmap ->
callback?.onSuccess(bitmap)
} ?: run {
callback?.onLoadFailed(null)
}
}
}
private fun createImageRequest(
url: String,
radius: Int,
callback: ImageLoadCallback?
): ImageRequest {
val builder = ImageRequest.Builder(context)
.data(url)
.parameters(Parameters.Builder().set("radius", radius).build())
if (callback != null) {
builder.target(object : Target {
override fun onStart(placeholder: Drawable?) {
callback.onLoadStarted(placeholder)
}
override fun onError(error: Drawable?) {
callback.onLoadFailed(error)
}
override fun onSuccess(result: Drawable) {}
override fun onCancel() {}
})
}
return builder.build()
}
private fun imageLoader(): coil.ImageLoader {
return Coil.loader()
}
}
6、上下文类的定义
ImageLoader类则是上下文类,负责根据调用方的需要,选择不同的图片加载库。它把具体的策略实现作为一个参数,通过构造函数或者其他方式注入到类中。在执行图片加载时,ImageLoader对象调用传入的具体策略实现的方法。
一般而言,我们会这么写,通过一个单例,来调用传入的IImageEngine实现类
object ImageLoader {
private var imageEngine: IImageEngine? = null
fun <T : IImageEngine> init(ie: T) {
imageEngine = ie
}
fun loadImage(
view: ImageView?,
url: String,
radius: Int = 0,
callback: ImageLoadCallback? = null
) {
imageEngine?.loadUrl(view, url, radius, callback)
}
fun loadResource(
view: ImageView?,
resourceId: Int,
radius: Int = 0,
callback: ImageLoadCallback? = null
) {
imageEngine?.loadResource(view, resourceId, radius, callback)
}
fun loadBitmap(
context: Context,
url: String,
radius: Int = 0,
callback: ImageLoadCallback? = null
) {
imageEngine?.loadBitmap(context, url, radius, callback)
}
}
但是得益于Kotlin的语法糖,我们可以用委托的方法,省略许多的代码细节
object ImageLoader : IImageEngine by GlideEngine
其实编译出来的代码是一模一样的
你也可以皮一点
object ImageLoader1 : IImageEngine by GlideEngine
object ImageLoader2 : IImageEngine by CoilEngine
这样调用也是非常简单了
ImageLoader.loadUrl(imageView, url, radius, callback)
7、扩展函数
当然一个懒狗,是不会想多传一个ImageView对象的,用上Kotlin语法糖
fun ImageView.loadUrl(url: String, radius: Int = 0, callback: ImageLoadCallback?) {
ImageLoader.loadUrl(this, url, radius, callback)
}
fun ImageView.loadRes(@DrawableRes resourceId: Int, radius: Int = 0, callback: ImageLoadCallback?) {
ImageLoader.loadResource(this, resourceId, radius, callback)
}
这样你就可以直接把它当做ImageView的方法使用了
imageView.loadRes(xxx)
8、总结
作为一个加载图片的框架,我们需要考虑以下几点:
- 图片加载的来源:本地图片、网络图片、Bitmap 等。
- 加载图片的方式:同步加载、异步加载,图片压缩等。
- 图片加载的性能和效率:需要考虑内存占用、加载速度、缓存等。
- 对于不同的加载场景,如列表、详情页等,需要采用不同的加载策略。
到这儿我们都只考虑第一点的第一部分,不过因为主要是为了讲策略模式的应用,所以嘻嘻嘻。不过还是实现了对不同图片加载库的无缝切换
对于Glide、Coil的使用不做赘述啦
就到这)-(
如果您有任何疑问、对文章写的不满意、发现错误或者有更好的方法,欢迎在评论、私信或邮件中提出,非常感谢您的支持。🙏
“开启掘金成长之旅!这是我参与「掘金日新计划 · 2 月更文挑战」的第 5 天,点击查看活动详情”