Glide加載Gif圓角圖多次後出現黑邊

使用Glide加載Gif圖且要求圓角圖時，加載多次發現圓角背後多了黑色方角，說具體點就是首次加載會有圓角，第二次加載就會圓角+方角黑邊。就像這樣：

到這裏，問題也描述的差不多了，有遇到同樣問題&心急的朋友可能反手就是一拖鞋

先給解決方案：加上.diskCacheStrategy(DiskCacheStrategy.SOURCE)即可。

下面是順便記錄下圓角實現過程和遇到的疑惑點：

Glide加載圓角圖可以直接調用自帶方法：transform或bitmapTransform；

使用時候需要自定義一個Transformation（或BitmapTransformation）：

public class GlideRoundTransform extends BitmapTransformation {
    private static float radius = 0f;

    public GlideRoundTransform(Context context) {
        this(context, 4);
    }

    public GlideRoundTransform(Context context, int dp) {
        super(context);
        radius = Resources.getSystem().getDisplayMetrics().density * dp;
    }

    @Override
    protected Bitmap transform(BitmapPool pool, Bitmap toTransform, int outWidth, int outHeight) {
        return roundCrop(pool, toTransform);
    }

    private static Bitmap roundCrop(BitmapPool pool, Bitmap source) {
        if (source == null) return null;

        Bitmap result = pool.get(source.getWidth(), source.getHeight(), Bitmap.Config.ARGB_8888);
        if (result == null) {
            result = Bitmap.createBitmap(source.getWidth(), source.getHeight(), Bitmap.Config.ARGB_8888);
        }

        Canvas canvas = new Canvas(result);
        Paint paint = new Paint();
        paint.setShader(new BitmapShader(source, BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP));
        paint.setAntiAlias(true);
        RectF rectF = new RectF(0f, 0f, source.getWidth(), source.getHeight());
        canvas.drawRoundRect(rectF, radius, radius, paint);
        return result;
    }

    @Override
    public String getId() {
        return getClass().getName() + Math.round(radius);
    }
}

然後使用時就這樣：

ImageView gifRoundView = findViewById(R.id.clip_view);

Glide.with(this).load(gif_url)
        .placeholder(R.drawable.video_img_error)
        .error(R.drawable.video_img_error)
        .diskCacheStrategy(DiskCacheStrategy.SOURCE)
        .transform(new GlideRoundTransformation(this, 10))
        .into(gifRoundView);

但是項目中gif圖片有兩種：16:9和4:3，要求高度固定，圖片不能拉伸（XML中：ImageView需要設置 android:scaleType=“fitCenter”），即16:9時需要gif圓角，4:3時候需要背景圓角，gif居中顯示不圓角。我們需要做的就是監聽圖片下載完成時刻，根據圖片大小再決定是否顯示圓角。代碼如下：

final DrawableRequestBuilder<String> builder = Glide.with(this).load(gif_url)
        .error(R.drawable.video_img_error).placeholder(R.drawable.video_img_error)
        .crossFade().diskCacheStrategy(DiskCacheStrategy.SOURCE)
        /*.bitmapTransform(new GlideRoundTransformation(this, 10))*/;//這一行很重要!!!

//監聽是否加載完成
builder.listener(new RequestListener<String, GlideDrawable>() {
    @Override
    public boolean onException(Exception e, String s, Target<GlideDrawable> target, boolean b) {
        return false;
    }

    @Override
    public boolean onResourceReady(GlideDrawable resource, String model,
                                   Target<GlideDrawable> target, boolean isFromMemoryCache, boolean isFirstResource) {
        //如果圖片比例(4:3 / 16:9) 和控件比例一樣(16:9)，就切5dp圓角，否則不切圓角
        float drawableRatio = 1.00f * resource.getIntrinsicWidth() / Math.max(1, resource.getIntrinsicHeight());
        float imageViewRatio = 16.0f / 9;
        int radiusDp = (drawableRatio >= imageViewRatio ? 10 : 0);
        builder.bitmapTransform(new GlideRoundTransformation(activity, radiusDp));
        return false;
    }
}).into(gifRoundView);

按照這個思路運行後，發現圓角徹底沒了，WTF？？？

最後把添加監聽前 註釋那行代碼放開後，一切按照預想的那樣正常運行了，就是說，必須統一先設置圓角，然後在下載完成監聽中二次選擇圓角或方角，圓角纔會起作用，否則圓角就像從來沒來過一樣。求路過大神評論區指津，抱拳！