美文网首页Android 图片Android开发经验谈Android开发
Android加载圆角图片、圆形图片的三种方式

Android加载圆角图片、圆形图片的三种方式

作者: 芒果味的你呀 | 来源:发表于2017-12-17 17:41 被阅读127次

    方式一:使用 【RoundedBitmapDrawable】

    这个类RoundedBitmapDrawable 位于 android .support.v4.graphics.drawable
    有了它,显示圆角和圆形图片的情况下就不需要额外的第三方类库了,使用起来也是十分简单。但它也能和各种图片加载库配合使用。

    实现圆角
    Bitmap bitmap=;//自己获得的bitmap
    RoundedBitmapDrawable roundedDrawable =
            RoundedBitmapDrawableFactory.create(getResources(),bitmap);//传入bitmap
    //设置圆角角度                
    roundedDrawable.setCornerRadius(30L);
    imageView.setImageDrawable(roundedDrawable);
    
    实现圆形
    Bitmap bitmap=;//自己获得的bitmap
    RoundedBitmapDrawable roundedDrawable =RoundedBitmapDrawableFactory.create(getResources(),bitmap);//传入bitmap
    roundedDrawable.setCircular(true);
    imageView.setImageDrawable(roundedDrawable);
    
    和Glide搭配使用
      Glide.with(this).load(imgUrl).asBitmap().into(new SimpleTarget<Bitmap>() {
                @Override
                public void onResourceReady(Bitmap resource, GlideAnimation<? super Bitmap> glideAnimation) {
            //使用resource
         RoundedBitmapDrawable roundedDrawable =
            RoundedBitmapDrawableFactory.create(getResources(),resource);//传入bitmap
    roundedDrawable.setCircular(true);
    imageView.setImageDrawable(roundedDrawable);
                }
            });
    

    方式2:使用【glide-transformations开源库】

    如果要Glide在加载过程中就把矩形图转换成圆形的,可以使用Glide之上引入的一个开源项目:glide-transformations

    首先引入依赖

        compile 'jp.wasabeef:glide-transformations:2.0.1'
    

    使用起来也是十分简单

    圆形图片和圆角图片
    Glide.with(this).load("https://tse2-mm.cn.bing.net/th?id=OIP.quu53G6ZvlGsIZ0DFRj-owHaFJ&p=0&pid=1.1")
                  .bitmapTransform(new CropCircleTransformation(this)).crossFade(1000)
                    .into(iv_circle);
    Glide.with(this).load("https://tse2-mm.cn.bing.net/th?id=OIP.quu53G6ZvlGsIZ0DFRj-owHaFJ&p=0&pid=1.1")
                    .bitmapTransform(new RoundedCornersTransformation(this,30,0)).crossFade(1000)
                    .into(iv_corner);
    

    方式3:自定义【BitmapTransformation】

    Glide不得不说是一个很好的图片加载框架,使用起来还十分的简单。
    但是Glide本身却没有发现加载圆形和圆角图片的方法,原来需要通过transform方法里面传入自定义的BitmapTransformation才可以实现,方式2的开源库其实就是自定义的BitmapTransformation,在glide之上做了一层封装,方便我们直接使用。但原理都是一样的。所以,如果我们不想引入那个开源库,也可以自己写BitmapTransformation类

    compile 'com.github.bumptech.glide:glide:3.7.0'
    

    圆形图片GlideCircleTransform

    import android.content.Context;
    import android.graphics.Bitmap;
    import android.graphics.BitmapShader;
    import android.graphics.Canvas;
    import android.graphics.Paint;
    
    import com.bumptech.glide.load.engine.bitmap_recycle.BitmapPool;
    import com.bumptech.glide.load.resource.bitmap.BitmapTransformation;
    
    public class GlideCircleTransform extends BitmapTransformation {
    
        public GlideCircleTransform(Context context) {
            super(context);
        }
    
        @Override
        protected Bitmap transform(BitmapPool pool, Bitmap toTransform, int outWidth, int outHeight) {
            return circleCrop(pool, toTransform);
        }
    
        private static Bitmap circleCrop(BitmapPool pool, Bitmap source) {
            if (source == null) return null;
    
            int size = Math.min(source.getWidth(), source.getHeight());
            int x = (source.getWidth() - size) / 2;
            int y = (source.getHeight() - size) / 2;
    
            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);
            return result;
        }
    
        @Override
        public String getId() {
            return getClass().getName();
        }
    }
    

    圆角图片GlideRoundTransform

    import android.content.Context;
    import android.content.res.Resources;
    import android.graphics.Bitmap;
    import android.graphics.BitmapShader;
    import android.graphics.Canvas;
    import android.graphics.Paint;
    import android.graphics.RectF;
    import com.bumptech.glide.load.engine.bitmap_recycle.BitmapPool;
    import com.bumptech.glide.load.resource.bitmap.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);
            this.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);
        }
    }
    

    使用

         //圆角图片
            Glide.with(this)
                    .load(url)
                    //.centerCrop() 千万不要加,加了就没有圆角效果了
                    .transform(new CenterCrop(context), new GlideRoundTransform(context,10))
                    .into(iv_corner);
            //圆形图片
            Glide.with(this)
                    .load(url)
                    .transform(new GlideCircleTransform(context))
                    .into(iv_circle);
    

    亲测以上三种方法可用,效果也是一样的,就不放效果图了,就是圆角和圆形而已。

    相关文章

      网友评论

      • c82bf09cf357:三个都能实现,很简单,重要的是原理优劣取舍权衡方面的东西,做出来,意义不大的。

      本文标题:Android加载圆角图片、圆形图片的三种方式

      本文链接:https://www.haomeiwen.com/subject/iobrwxtx.html