Glide圆形图片加载封装

20170509更新

具体参考：https://github.com/soulrelay/ImageLoaderUtil

前言

• 之前加载圆形图片，一般都是采用自定义的CircleImageview。后来开始使用Glide加载图片，期间遇到Glide和CircleImageview使用冲突的问题（如：有的图片第一次加载的时候只显示占位图，第二次才显示正常的图片，以及CircleImageview带来的崩溃问题），当时采用了一个牺牲动画效果的解决方案
• 既然已经全面使用Glide，那么就尽量基于Glide来完成加载圆形图片的方案

Github实时更新：

• Android图片加载库的封装实战
• Android基于ImageLoaderUtil封装库的图集实现

方案

关于Glide相关的加载方案不再赘述，具体请参考Android图片加载库的封装实战，期间各种更新都会在这篇文章中同步，但是基于篇幅问题，遂决定以后的更新方案单独成篇，并将相关链接附上

自定义BitmapTransformation来实现圆形图片加载

/**
 * DES：自定义BitmapTransformation来实现圆形图片加载
 * Created by SuS on 2017/3/8.
 */
public class GlideCircleTransform extends BitmapTransformation {

    private Paint mBorderPaint;
    private float mBorderWidth;

    public GlideCircleTransform(Context context) {
        super(context);
    }

    public GlideCircleTransform(Context context, int borderWidth, int borderColor) {
        super(context);
        mBorderWidth = Resources.getSystem().getDisplayMetrics().density * borderWidth;

        mBorderPaint = new Paint();
        mBorderPaint.setDither(true);
        mBorderPaint.setAntiAlias(true);
        mBorderPaint.setColor(borderColor);
        mBorderPaint.setStyle(Paint.Style.STROKE);
        mBorderPaint.setStrokeWidth(mBorderWidth);
    }


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

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

        int size = (int) (Math.min(source.getWidth(), source.getHeight()) - (mBorderWidth / 2));
        int x = (source.getWidth() - size) / 2;
        int y = (source.getHeight() - size) / 2;
        // TODO this could be acquired from the pool too
        Bitmap squared = Bitmap.createBitmap(source, x, y, size, size);
        Bitmap result = pool.get(size, size, Bitmap.Config.ARGB_8888);
        if (result == null) {
            result = Bitmap.createBitmap(size, size, Bitmap.Config.ARGB_8888);
        }
        Canvas canvas = new Canvas(result);
        Paint paint = new Paint();
        paint.setShader(new BitmapShader(squared, BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP));
        paint.setAntiAlias(true);
        float r = size / 2f;
        canvas.drawCircle(r, r, r, paint);
        if (mBorderPaint != null) {
            float borderRadius = r - mBorderWidth / 2;
            canvas.drawCircle(r, r, borderRadius, mBorderPaint);
        }
        return result;
    }

    @Override
    public String getId() {
        return getClass().getName();
    }
}

BaseImageLoaderStrategy添加支持圆形图片加载的抽象接口

public interface BaseImageLoaderStrategy {
  //加载圆形图片
    void loadCircleImage(String url, int placeholder, ImageView imageView);
  //加载圆形图片，支持设置边框的宽度和颜色
    void loadCircleBorderImage(String url, int placeholder, ImageView imageView,int borderWidth, int borderColor);

}

GlideImageLoaderStrategy相关实现

public class GlideImageLoaderStrategy implements BaseImageLoaderStrategy {
    @Override
    public void loadCircleImage(String url, int placeholder, ImageView imageView) {
        Glide.with(imageView.getContext()).load(url).placeholder(placeholder)
                .transform(new GlideCircleTransform(imageView.getContext()))
                .diskCacheStrategy(DiskCacheStrategy.SOURCE).into(imageView);
    }

    @Override
    public void loadCircleBorderImage(String url, int placeholder, ImageView imageView, int borderWidth, int borderColor) {
        Glide.with(imageView.getContext()).load(url).placeholder(placeholder)
                .transform(new GlideCircleTransform(imageView.getContext(),borderWidth,borderColor))
                .diskCacheStrategy(DiskCacheStrategy.SOURCE).into(imageView);
    }
}

ImageLoaderUtil入口方法调用

public class ImageLoaderUtil {
   public void loadCircleImage(String url, int placeholder, ImageView imageView) {
        mStrategy.loadCircleImage(url,placeholder,imageView);
    }

    public void loadCircleBorderImage(String url, int placeholder, ImageView imageView, int borderWidth, int borderColor) {
        mStrategy.loadCircleBorderImage(url, placeholder, imageView, borderWidth, borderColor);
    }
}