自定义ImageView

自定义ImageView,可以在xml文件中选择是否为圆形图片,以及圆角的大小

先来个效果图:


下面来看代码:

----自定义属性

<declare-styleable name="CustomRoundAngleImageView">
        <attr name="circle" format="boolean"></attr>
        <attr name="roundWidth" format="dimension" />
        <attr name="roundHeight" format="dimension" />
    </declare-styleable>


---自己写个类继承ImageView

**
 * 实现圆角image
 *
 * @author czq
 *
 */
public class CustomRoundAngleImageView extends ImageView {

    private Paint paint;
    /**
     * 圆角的x半径
     */
    private int roundWidth = 20;
    /**
     * 圆角的y半径
     */
    private int roundHeight = 20;
    private Paint paint2;
    /**
     * 父控件的宽度
     */
    private int rootWidth;
    /**
     * 父控件的高度
     */
    private int rootHeight;
    /**
     * 是否画园
     */
    private boolean isCircle = false;
    public CustomRoundAngleImageView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(context, attrs);
    }

    public CustomRoundAngleImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs);
    }

    public CustomRoundAngleImageView(Context context) {
        super(context);
        init(context, null);
    }

    private void init(Context context, AttributeSet attrs) {

        if (attrs != null) {
            TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.RoundAngleImageView);
            isCircle = a.getBoolean(R.styleable.CustomRoundAngleImageView_circle,false);
            if (isCircle){
                //圆形图片
                roundHeight = rootWidth/2;
                roundHeight = rootHeight/2;
            }else {
                roundWidth = a.getDimensionPixelSize(R.styleable.RoundAngleImageView_roundWidth, roundWidth);
                roundHeight = a.getDimensionPixelSize(R.styleable.RoundAngleImageView_roundHeight, roundHeight);
            }
        } else {
            float density = context.getResources().getDisplayMetrics().density;
            roundWidth = (int) (roundWidth * density);
            roundHeight = (int) (roundHeight * density);
        }

        paint = new Paint();
        paint.setColor(Color.WHITE);
        paint.setAntiAlias(true);
        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OUT));

        paint2 = new Paint();
        paint2.setXfermode(null);
    }

    @Override
    public void draw(Canvas canvas) {
        Bitmap bitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);
        Canvas canvas2 = new Canvas(bitmap);
        super.draw(canvas2);
        drawLiftUp(canvas2);
        drawLiftDown(canvas2);
        drawRightUp(canvas2);
        drawRightDown(canvas2);
        canvas.drawBitmap(bitmap, 0, 0, paint2);
        bitmap.recycle();
    }
    /**
     * 画左上部分
     * @param canvas
     */
    private void drawLiftUp(Canvas canvas) {
        Path path = new Path();
        path.moveTo(0, roundHeight);
        path.lineTo(0, 0);
        path.lineTo(roundWidth, 0);
        path.arcTo(new RectF(0, 0, roundWidth * 2, roundHeight * 2), -90, -90);
        path.close();
        canvas.drawPath(path, paint);
    }
    /**
     * 画左下部分
     * @param canvas
     */
    private void drawLiftDown(Canvas canvas) {
        Path path = new Path();
        path.moveTo(0, getHeight() - roundHeight);
        path.lineTo(0, getHeight());
        path.lineTo(roundWidth, getHeight());
        path.arcTo(new RectF(0, getHeight() - roundHeight * 2, roundWidth * 2, getHeight()), 90, 90);
        path.close();
        canvas.drawPath(path, paint);
    }
    /**
     * 画右下部分
     * @param canvas
     */
    private void drawRightDown(Canvas canvas) {
        Path path = new Path();
        path.moveTo(getWidth() - roundWidth, getHeight());
        path.lineTo(getWidth(), getHeight());
        path.lineTo(getWidth(), getHeight() - roundHeight);
        path.arcTo(new RectF(getWidth() - roundWidth * 2, getHeight() - roundHeight * 2, getWidth(), getHeight()), -0, 90);
        path.close();
        canvas.drawPath(path, paint);
    }

    /**
     * 画右上部分
     * @param canvas
     */
    private void drawRightUp(Canvas canvas) {
        Path path = new Path();
        path.moveTo(getWidth(), roundHeight);
        path.lineTo(getWidth(), 0);
        path.lineTo(getWidth() - roundWidth, 0);
        path.arcTo(new RectF(getWidth() - roundWidth * 2, 0, getWidth(), 0 + roundHeight * 2), -90, 90);
        path.close();
        canvas.drawPath(path, paint);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        rootWidth = getMeasuredWidth();
        rootHeight = getMeasuredHeight();
    }
}

---在布局文件中的使用

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:id="@+id/ll_root"
    android:background="#000000"
    android:orientation="vertical"
    android:gravity="center_horizontal"
    xmlns:CustomRoundAngleImageView = "http://schemas.android.com/apk/res-auto"
    android:layout_height="match_parent">

    <com.pandacredit.administrator.customview.RoundAngleImageView
        CustomRoundAngleImageView:roundHeight="60dp"
        CustomRoundAngleImageView:roundWidth="60dp"
        android:layout_width="120dp"
        android:layout_margin="20dp"
        android:scaleType="centerCrop"
        android:src="@mipmap/guide1080_3"
        android:layout_height="120dp" />
    <com.pandacredit.administrator.customview.RoundAngleImageView
        CustomRoundAngleImageView:roundHeight="30dp"
        CustomRoundAngleImageView:roundWidth="100dp"
        android:layout_width="120dp"
        android:layout_margin="20dp"
        android:scaleType="centerCrop"
        android:src="@mipmap/guide1080_3"
        android:layout_height="120dp" />
    <com.pandacredit.administrator.customview.RoundAngleImageView
        CustomRoundAngleImageView:circle="true"
        android:layout_width="120dp"
        android:layout_margin="20dp"
        android:scaleType="centerCrop"
        android:src="@mipmap/guide1080_3"
        android:layout_height="120dp" />
</LinearLayout>

就这样简单的就实现了。如果你有非常棒的自定义控件,记得一起分享哦,我的邮箱:chenzhiqiutw@qq.com


  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值