Glide 加载图片并应用滤镜效果

飞翔的时光机2024-12-16 14:04

https://chatgpt.com/share/675a5bf6-7cd8-8003-98e7-d86146e47e95

常用滤镜类型

  1. 颜色调整滤镜
    灰度 (Grayscale): 将图片转换为黑白。
    反色 (Invert): 将图片的颜色反转。
    棕褐色 (Sepia): 应用棕褐色滤镜，营造复古效果。
    色调 (Hue): 调整图片的主色调。
    饱和度 (Saturation): 提高或降低颜色饱和度。
  2. 模糊效果
    高斯模糊 (Gaussian Blur): 创建柔化的模糊效果。
    径向模糊 (Radial Blur): 从中心向外逐渐模糊。
    运动模糊 (Motion Blur): 模拟运动轨迹模糊。
  3. 锐化滤镜
    增强图片的细节，让图片显得更清晰。
  4. 光影和边缘
    浮雕 (Emboss): 使图片看起来像浮雕效果。
    边缘检测 (Edge Detection): 突出图片的边缘。
  5. 视觉特效
    马赛克 (Pixelation): 通过降低分辨率创建像素化效果。
    油画 (Oil Painting): 模拟油画质感。
    素描 (Sketch): 将图片转换为素描风格。

实现推荐

  1. 使用 BitmapTransformation

    Glide 的 BitmapTransformation 是实现滤镜效果的基础，适合简单的自定义滤镜（如颜色调整）。

  2. 使用 GPU 加速的滤镜库

    GPUImage for Android:

    提供了许多常用滤镜（如模糊、灰度、色调调整）。

    高效利用 GPU 处理图像，性能优秀。

    GitHub 地址

  3. 颜色调整滤镜
    灰度 (Grayscale)

kotlin 复制代码 
class GrayscaleTransformation : BitmapTransformation() {
    override fun updateDiskCacheKey(messageDigest: MessageDigest) {
        messageDigest.update("GrayscaleTransformation".toByteArray())
    }

    override fun transform(pool: BitmapPool, toTransform: Bitmap, outWidth: Int, outHeight: Int): Bitmap {
        val result = pool.get(toTransform.width, toTransform.height, Bitmap.Config.ARGB_8888)
        val canvas = Canvas(result)
        val paint = Paint()
        val colorMatrix = ColorMatrix().apply { setSaturation(0f) }
        paint.colorFilter = ColorMatrixColorFilter(colorMatrix)
        canvas.drawBitmap(toTransform, 0f, 0f, paint)
        return result
    }
}

反色 (Invert)

kotlin 复制代码 
class InvertTransformation : BitmapTransformation() {
    override fun updateDiskCacheKey(messageDigest: MessageDigest) {
        messageDigest.update("InvertTransformation".toByteArray())
    }

    override fun transform(pool: BitmapPool, toTransform: Bitmap, outWidth: Int, outHeight: Int): Bitmap {
        val result = pool.get(toTransform.width, toTransform.height, Bitmap.Config.ARGB_8888)
        val canvas = Canvas(result)
        val paint = Paint()
        val colorMatrix = ColorMatrix(floatArrayOf(
            -1f, 0f, 0f, 0f, 255f,
            0f, -1f, 0f, 0f, 255f,
            0f, 0f, -1f, 0f, 255f,
            0f, 0f, 0f, 1f, 0f
        ))
        paint.colorFilter = ColorMatrixColorFilter(colorMatrix)
        canvas.drawBitmap(toTransform, 0f, 0f, paint)
        return result
    }
}

使用 Glide 的 BitmapTransformation 可以实现上述滤镜效果。下面分别为每种滤镜提供了示例实现代码：

1. 颜色调整滤镜

灰度 (Grayscale)
kotlin 复制代码 
class GrayscaleTransformation : BitmapTransformation() {
    override fun updateDiskCacheKey(messageDigest: MessageDigest) {
        messageDigest.update("GrayscaleTransformation".toByteArray())
    }

    override fun transform(pool: BitmapPool, toTransform: Bitmap, outWidth: Int, outHeight: Int): Bitmap {
        val result = pool.get(toTransform.width, toTransform.height, Bitmap.Config.ARGB_8888)
        val canvas = Canvas(result)
        val paint = Paint()
        val colorMatrix = ColorMatrix().apply { setSaturation(0f) }
        paint.colorFilter = ColorMatrixColorFilter(colorMatrix)
        canvas.drawBitmap(toTransform, 0f, 0f, paint)
        return result
    }
}
反色 (Invert)
kotlin 复制代码 
class InvertTransformation : BitmapTransformation() {
    override fun updateDiskCacheKey(messageDigest: MessageDigest) {
        messageDigest.update("InvertTransformation".toByteArray())
    }

    override fun transform(pool: BitmapPool, toTransform: Bitmap, outWidth: Int, outHeight: Int): Bitmap {
        val result = pool.get(toTransform.width, toTransform.height, Bitmap.Config.ARGB_8888)
        val canvas = Canvas(result)
        val paint = Paint()
        val colorMatrix = ColorMatrix(floatArrayOf(
            -1f, 0f, 0f, 0f, 255f,
            0f, -1f, 0f, 0f, 255f,
            0f, 0f, -1f, 0f, 255f,
            0f, 0f, 0f, 1f, 0f
        ))
        paint.colorFilter = ColorMatrixColorFilter(colorMatrix)
        canvas.drawBitmap(toTransform, 0f, 0f, paint)
        return result
    }
}
棕褐色 (Sepia)
kotlin 复制代码 
class SepiaTransformation : BitmapTransformation() {
    override fun updateDiskCacheKey(messageDigest: MessageDigest) {
        messageDigest.update("SepiaTransformation".toByteArray())
    }

    override fun transform(pool: BitmapPool, toTransform: Bitmap, outWidth: Int, outHeight: Int): Bitmap {
        val result = pool.get(toTransform.width, toTransform.height, Bitmap.Config.ARGB_8888)
        val canvas = Canvas(result)
        val paint = Paint()
        val colorMatrix = ColorMatrix(floatArrayOf(
            0.393f, 0.769f, 0.189f, 0f, 0f,
            0.349f, 0.686f, 0.168f, 0f, 0f,
            0.272f, 0.534f, 0.131f, 0f, 0f,
            0f, 0f, 0f, 1f, 0f
        ))
        paint.colorFilter = ColorMatrixColorFilter(colorMatrix)
        canvas.drawBitmap(toTransform, 0f, 0f, paint)
        return result
    }
}
色调 (Hue) 和 饱和度 (Saturation)

你可以在 ColorMatrix 中调整色调或饱和度。与上述类似，通过修改 setRotate 或 setSaturation 调整效果。

2. 模糊效果

高斯模糊 (Gaussian Blur)

需要使用 RenderScript 或第三方库如 BlurKit:

kotlin 复制代码 
class GaussianBlurTransformation(private val context: Context, private val radius: Float) : BitmapTransformation() {
    override fun updateDiskCacheKey(messageDigest: MessageDigest) {
        messageDigest.update("GaussianBlurTransformation".toByteArray())
    }

    override fun transform(pool: BitmapPool, toTransform: Bitmap, outWidth: Int, outHeight: Int): Bitmap {
        val rs = RenderScript.create(context)
        val input = Allocation.createFromBitmap(rs, toTransform)
        val output = Allocation.createTyped(rs, input.type)
        val script = ScriptIntrinsicBlur.create(rs, Element.U8_4(rs))
        script.setRadius(radius)
        script.setInput(input)
        script.forEach(output)
        output.copyTo(toTransform)
        rs.destroy()
        return toTransform
    }
}
径向模糊 (Radial Blur)

需要使用 OpenGL 或专用算法实现，这超出 Glide 基本能力。

3. 锐化滤镜

kotlin 复制代码 
class SharpenTransformation : BitmapTransformation() {
    override fun updateDiskCacheKey(messageDigest: MessageDigest) {
        messageDigest.update("SharpenTransformation".toByteArray())
    }

    override fun transform(pool: BitmapPool, toTransform: Bitmap, outWidth: Int, outHeight: Int): Bitmap {
        val result = pool.get(toTransform.width, toTransform.height, Bitmap.Config.ARGB_8888)
        val kernel = floatArrayOf(
            0f, -1f, 0f,
            -1f, 5f, -1f,
            0f, -1f, 0f
        )
        val paint = Paint()
        val canvas = Canvas(result)
        val colorMatrix = ColorMatrix()
        paint.colorFilter = ColorMatrixColorFilter(colorMatrix)
        canvas.drawBitmap(toTransform, 0f, 0f, paint)
        return result
    }
}

4. 光影和边缘

浮雕 (Emboss)

通过自定义滤镜：

kotlin 复制代码 
val embossMatrix = floatArrayOf(
    -2f, -1f, 0f,
    -1f, 1f, 1f,
    0f, 1f, 2f
)
边缘检测 (Edge Detection)

使用卷积核进行边缘检测：

kotlin 复制代码 
val edgeDetectionKernel = floatArrayOf(
    -1f, -1f, -1f,
    -1f, 8f, -1f,
    -1f, -1f, -1f
)

5. 视觉特效

马赛克 (Pixelation)

通过降低图片分辨率实现：

kotlin 复制代码 
class PixelationTransformation(private val pixelSize: Int) : BitmapTransformation() {
    override fun updateDiskCacheKey(messageDigest: MessageDigest) {
        messageDigest.update("PixelationTransformation".toByteArray())
    }

    override fun transform(pool: BitmapPool, toTransform: Bitmap, outWidth: Int, outHeight: Int): Bitmap {
        val scaledBitmap = Bitmap.createScaledBitmap(toTransform, toTransform.width / pixelSize, toTransform.height / pixelSize, false)
        return Bitmap.createScaledBitmap(scaledBitmap, toTransform.width, toTransform.height, false)
    }
}
油画 (Oil Painting) 和 素描 (Sketch)

需要实现复杂的算法，建议使用 GPUImage 或专用的图像处理库。

在 Glide 中应用滤镜

kotlin 复制代码 
Glide.with(context)
    .load(imageUrl)
    .apply(RequestOptions.bitmapTransform(GrayscaleTransformation()))
    .into(imageView)

通过上述方式，你可以逐步实现各种滤镜效果，满足项目需求。

相关推荐
zhangphil10 天前
Android矩阵Matrix实现Glide图像fitCenter转换为centerCrop，Kotlin
android·kotlin·glide
zhangphil18 天前
Android Glide批量加载Bitmap，拼接组装大Bitmap，更新单个AppCompatImageView，Kotlin（2）
android·kotlin·glide
鸡鸭扣18 天前
网络药理学之薛定谔Schrödinge Maestro：6、分子对接（Glide、Ligand docking）和可视化
glide·生物信息学·生信·分子对接·薛定谔·网络药理学·maestro
zhangphil21 天前
Android Glide load origin Bitmap, Kotlin
android·kotlin·glide
dreamsever21 天前
Glide源码学习
android·java·学习·glide
zhangphil1 个月前
Android Glide动态apply centerCropTransform(),transition withCrossFade动画,Kotlin
android·glide
我怀里的猫1 个月前
glide ModelLoader的Key错误使用 可能造成的内存泄漏
android·kotlin·glide
我怀里的猫1 个月前
glide性能优化实战
性能优化·glide
命运之手4 个月前
【Android】Glide模块工作原理
android·module·glide·工作原理·decoder
热门推荐
01量化方法怎么选？如何评估量化后的大模型LLM？02玄机平台应急响应—webshell查杀03(欧拉)openEuler系统添加网卡文件配置流程、(欧拉)openEuler系统手动配置ipv6地址流程、(欧拉)openEuler系统网络管理说明04华为LTC流程体系的内涵（附PPT分享）05【凡人修仙传_01】散修厉飞羽是如何出师未捷身先死的！06Docker 夺命连环 15 问07HCIA-datacom数通题库和录播视频资料08怎么找小红书美食探店博主合作？09PyTorch机器学习实现液态神经网络10学习STM32（6）-- STM32单片机ADC&DAC的应用