Android 사용자 정의 View 원형 컷 효과 구현

사용자 정의 View 를 사용 하여 원형 ImageView 의 효 과 를 실현 합 니 다.구체 적 인 내용 은 다음 과 같 습 니 다.

현재 원형 테 두 리 를 조정 해 야 하 는데,여기에 문제 가 좀 있다.
사고의 방향 을 실현 하 다.
Paint 를 사용 하여 얻 은 Bitmap 를 paint 의 Shader 로 설정 합 니 다.설정 이 완료 되면 Matrix 를 사용 하여 그림 을 가운데 로 조정 하고 RectF 제약 테 두 리 를 사용 하여 마지막 으로 그립 니 다.
Paint 초기 화,Shader 설정

private void init() {
 getBitmapFromDrawable();
 if (mBitmap == null) {
  return;
 }
 mShader = new BitmapShader(mBitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);

 // bitmap paint
 mFillPaint = new Paint();
 mFillPaint.setAntiAlias(true);
 mFillPaint.setStyle(Paint.Style.FILL);
 mFillPaint.setShader(mShader);

 // border paint
 mBoundPaint = new Paint();
 mBoundPaint.setAntiAlias(true);
 mBoundPaint.setStyle(Paint.Style.STROKE);
 mBoundPaint.setStrokeWidth(mBorderWidth);
 mBoundPaint.setColor(mBorderColor);

 // border rectF
 mBorderBound.set(calculateBitmapBound());

 // bitmap rectF
 mBitmapBound.set(calculateBitmapBound());
 mBitmapBound.inset(mBorderWidth - 10, mBorderWidth - 10);
 updateShaderMatrix();

 }
Drawable 가 져 오기

private Bitmap getBitmapFromDrawable() {
 Drawable drawable = getDrawable();
 if (drawable instanceof BitmapDrawable) {
  mBitmap = ((BitmapDrawable) drawable).getBitmap();
  mBitmapWidth = mBitmap.getWidth();
  mBitmapHeight = mBitmap.getHeight();
  return mBitmap;
 }
 return null;
 }
여백 을 계산 하 다

 /**
 *   Bitmap  
 */
 private RectF calculateBitmapBound() {
 int availableWidth = getWidth() - getPaddingLeft() - getPaddingRight();
 int availableHeight = getHeight() - getPaddingTop() - getPaddingBottom();
 int sideLength = Math.min(availableWidth, availableHeight); //      
 mRadius = sideLength / 2;

 int left = getPaddingLeft() + (availableWidth - sideLength) / 2;
 int top = getPaddingTop() + (availableHeight - sideLength) / 2;

 Log.d(TAG, "calculateBitmapBound: left >>> " + left + " top >>> " + top + " right >>> "
  + (left + sideLength) + " right >>> " + top + " bottom >>> " + (top + sideLength));
 return new RectF(left, top, left + sideLength, top + sideLength);
 }
그림 모서리 만 보이 지 않도록 Matrix 조정

 /**
 *       ,     CenterCrop
 */
 private void updateShaderMatrix() {
 float scale;
 float dx = 0;
 float dy = 0;

 mShaderMatrix.set(null);

 //     ,     
 if (mBitmapWidth * mBitmapBound.height() > mBitmapBound.width() * mBitmapHeight) {
  scale = mBitmapBound.height() / (float) mBitmapHeight;
  dx = (mBitmapBound.width() - mBitmapWidth * scale) * 0.5f;
 } else {
  scale = mBitmapBound.width() / (float) mBitmapWidth;
  dy = (mBitmapBound.height() - mBitmapHeight * scale) * 0.5f;
 }

 Log.d(TAG, "updateShaderMatrix: scale >>> " + scale);
 mShaderMatrix.setScale(scale, scale);
 // TODO: 16-10-15 http://chroya.iteye.com/blog/713869
 //      ,      
 mShaderMatrix.postTranslate((int) (dx + 0.5f) + mBitmapBound.left, (int) (dy + 0.5f) + mBitmapBound.top);

 mShader.setLocalMatrix(mShaderMatrix);
 }
onDraw

 @Override
 protected void onDraw(Canvas canvas) {
 if (mBitmap == null) {
  super.onDraw(canvas);
 }
 Log.d(TAG, "onDraw: centerX >>> " + mBitmapBound.centerX() + " centerY >>> " + mBitmapBound.centerY());
 canvas.drawCircle(mBitmapBound.centerX(), mBitmapBound.centerY(), mRadius, mFillPaint);
 //     
 canvas.drawCircle(mBorderBound.centerX(), mBorderBound.centerY(), mRadius, mBoundPaint);
 }
전체 코드

/**
 * Created by shixi_tianrui1 on 16-10-7.
 *        ImageView
 */

public class CircleImageView extends ImageView {

 private static final String TAG = "LOGGER";

 private BitmapShader mShader;
 private Paint mFillPaint; //   
 private Paint mBoundPaint; //     

 private Bitmap mBitmap;
 private Drawable mDrawable;

 private int mBorderColor; //     
 private float mBorderWidth; //     

 private RectF mBorderBound = new RectF();
 private RectF mBitmapBound = new RectF();
 private Matrix mShaderMatrix = new Matrix();

 private int mRadius;
 private int mBitmapWidth;
 private int mBitmapHeight;

 private static final float DEFAULT_BORDER_WIDTH = 5;

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

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

 public CircleImageView(Context context, AttributeSet attrs, int defStyleAttr) {
 super(context, attrs, defStyleAttr);
 TypedArray a = getResources().obtainAttributes(attrs, R.styleable.CircleImageView);
 mBorderColor = a.getColor(R.styleable.CircleImageView_borderColor, Color.BLUE);
 mBorderWidth = a.getDimension(R.styleable.CircleImageView_borderWidth, DEFAULT_BORDER_WIDTH);
 mBorderWidth = a.getDimensionPixelSize(R.styleable.CircleImageView_borderWidth, 20);
 a.recycle();
 }

 private void init() {
 getBitmapFromDrawable();
 if (mBitmap == null) {
  return;
 }
 mShader = new BitmapShader(mBitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);

 // bitmap paint
 mFillPaint = new Paint();
 mFillPaint.setAntiAlias(true);
 mFillPaint.setStyle(Paint.Style.FILL);
 mFillPaint.setShader(mShader);

 // border paint
 mBoundPaint = new Paint();
 mBoundPaint.setAntiAlias(true);
 mBoundPaint.setStyle(Paint.Style.STROKE);
 mBoundPaint.setStrokeWidth(mBorderWidth);
 mBoundPaint.setColor(mBorderColor);

 // border rectF
 mBorderBound.set(calculateBitmapBound());

 // bitmap rectF
 mBitmapBound.set(calculateBitmapBound());
 mBitmapBound.inset(mBorderWidth - 10, mBorderWidth - 10);
 updateShaderMatrix();

 }

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

 /**
 *   Bitmap  
 */
 private RectF calculateBitmapBound() {
 int availableWidth = getWidth() - getPaddingLeft() - getPaddingRight();
 int availableHeight = getHeight() - getPaddingTop() - getPaddingBottom();
 int sideLength = Math.min(availableWidth, availableHeight); //      
 mRadius = sideLength / 2;

 int left = getPaddingLeft() + (availableWidth - sideLength) / 2;
 int top = getPaddingTop() + (availableHeight - sideLength) / 2;

 Log.d(TAG, "calculateBitmapBound: left >>> " + left + " top >>> " + top + " right >>> "
  + (left + sideLength) + " right >>> " + top + " bottom >>> " + (top + sideLength));
 return new RectF(left, top, left + sideLength, top + sideLength);
 }


 private Bitmap getBitmapFromDrawable() {
 Drawable drawable = getDrawable();
 if (drawable instanceof BitmapDrawable) {
  mBitmap = ((BitmapDrawable) drawable).getBitmap();
  mBitmapWidth = mBitmap.getWidth();
  mBitmapHeight = mBitmap.getHeight();
  return mBitmap;
 }
 return null;
 }

 @Override
 protected void onDraw(Canvas canvas) {
 if (mBitmap == null) {
  super.onDraw(canvas);
 }
 Log.d(TAG, "onDraw: centerX >>> " + mBitmapBound.centerX() + " centerY >>> " + mBitmapBound.centerY());
 canvas.drawCircle(mBitmapBound.centerX(), mBitmapBound.centerY(), mRadius, mFillPaint);
 //     
 canvas.drawCircle(mBorderBound.centerX(), mBorderBound.centerY(), mRadius, mBoundPaint);
 }


 /**
 *       ,     CenterCrop
 */
 private void updateShaderMatrix() {
 float scale;
 float dx = 0;
 float dy = 0;

 mShaderMatrix.set(null);

 //     ,     
 if (mBitmapWidth * mBitmapBound.height() > mBitmapBound.width() * mBitmapHeight) {
  scale = mBitmapBound.height() / (float) mBitmapHeight;
  dx = (mBitmapBound.width() - mBitmapWidth * scale) * 0.5f;
 } else {
  scale = mBitmapBound.width() / (float) mBitmapWidth;
  dy = (mBitmapBound.height() - mBitmapHeight * scale) * 0.5f;
 }

 Log.d(TAG, "updateShaderMatrix: scale >>> " + scale);
 mShaderMatrix.setScale(scale, scale);
 // TODO: 16-10-15 http://chroya.iteye.com/blog/713869
 //      ,      
 mShaderMatrix.postTranslate((int) (dx + 0.5f) + mBitmapBound.left, (int) (dy + 0.5f) + mBitmapBound.top);

 mShader.setLocalMatrix(mShaderMatrix);
 }
}
아직 문제 가 좀 있어 서 해결 되면 바로 업데이트 하 겠 습 니 다.
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.

좋은 웹페이지 즐겨찾기