Android中Glide加载圆形图片和圆角图片实例代码

一、简介:

介绍两种使用 BitmapTransformation 来实现 Glide 加载圆形图片和圆角图片的方法。Glide 并不能直接支持 Round Pictures ,需要使用 BitmapTransformation 来进行处理。

二、网上的实现方式

这里介绍下网上常见的方式和使用 RoundedBitmapDrawable 两种方法,本质上是差不多的:

  1. 使用 Canvas 和 Paint 来绘制
  2. 使用 Android.support.v4.graphics.drawable.RoundedBitmapDrawable

实现圆形图片:

/**
 *
 * Glide 圆形图片 Transform
 */

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();
  }
}

实现圆角图片:

/**
 * Glide 圆角 Transform
 */

public class GlideRoundTransform extends BitmapTransformation {

  private static float radius = 0f;

  /**
 * 构造函数 默认圆角半径 4dp
 *
 * @param context Context
 */
  public GlideRoundTransform(Context context) {
    this(context, 4);
  }

  /**
 * 构造函数
 *
 * @param context Context
 * @param dp 圆角半径
 */
  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);
  }
}

三、笔者比较喜欢的简便的实现方式

//加载圆角图片
   public static void loadRoundImage(final Context context, String url,final ImageView imageView){
     Glide.with(context)
         .load(url)
         .asBitmap()
         .placeholder(placeholder)
         .error(placeholder)
         .diskCacheStrategy(DiskCacheStrategy.ALL) //设置缓存
         .into(new BitmapImageViewTarget(imageView){
           @Override
           protected void setResource(Bitmap resource) {
             super.setResource(resource);
             RoundedBitmapDrawable circularBitmapDrawable =
                 RoundedBitmapDrawableFactory.create(context.getResources(), resource);
             circularBitmapDrawable.setCornerRadius(10); //设置圆角弧度
             imageView.setImageDrawable(circularBitmapDrawable);
           }
         });
   }

  //加载圆形图片
  public static void loadCirclePic(final Context context, String url, final ImageView imageView) {
    Glide.with(context)
        .load(url)
        .asBitmap()
        .placeholder(placeholder)
        .error(placeholder)
        .diskCacheStrategy(DiskCacheStrategy.ALL) //设置缓存
        .into(new BitmapImageViewTarget(imageView) {
          @Override
          protected void setResource(Bitmap resource) {
            RoundedBitmapDrawable circularBitmapDrawable =
                RoundedBitmapDrawableFactory.create(context.getResources(), resource);
            circularBitmapDrawable.setCircular(true);
            imageView.setImageDrawable(circularBitmapDrawable);
          }
        });

  }

关于drawableToBitmap的源码的实现是这样的

public static Bitmap drawableToBitmap(Drawable drawable) {
    // 取 drawable 的长宽
    int w = drawable.getIntrinsicWidth();
    int h = drawable.getIntrinsicHeight();

    // 取 drawable 的颜色格式
    Bitmap.Config config = drawable.getOpacity() != PixelFormat.OPAQUE ? Bitmap.Config.ARGB_8888
        : Bitmap.Config.RGB_565;
    // 建立对应 bitmap
    Bitmap bitmap = Bitmap.createBitmap(w, h, config);
    // 建立对应 bitmap 的画布
    Canvas canvas = new Canvas(bitmap);
    drawable.setBounds(0, 0, w, h);
    // 把 drawable 内容画到画布中
    drawable.draw(canvas);
    return bitmap;
  }
/**
 * RoundedBitmapDrawable 是 V4 下的一个类,不能简单的通过:强制转换成 BitmapDrawable
 * Bitmap bitmap = ((BitmapDrawable)xxx).getBitmap();
 */

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • 详解Android中Glide与CircleImageView加载圆形图片的问题

    最近在项目中遇到了一个奇怪的问题,Glide和CircleImageView一起使用加载圆形头像,发现第一次死活都加载出来,出来的是一张占位图,当你刷新的时候或者第二次进入的时候才能加载出来.究其原因,CircleImageView 把位置占了.这时候我们有如下4种解决方案,不管是哪一种都是可以解决的(亲测可行). 1. 不使用占位符 注释掉这两句代码即可. .placeholder(R.drawable.normal_photo) .error(R.drawable.normal_photo)

  • Android中Glide加载圆形图片和圆角图片实例代码

    一.简介: 介绍两种使用 BitmapTransformation 来实现 Glide 加载圆形图片和圆角图片的方法.Glide 并不能直接支持 Round Pictures ,需要使用 BitmapTransformation 来进行处理. 二.网上的实现方式 这里介绍下网上常见的方式和使用 RoundedBitmapDrawable 两种方法,本质上是差不多的: 使用 Canvas 和 Paint 来绘制 使用 Android.support.v4.graphics.drawable.Rou

  • Android中Glide加载到RelativeLayout背景图方法示例

    前言 Glide是 Google推荐的图片加载库,它可以支持来自url,Android资源,文件,Uri中的图片加载,同时还支持gif图片的加载,以及各种图片显示前的bitmap处理(例如:圆角图片,圆形图片,高斯模糊,旋转,灰度等等),缓存处理,请求优先级处理,动画处理,缩略图处理,图片大小自定义等等.可谓是非常的强大. 一般情况下我们都是使用Glide加载图片到ImageView上,那么如何加载到RelativeLayout的背景上呢? RelativeLayou是一个用于设计用户界面的强大

  • Android中Glide加载库的图片缓存配置究极指南

    零.选择Glide 为什么图片加载我首先推荐Glide? 图片加载框架用了不少,从afinal框架的afinalBitmap,Xutils的BitmapUtils,老牌框架universalImageLoader,著名开源组织square的picasso,google推荐的glide到FaceBook推出的fresco.这些我前前后后都体验过,那么面对这么多的框架,该如何选择呢?下面简单分析下我的看法. afinal和Xuils在github上作者已经停止维护了,开源社区最新的框架要属KJFra

  • Android中Glide加载图片并实现图片缓存

    今天工作中遇到Glide的缓存问题,之前在项目中一直用Glide加载本地及网络图片,但是没有考虑过缓存的问题,但是需求中需要提到了,所以在网上查了一下,再这里和大家简单的分享一下Glide的使用方法以及缓存 首先,Glide是Github上开源的一个图片库,作者是bumptech,所以要使用的话,必须添加依赖: compile 'com.github.bumptech.glide:glide:3.6.1' 加载方式: Glide.with(context) .load("https://ss0.

  • Android仿视频加载旋转小球动画效果的实例代码

    先上个效果图,以免大家跑错地了. 嗯,除了只能录三秒,其他没啥问题. 下面分析一下怎么实现上面这个效果. 理性分析后我们可以看到是几个小球绕着一个圆进行运动,那这里面的重点我们看看什么. 绘制五个球,没什么难度,让球绕圆进行运动,这个好像我们没有见到是怎么去实现了,那下就说这个. 从本质上看,球绕圆运动,其实我们可以看作是一个物体绕指定的路劲运动,那我们就有下面几个东西需要说一下: 1:Path 2:ValueAnimator 3:PathMeasure 前两个大家应该都见过,一个是路径,就是可

  • Android中WebView加载网页设置进度条

    本文实例为大家分享了Android中WebView加载网页设置进度条的具体代码,供大家参考,具体内容如下 效果: xml: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" a

  • Android关于Glide的使用(高斯模糊、加载监听、圆角图片)

    高斯模糊.加载监听.圆角图片这些相信大家都很熟悉,那如何实现这些效果,请大家参考本文进行学习. 1.引用 compile 'com.github.bumptech.glide:glide:3.7.0' 2.加载图片 2.1 基本加载 Glide.with(context)     .load(url)     .into(imageView); 2.2 设置加载中和加载失败的情况 Glide.with(context) .load(url) .placeholder(R.drawable.loa

  • Android 使用Glide加载网络图片等比例缩放的实现方法

    在做android图片加载的时候,由于手机屏幕受限,很多大图加载过来的时候,我们要求等比例缩放,比如按照固定的宽度,等比例缩放高度,使得图片的尺寸比例得到相应的缩放,但图片没有变形.显然按照android:scaleType不能实现,因为会有很多限制,所以必须要自己写算法. 通过Glide来缩放 其实glide提供了这样的方法.具体是显示继承Transformation 的 setResource 方法. (1) 先获取网络或本地图片的宽高 (2) 获取需要的目标宽 (3) 按比例得到目标的高度

  • Android中如何加载数据缓存

    最近app快完工了,但是很多列表加载,新闻咨询等数据一直从网络请求,速度很慢,影响用户体验,所以寻思用缓存来加载一些更新要求不太高的数据 首先做一个保存缓存的工具类 import java.io.File; import java.io.IOException; import android.content.Context; import android.os.Environment; import android.util.Log; /** * 缓存工具类 */ public class Co

  • Android加载loading对话框的功能及实例代码(不退出沉浸式效果)

    一.自定义Dialog 在沉浸式效果下,当界面弹出对话框时,对话框将获取到焦点,这将导致界面退出沉浸式效果,那么是不是能通过屏蔽对话框获取焦点来达到不退出沉浸式的目的呢.说干就干,我们先来看一下改善后的效果图. 普通对话框弹出效果 LoadingDialog弹出效果 自定义LoadingDialog public class LoadingDialog extends Dialog { public LoadingDialog(Context context) { super(context);

随机推荐