自定义圆形与圆角图片视图-优快云博客

转载：http://blog.youkuaiyun.com/lmj623565791/article/details/41967509

public class RoundImageView extends ImageView {
  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;
    //矩阵，主要用于缩小放大
    private Matrix mMatrix;
    //渲染图像，使用图像为绘制图形着色
    private BitmapShader mBitmapShader;
    //view的宽度
    private int mWidth;
    private RectF mRoundRect;
    public RoundImageView(Context context) {
        this(context,null);
    }

    public RoundImageView(Context context, AttributeSet attrs) {
        this(context, attrs,0);
    }

    public RoundImageView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        mMatrix = new Matrix();
        mBitmapPaint = new Paint();
        mBitmapPaint.setAntiAlias(true);
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.RoundImageView);
        //默认10dp
        mBorderRadius = typedArray.getDimensionPixelSize(R.styleable.RoundImageView_borderRadius, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, BODER_RADIUS_DEFAULT, getResources().getDisplayMetrics()));
        type = typedArray.getInt(R.styleable.RoundImageView_type, TYPE_CIRCLE);
          typedArray.recycle();
    }
    @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 bitmap = drawableToBimap(drawable);
       mBitmapShader = new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
        float scale  =1.0f;
        if(type == TYPE_CIRCLE){
            //拿到bitmap的宽高的最小值
            int bSize = Math.min(bitmap.getWidth(), bitmap.getHeight());
            scale = mWidth*1.0f/bSize;
        }else if(type == TYPE_ROUND){
          if(!(bitmap.getWidth() == getWidth() && bitmap.getHeight() == getHeight()))
            //如果图片的宽或者高与View不匹配，计算需要缩放比例，缩放后的图片的宽度，一定大于我们view的宽度，所欲我们这里去大值；
            scale = Math.max(getWidth() * 1.0f / bitmap.getWidth(), getHeight() * 1.0f / bitmap.getHeight());
        }
        //shader的变换矩阵，我们这里主要用于放大或者缩小
        mMatrix.setScale(scale , scale);
        mBitmapShader.setLocalMatrix(mMatrix);
        mBitmapPaint.setShader(mBitmapShader);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        if(getDrawable() == null){
            return;
        }
        setUpShader();
        if(type == TYPE_ROUND){
           canvas.drawRoundRect(mRoundRect, mBorderRadius, mBorderRadius, mBitmapPaint);
        }else{
           canvas.drawCircle(mRadius, mRadius, mRadius, mBitmapPaint);
        }
    }

    @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 drawableToBimap(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;

    }

    public static final String STATE_INSTANCE = "state_instance";
    public static final String STATE_TYPE = "state_type";
    public 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 setmBorderRadius(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();//重新确定自己的位置
           // forceLayout();
            invalidate();
        }

    }
    private int dp2px(int dpVal) {

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

attrs

<?xml version="1.0" encoding="utf-8"?>
<resources>

<attr name="borderRadius" format="dimension"/>
    <attr name="type">
        <enum name="circle" value="0"/>
        <enum name="round" value="1"/>
    </attr>
<declare-styleable name="RoundImageView">
    <attr name="borderRadius"/>
    <attr name="type"/>
</declare-styleable>
</resources>

main

public class Main2Activity extends Activity {

    private RoundImageView viewById,viewById1;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);
        viewById = (RoundImageView) findViewById(R.id.image);
        viewById.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                viewById.setType(RoundImageView.TYPE_ROUND);
            }
        });
        viewById1 = (RoundImageView) findViewById(R.id.image1);
        viewById1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                   viewById1.setmBorderRadius(70);

            }
        });
    }
}

布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:xxl="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    tools:context="com.example.administrator.testapplication.Main2Activity">
 <com.example.administrator.testapplication.RoundImageView
    android:id="@+id/image"
     android:layout_width="200dp"
     android:layout_height="200dp"
     android:layout_margin="10dp"
     android:src="@mipmap/a"
     >
 </com.example.administrator.testapplication.RoundImageView>
 <com.example.administrator.testapplication.RoundImageView
     android:id="@+id/image1"
     android:layout_width="200dp"
     android:layout_height="200dp"
     android:layout_margin="10dp"
     android:src="@mipmap/a"
     xxl:borderRadius="20dp"
     xxl:type="round"
     >
 </com.example.administrator.testapplication.RoundImageView>

</LinearLayout>

实现圆形、圆角图片

attrs