自定义圆形和圆角图片

转载 2015年11月18日 10:39:20



 package com.zsd.neighbour.page.others;



import com.zsd.neighbour.R;


import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Bitmap;
import android.graphics.BitmapShader;
import android.graphics.Canvas;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.Shader.TileMode;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.os.Parcelable;
import android.util.AttributeSet;
import android.util.Log;
import android.util.TypedValue;
import android.widget.ImageView;
/**
 * http://blog.csdn.net/lmj623565791/article/details/41967509
 * 
 * @author zhy
 * 
 */
public class RoundImageView extends ImageView
{
/**
* 图片的类型,圆形or圆角
*/
private int type;
public static final int TYPE_CIRCLE = 0;
public static final int TYPE_ROUND = 1;
/**
* 圆角大小的默认值
*/
private static final int BODER_RADIUS_DEFAULT = 10;
/**
* 圆角的大小
*/
private int mBorderRadius;


/**
* 绘图的Paint
*/
private Paint mBitmapPaint;
/**
* 圆角的半径
*/
private int mRadius;
/**
* 3x3 矩阵,主要用于缩小放大
*/
private Matrix mMatrix;
/**
* 渲染图像,使用图像为绘制图形着色
*/
private BitmapShader mBitmapShader;
/**
* view的宽度
*/
private int mWidth;
private RectF mRoundRect;


public RoundImageView(Context context, AttributeSet attrs)
{


super(context, attrs);
mMatrix = new Matrix();
mBitmapPaint = new Paint();
mBitmapPaint.setAntiAlias(true);


TypedArray a = context.obtainStyledAttributes(attrs,
R.styleable.RoundImageView);


mBorderRadius = a.getDimensionPixelSize(
R.styleable.RoundImageView_borderRadius, (int) TypedValue
.applyDimension(TypedValue.COMPLEX_UNIT_DIP,
BODER_RADIUS_DEFAULT, getResources()
.getDisplayMetrics()));// 默认为10dp
type = a.getInt(R.styleable.RoundImageView_type, TYPE_CIRCLE);// 默认为Circle


a.recycle();
}


public RoundImageView(Context context)
{
this(context, null);
}


@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
super.onMeasure(widthMeasureSpec, heightMeasureSpec);


/**
* 如果类型是圆形,则强制改变view的宽高一致,以小值为准
*/
if (type == TYPE_CIRCLE)
{
mWidth = Math.min(getMeasuredWidth(), getMeasuredHeight());
mRadius = mWidth / 2;
setMeasuredDimension(mWidth, mWidth);
}


}


/**
* 初始化BitmapShader
*/
private void setUpShader()
{
Drawable drawable = getDrawable();
if (drawable == null)
{
return;
}


Bitmap bmp = drawableToBitamp(drawable);
// 将bmp作为着色器,就是在指定区域内绘制bmp
mBitmapShader = new BitmapShader(bmp, TileMode.CLAMP, TileMode.CLAMP);
float scale = 1.0f;
if (type == TYPE_CIRCLE)
{
// 拿到bitmap宽或高的小值
int bSize = Math.min(bmp.getWidth(), bmp.getHeight());
scale = mWidth * 1.0f / bSize;


} else if (type == TYPE_ROUND)
{
Log.e("TAG",
"b'w = " + bmp.getWidth() + " , " + "b'h = "
+ bmp.getHeight());
if (!(bmp.getWidth() == getWidth() && bmp.getHeight() == getHeight()))
{
// 如果图片的宽或者高与view的宽高不匹配,计算出需要缩放的比例;缩放后的图片的宽高,一定要大于我们view的宽高;所以我们这里取大值;
scale = Math.max(getWidth() * 1.0f / bmp.getWidth(),
getHeight() * 1.0f / bmp.getHeight());
}


}
// shader的变换矩阵,我们这里主要用于放大或者缩小
mMatrix.setScale(scale, scale);
// 设置变换矩阵
mBitmapShader.setLocalMatrix(mMatrix);
// 设置shader
mBitmapPaint.setShader(mBitmapShader);
}


@Override
protected void onDraw(Canvas canvas)
{
Log.e("TAG", "onDraw");
if (getDrawable() == null)
{
return;
}
setUpShader();


if (type == TYPE_ROUND)
{
canvas.drawRoundRect(mRoundRect, mBorderRadius, mBorderRadius,
mBitmapPaint);
} else
{
canvas.drawCircle(mRadius, mRadius, mRadius, mBitmapPaint);
// drawSomeThing(canvas);
}
}


@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh)
{
super.onSizeChanged(w, h, oldw, oldh);


// 圆角图片的范围
if (type == TYPE_ROUND)
mRoundRect = new RectF(0, 0, w, h);
}


/**
* drawable转bitmap

* @param drawable
* @return
*/
private Bitmap drawableToBitamp(Drawable drawable)
{
if (drawable instanceof BitmapDrawable)
{
BitmapDrawable bd = (BitmapDrawable) drawable;
return bd.getBitmap();
}
int w = drawable.getIntrinsicWidth();
int h = drawable.getIntrinsicHeight();
Bitmap bitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bitmap);
drawable.setBounds(0, 0, w, h);
drawable.draw(canvas);
return bitmap;
}


private static final String STATE_INSTANCE = "state_instance";
private static final String STATE_TYPE = "state_type";
private static final String STATE_BORDER_RADIUS = "state_border_radius";


@Override
protected Parcelable onSaveInstanceState()
{
Bundle bundle = new Bundle();
bundle.putParcelable(STATE_INSTANCE, super.onSaveInstanceState());
bundle.putInt(STATE_TYPE, type);
bundle.putInt(STATE_BORDER_RADIUS, mBorderRadius);
return bundle;
}


@Override
protected void onRestoreInstanceState(Parcelable state)
{
if (state instanceof Bundle)
{
Bundle bundle = (Bundle) state;
super.onRestoreInstanceState(((Bundle) state)
.getParcelable(STATE_INSTANCE));
this.type = bundle.getInt(STATE_TYPE);
this.mBorderRadius = bundle.getInt(STATE_BORDER_RADIUS);
} else
{
super.onRestoreInstanceState(state);
}


}


public void setBorderRadius(int borderRadius)
{
int pxVal = dp2px(borderRadius);
if (this.mBorderRadius != pxVal)
{
this.mBorderRadius = pxVal;
invalidate();
}
}


public void setType(int type)
{
if (this.type != type)
{
this.type = type;
if (this.type != TYPE_ROUND && this.type != TYPE_CIRCLE)
{
this.type = TYPE_CIRCLE;
}
requestLayout();
}


}


public int dp2px(int dpVal)
{
return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,
dpVal, getResources().getDisplayMetrics());
}


}



最后在XML中定义圆角的大小属性:app:borderRadius="20dp"  app:type="round",圆角值为小数,圆形值为大
   

自定义View(1)--圆形图片、圆角图片的实现

之前说过会将项目中运用的东西抽离出来做一个总结,今天我主要想总结一下圆角和圆形头像问题。由于我们的应用涉及到很多用户头像,如果所有的图像都是方方正正的话,那显得不是很美观,所以设计湿强行要我将头像圆角...
  • u011512180
  • u011512180
  • 2015年06月26日 16:21
  • 853

android中用Fresco实现圆角图片和圆形图片

android中用Fresco实现圆角图片和圆形图片
  • aotian16
  • aotian16
  • 2016年11月25日 14:58
  • 1852

自定义圆形图片、可控位置圆角图片

一.原理1.下面的Xfermode子类可以改变这种行为: AvoidXfermode 指定了一个颜色和容差,强制Paint避免在它上面绘图(或者只在它上面绘图)。 PixelXorXfermod...
  • u011102153
  • u011102153
  • 2016年08月23日 11:27
  • 1273

canvas处理图片为圆形或圆角矩形

将bitmap处理为圆形或圆角矩形可以使用canvas重新绘图,通过设置背景与图片的相交部分显示来得到圆形或圆角矩形图片处理为圆形图片的方法public static Bitmap getCircle...
  • okm6666
  • okm6666
  • 2015年12月12日 19:33
  • 2140

Android圆角图片和圆形图片实现总结

Android研发中经常会遇见圆角或者圆形图片的展示,但是系统中ImageView并不能直接支持,需要我们自己做一些处理,来实现圆角图片或者圆形图片,自己最近对这块的实现做了一下总结....
  • xiaohanluo
  • xiaohanluo
  • 2016年10月27日 15:14
  • 6823

Imageloader四种图片显示(圆形,淡入,圆角,修饰)使用

这一长篇我们来看这四种图片显示在代码中如何使用,以开源组件中的例子为准。 先看一组圆形和淡入动画的效果  这个淡入为了能看清效果我的时间改成了10s; 圆角的效果图:   1....
  • whr0227
  • whr0227
  • 2016年08月19日 17:12
  • 1627

php生成圆角图片

  • sugang_ximi
  • sugang_ximi
  • 2014年06月14日 17:58
  • 12346

Android中使用Picasso将图片直接转换为圆形

圆形头像现在很流行了,Github上也有很多开源的库,最经典的是直接使用一个自定义的圆形ImageViwe,比较有代表性的有这个项目:hdodenhof/CircleImageView。但是,如果你的...
  • codezjx
  • codezjx
  • 2016年05月04日 23:10
  • 6390

Bootstrap—实现圆角、圆形头像和响应式图片

Bootstrap提供了四种用于类的样式,分别是: .img-rounded:圆角 (IE8 不支持),添加 border-radius:6px 来获得图片圆角; .img-circle:圆形 (IE...
  • nongweiyilady
  • nongweiyilady
  • 2016年12月13日 10:53
  • 7946

<Unity3D UGUI>用UGUI方式实现图片的遮罩,圆角图片,圆形图片效果

实现图片的圆角效果,圆形图片效果,是一个很常见的功能,如下 很多人会使用shader来做,但是太麻烦了,网上关于UGUI实现这种效果的方法我也一直没有找到 我这里知道一个很简单的方法,不用写一行...
  • jjjjjj123321
  • jjjjjj123321
  • 2017年01月05日 19:30
  • 4690
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:自定义圆形和圆角图片
举报原因:
原因补充:

(最多只允许输入30个字)