Android之头像图片变圆形显示

一:先上效果图

二:实现步骤

1.自定义一个转换工具类

package com.common.base.util;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Bitmap;
import android.graphics.BitmapShader;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.Shader;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.ColorDrawable;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.widget.ImageView;
import com.common.base.R;
public class CircleImageView extends ImageView {
 /**
  * 头像转换工具类
  */
 private static final ScaleType SCALE_TYPE = ScaleType.CENTER_CROP;
 private static final Bitmap.Config BITMAP_CONFIG = Bitmap.Config.ARGB_8888;
 private static final int COLORDRAWABLE_DIMENSION = 1;
 private static final int DEFAULT_BORDER_WIDTH = 0;
 private static final int DEFAULT_BORDER_COLOR = Color.BLACK;
 private final RectF mDrawableRect = new RectF();
 private final RectF mBorderRect = new RectF();
 private final Matrix mShaderMatrix = new Matrix();
 private final Paint mBitmapPaint = new Paint();
 private final Paint mBorderPaint = new Paint();
 private int mBorderColor = DEFAULT_BORDER_COLOR;
 private int mBorderWidth = DEFAULT_BORDER_WIDTH;
 private Bitmap mBitmap;
 private BitmapShader mBitmapShader;
 private int mBitmapWidth;
 private int mBitmapHeight;
 private float mDrawableRadius;
 private float mBorderRadius;
 private boolean mReady;
 private boolean mSetupPending;
 public CircleImageView(Context context) {
  super(context);
 }
 public CircleImageView(Context context, AttributeSet attrs) {
  this(context, attrs, 0);
 }
 public CircleImageView(Context context, AttributeSet attrs, int defStyle) {
  super(context, attrs, defStyle);
  super.setScaleType(SCALE_TYPE);
  TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.CircleImageView, defStyle, 0);
  mBorderWidth = a.getDimensionPixelSize(R.styleable.CircleImageView_border_width, DEFAULT_BORDER_WIDTH);
  mBorderColor = a.getColor(R.styleable.CircleImageView_border_color, DEFAULT_BORDER_COLOR);
  a.recycle();
  mReady = true;
  if (mSetupPending) {
   setup();
   mSetupPending = false;
  }
 }
 @Override
 public ScaleType getScaleType() {
  return SCALE_TYPE;
 }
 @Override
 public void setScaleType(ScaleType scaleType) {
  if (scaleType != SCALE_TYPE) {
   throw new IllegalArgumentException(String.format("ScaleType %s not supported.", scaleType));
  }
 }
 @Override
 protected void onDraw(Canvas canvas) {
  if (getDrawable() == null) {
   return;
  }
  canvas.drawCircle(getWidth() / 2, getHeight() / 2, mDrawableRadius, mBitmapPaint);
  canvas.drawCircle(getWidth() / 2, getHeight() / 2, mBorderRadius, mBorderPaint);
 }
 @Override
 protected void onSizeChanged(int w, int h, int oldw, int oldh) {
  super.onSizeChanged(w, h, oldw, oldh);
  setup();
 }
 public int getBorderColor() {
  return mBorderColor;
 }
 public void setBorderColor(int borderColor) {
  if (borderColor == mBorderColor) {
   return;
  }
  mBorderColor = borderColor;
  mBorderPaint.setColor(mBorderColor);
  invalidate();
 }
 public int getBorderWidth() {
  return mBorderWidth;
 }
 public void setBorderWidth(int borderWidth) {
  if (borderWidth == mBorderWidth) {
   return;
  }
  mBorderWidth = borderWidth;
  setup();
 }
 @Override
 public void setImageBitmap(Bitmap bm) {
  super.setImageBitmap(bm);
  mBitmap = bm;
  setup();
 }
 @Override
 public void setImageDrawable(Drawable drawable) {
  super.setImageDrawable(drawable);
  mBitmap = getBitmapFromDrawable(drawable);
  setup();
 }
 @Override
 public void setImageResource(int resId) {
  super.setImageResource(resId);
  mBitmap = getBitmapFromDrawable(getDrawable());
  setup();
 }
 private Bitmap getBitmapFromDrawable(Drawable drawable) {
  if (drawable == null) {
   return null;
  }
  if (drawable instanceof BitmapDrawable) {
   return ((BitmapDrawable) drawable).getBitmap();
  }
  try {
   Bitmap bitmap;

   if (drawable instanceof ColorDrawable) {
    bitmap = Bitmap.createBitmap(COLORDRAWABLE_DIMENSION, COLORDRAWABLE_DIMENSION, BITMAP_CONFIG);
   } else {
    bitmap = Bitmap.createBitmap(drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight(), BITMAP_CONFIG);
   }
   Canvas canvas = new Canvas(bitmap);
   drawable.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
   drawable.draw(canvas);
   return bitmap;
  } catch (OutOfMemoryError e) {
   return null;
  }
 }
 private void setup() {
  if (!mReady) {
   mSetupPending = true;
   return;
  }
  if (mBitmap == null) {
   return;
  }
  mBitmapShader = new BitmapShader(mBitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
  mBitmapPaint.setAntiAlias(true);
  mBitmapPaint.setShader(mBitmapShader);
  mBorderPaint.setStyle(Paint.Style.STROKE);
  mBorderPaint.setAntiAlias(true);
  mBorderPaint.setColor(mBorderColor);
  mBorderPaint.setStrokeWidth(mBorderWidth);
  mBitmapHeight = mBitmap.getHeight();
  mBitmapWidth = mBitmap.getWidth();
  mBorderRect.set(0, 0, getWidth(), getHeight());
  mBorderRadius = Math.min((mBorderRect.height() - mBorderWidth) / 2, (mBorderRect.width() - mBorderWidth) / 2);
  mDrawableRect.set(mBorderWidth, mBorderWidth, mBorderRect.width() - mBorderWidth, mBorderRect.height() - mBorderWidth);
  mDrawableRadius = Math.min(mDrawableRect.height() / 2, mDrawableRect.width() / 2);
  updateShaderMatrix();
  invalidate();
 }
 private void updateShaderMatrix() {
  float scale;
  float dx = 0;
  float dy = 0;
  mShaderMatrix.set(null);
  if (mBitmapWidth * mDrawableRect.height() > mDrawableRect.width() * mBitmapHeight) {
   scale = mDrawableRect.height() / (float) mBitmapHeight;
   dx = (mDrawableRect.width() - mBitmapWidth * scale) * 0.5f;
  } else {
   scale = mDrawableRect.width() / (float) mBitmapWidth;
   dy = (mDrawableRect.height() - mBitmapHeight * scale) * 0.5f;
  }
  mShaderMatrix.setScale(scale, scale);
  mShaderMatrix.postTranslate((int) (dx + 0.5f) + mBorderWidth, (int) (dy + 0.5f) + mBorderWidth);
  mBitmapShader.setLocalMatrix(mShaderMatrix);
 }
}

2.xml的引用

<com.common.base.util.CircleImageView
 android:id="@+id/touxian_id"
 android:layout_width="75dp"
 android:layout_height="75dp"
 android:layout_centerHorizontal="true"
 android:layout_centerVertical="true"
 android:src="@drawable/yonghu_touxiang" />

3.activity的实现

private CircleImageView touxiang_id;
touxiang_id = (CircleImageView)findViewById(R.id.touxian_id)
BitmapHelp.displayOnImageView(mContext, holder.touxiang_id, mListy
  .getUser().getPic(), R.drawable.ic_launcher,
  R.drawable.ic_launcher);

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持我们!

(0)

相关推荐

  • Android应用中绘制圆形头像的方法解析

    要画这种圆形带阴影的头像,个人分解成三个图层 1,先画头像边缘的渐变 RadialGradient gradient = new RadialGradient(j/2,k/2,j/2,new int[]{0xff5d5d5d,0xff5d5d5d,0x00ffffff},new float[]{0.f,0.8f,1.0f}, Shader.TileMode.CLAMP); paint.setShader(gradient); canvas.drawCircle(j/2,k/2,j/2,paint

  • Android自定义控件仿QQ编辑和选取圆形头像

    android大家都有很多需要用户上传头像的需求,有的是选方形,有的是圆角矩形,有的是圆形. 首先我们要做一个处理图片的自定义控件,把传入的图片,经过用户选择区域,处理成一定的形状. 有的app是通过在图片上画一个矩形区域表示选中的内容,有的则是通过双指放大缩小,拖动图片来选取图片.圆形头像,还是改变图片比较好 圆形区域可调节大小. 这个自定义View的图像部分分为三个,背景图片,半透明蒙层,和亮色区域--还是直接贴代码得了 package com.example.jjj.widget; imp

  • Android利用CircleImageView实现圆形头像的方法

    CircleImageView实现圆形头像代码分享,供大家参考,具体内容如下 一.创建属性文件(attrs.xml) 具体操作: 1.在项目的values文件底下创建一新的属性文件,文件名为attrs:New->XML->Values XML File:  2.补充attrs.xml代码: <?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleabl

  • 利用Android中BitmapShader制作自带边框的圆形头像

    效果如下: BitmapShader 的简单介绍 关于 Shader是什么,Shader的种类有哪几种以及如何使用不属于本文范畴,对这方面不是很了解的同学,建议先去学习一下 Shader 的基本使用. BitmapShader主要的作用就是 通过Paint对象,对 画布进行指定的Bitmap填充,实现一系列效果,可以有以下三种模式进行选择 1.CLAMP - 拉伸,这里拉伸的是图片的最后一个元素,不断地重复,这个效果,在图片比较小,而所要画的面积比较大的时候会比较明显. 2.REPEAT - 重

  • Android仿QQ圆形头像个性名片

    先看看效果图: 中间的圆形头像和光环波形讲解请看:http://www.jb51.net/article/96508.htm 周围的气泡布局,因为布局RatioLayout是继承自ViewGroup,所以布局layout就可以根据自己的需求来布局其子view,view.layout(int l,int t,int r,int b);用于布局子view在父ViewGroup中的位置(相对于父容器),所以在RatioLayout中计算所有子view的left,top,right,bottom.那么头

  • Android中使用CircleImageView和Cardview制作圆形头像的方法

    圆形头像在我们的日常使用的app中很常见,因为圆形的头像比较美观. 使用圆形图片的方法可能有我们直接将图片裁剪成圆形再在app中使用,还有就是使用自定义View对我们设置的任何图片自动裁剪成圆形. 效果图: 这里使用github上CircleImageView github:https://github.com/hdodenhof/CircleImageView CardView顾名思义卡片式的View,CardView继承的是FrameLayout,所以摆放内部控件的时候需要注意一下 可以设置

  • Android 自定义圆形头像CircleImageView支持加载网络图片的实现代码

    在Android开发中我们常常用到圆形的头像,如果每次加载之后再进行圆形裁剪特别麻烦.所以在这里写一个自定义圆形ImageView,直接去加载网络图片,这样的话就特别的方便. 先上效果图 主要的方法 1.让自定义 CircleImageView 继承ImageView /** * 自定义圆形头像 * Created by Dylan on 2015/11/26 0026. */ public class CircleImageView extends ImageView { } 2.在构造方法中

  • Android使用CircleImageView实现圆形头像的方法

    有时我们在应用中会用到圆形头像,下面是利用CircleImageView实现圆形头像的演示,下面效果和代码,效果如图 实现起来也比较简单,先在项目中建一个circleimageview包用来存放CircleImageView类,待会直接把CircleImageView类复制到包里就可以使用了 然后,再建一个attrs.xml,其代码相当简单,定义了圆形边框宽度和颜色 <?xml version="1.0" encoding="utf-8"?> <r

  • Android实现本地上传图片并设置为圆形头像

    先从本地把图片上传到服务器,然后根据URL把头像处理成圆形头像. 因为上传图片用到bmob的平台,所以要到bmob(http://www.bmob.cn)申请密钥. 效果图: 核心代码: 复制代码 代码如下: public class MainActivity extends Activity {         private ImageView iv;         private String appKey="";                //填写你的Applicatio

  • Android之头像图片变圆形显示

    一:先上效果图 二:实现步骤 1.自定义一个转换工具类 package com.common.base.util; import android.content.Context; import android.content.res.TypedArray; import android.graphics.Bitmap; import android.graphics.BitmapShader; import android.graphics.Canvas; import android.grap

  • vue中使用axios post上传头像/图片并实时显示到页面的方法

    在前端开发中,为了更好的用户体验,在头像上传时会先将图片显示到页面然后点击保存按钮 完成图片的上传成功 代码部分有参考他人的写法. html代码: <div id="myPhoto" v-show="personalPhoto"> <div class="viewPhoto"> <img src="" alt="" id="portrait"style=&q

  • Andorid开发之Picasso通过URL获取用户头像的圆形显示

    1.设置布局属性: <ImageView android:scaleType="fitXY"/> 2.BitmapUtils类-- 得到指定圆形的Bitmap对象 public static Bitmap circleBitmap(Bitmap source) { //获取Bitmap的宽度 int width = source.getWidth(); //以Bitmap的宽度值作为新的bitmap的宽高值. Bitmap bitmap = Bitmap.createBit

  • android 实现APP中改变头像图片的实例代码

    具体代码如下所示: package com.example.studyapplication.fragment; import android.app.Activity; import android.app.AlertDialog; import android.content.Context; import android.content.Intent; import android.graphics.Bitmap; import android.graphics.BitmapFactory

  • Android自定义View之绘制圆形头像功能

    前言 做APP应用开发的时候,用户头像肯定是必不可少的,但是90%以上的需求头像都是圆形的.那么,如何通过自定义View的方式实现圆形头像呢,那么,本片博文会告诉你不仅仅是实现过程.一定会有意想不到的收获哦! 最终效果 国际惯例,我们先来看最终实现的效果图 自定义RoundImageView继承自ImageView public class RoundImageView extends ImageView { public RoundImageView(Context context) { su

  • Android裁剪图片为圆形图片的实现原理与代码

    以前在eoe论坛中找过裁剪图片为圆形图片的方法,但是效果都不是很理想,这几天因为公司业务的要求,需要对头像进行裁剪以圆形的方式显示,这个方法是根据传入的图片的高度(height)和宽度(width)决定的,如果是 width <= height时,则会裁剪高度,裁剪的区域是宽度不变高度从顶部到宽度width的长度:如果 width > height,则会裁剪宽度,裁剪的区域是高度不变,宽度是取的图片宽度的中心区域,不过不同的业务需求,对裁剪图片要求不一样,可以根据业务的需求来调整裁剪的区域.

  • Android使用自定义ImageView实现圆形图片效果

    android中的ImageView只能显示矩形的图片,这样一来不能满足我们其他的需求,比如要显示圆形的图片,这个时候,我们就需要自定义ImageView了,其原理就是首先获取到图片的Bitmap,然后进行裁剪圆形的bitmap,然后在onDraw()进行绘制圆形图片输出. 效果图如下: 自定义的圆形的ImageView类的实现代码如下: package com.xc.xcskin.view; import android.content.Context; import android.grap

  • Android实现带圆环的圆形头像

    在最近写的一个天气APP中用到了圆形头像这样的一个样式,中间是圆形的头像(被圆形切割的图片),周围是一个带颜色的圆环.如下图所示,今天就来说一所它的实现过程. 它的实现也不是特别困难,其实就是用到了BitmapShader这个用法,然后包装成一个paint,最后画出一个圆. 1>实现一个Paint画出以圆形背景的圆. 2>以同样的圆形画出一个稍微小一点的圆,作为它的有色圆环.(此圆和上一个圆颜色不同). 3>用BitmapShader实现一个新的圆,和第二个圆的大小圆心一致. (Bitm

  • Android互联网访问图片并在客户端显示的方法

    本文实例讲述了Android互联网访问图片并在客户端显示的方法.分享给大家供大家参考,具体如下: 1.布局界面 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:

  • Android 编辑头像功能简单实现实例(图片选取,裁剪)

    本文介绍了Android 编辑头像功能的简单实例,可以实现拍照,图片选取,裁剪. 拍照 public static void startCamera(Fragment fragment){ File file=new File(Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_DCIM)+ File.separator+"user_icon.jpg"); Intent intent=new Inten

随机推荐