自定义转换时 Glide 4.6.1 图像闪烁答案

【问题标题】：Glide 4.6.1 image flicker on custom transformation自定义转换时 Glide 4.6.1 图像闪烁
【发布时间】：2018-12-19 17:47:16
【问题描述】：

我有以下自定义转换 (kotlin)：

private class IconTransformation : BitmapTransformation() {
    companion object {
        private const val ID = "com.example.widget.IconView\$IconTransformation"
        private val ID_BYTES = ID.toByteArray()

        private const val PAINT_FLAGS = Paint.DITHER_FLAG or Paint.FILTER_BITMAP_FLAG
        private const val CIRCLE_CROP_PAINT_FLAGS = PAINT_FLAGS or Paint.ANTI_ALIAS_FLAG
        private val CIRCLE_CROP_SHAPE_PAINT = Paint(CIRCLE_CROP_PAINT_FLAGS)
        private val CIRCLE_CROP_BITMAP_PAINT = Paint(CIRCLE_CROP_PAINT_FLAGS).apply {
            xfermode = PorterDuffXfermode(PorterDuff.Mode.SRC_IN)
        }
        private val CLEAR_PAINT = Paint().apply {
            xfermode = PorterDuffXfermode(PorterDuff.Mode.CLEAR)
        }
    }

    override fun updateDiskCacheKey(messageDigest: MessageDigest) {
        messageDigest.update(ID_BYTES)
    }

    override fun transform(pool: BitmapPool, toTransform: Bitmap, outWidth: Int,
            outHeight: Int): Bitmap {
        val img = TransformationUtils.fitCenter(pool, toTransform, outWidth, outHeight)
        val result = pool.get(outWidth, outHeight, Bitmap.Config.ARGB_8888)
        val left = (result.width - img.width) / 2f
        val top = (result.height - img.height) / 2f
        result.setHasAlpha(true)
        Canvas(result).apply {
            drawColor(Color.TRANSPARENT)
            drawCircle(outWidth / 2f, outHeight / 2f,
                    Math.min(outWidth, outHeight) / 2f, CIRCLE_CROP_SHAPE_PAINT)
            drawBitmap(img, left, top, CIRCLE_CROP_BITMAP_PAINT)
            if (left > 0f) {
                drawRect(0f, 0f, left, outHeight.toFloat(), CLEAR_PAINT)
                drawRect(left + img.width - 1, 0f,
                        outWidth.toFloat(), outHeight.toFloat(), CLEAR_PAINT)
            }
            if (top > 0f) {
                drawRect(0f, 0f, outWidth.toFloat(), top, CLEAR_PAINT)
                drawRect(0f, top + img.height - 1,
                        outWidth.toFloat(), outHeight.toFloat(), CLEAR_PAINT)
            }
        }
        pool.put(img)
        return result
    }

    override fun hashCode(): Int = ID.hashCode()

    override fun equals(other: Any?): Boolean = other is IconTransformation
}

当我在回收站视图中像下面这样使用它时，图像会闪烁并反弹。从我读到的所有内容来看，这与不正确地实现updateDiskCacheKey、hashCode 和equals 有关。从 AFAIK 我完全按照BitmapTransformation 中的说明进行操作。

    Glide.with(icon)
            .load(url)
            .apply(RequestOptions()
                    .transform(IconTransformation())
                    .error(errorDrawableRes))
            .into(icon)

【问题讨论】：

标签： android kotlin android-glide

【解决方案1】：

我的评论 here 可能会有所帮助。

我使用占位符来解决闪烁问题。 dontTransform 确实在我的应用程序中不起作用。在搜索了 Glide 的源代码后，我发现问题可能来自 ImageViewTarget：
/**
   * Sets the given {@link android.graphics.drawable.Drawable} on the view using {@link
   * android.widget.ImageView#setImageDrawable(android.graphics.drawable.Drawable)}.
   *
   * @param placeholder {@inheritDoc}
   */
  @Override
  public void onLoadStarted(@Nullable Drawable placeholder) {
    super.onLoadStarted(placeholder);
    setResourceInternal(null);
    setDrawable(placeholder);
  }
因此，如果 placeholder 为 null，ImageView 将在之后立即变为空白每次加载。所以我在 ImageView 中缓存最后一张图片并设置它作为下次加载的占位符。这是代码
// init
mGlideOpt = new RequestOptions().dontAnimate().skipMemoryCache(false);
mGlideRB = Glide.with(imageView).asBitmap();

// loading
Drawable drawable = mImageView.getDrawable();
if (drawable != null) {
    mGlideOpt = mGlideOpt.placeholder(drawable);
}
mGlideRB.apply(mGlideOpt).load(mCacheFile).into(mImageView);
只是一种解决方法。希望对您有所帮助。

【讨论】：

【解决方案2】：

问题出现在pool.put(img) 行变成以下解决问题：

if (img != toTransform) {
    pool.put(img)
}

【讨论】：