圆的自定义

2018-01-26  本文已影响0人  snail10

提高技能从自定义View开始,从今天开始走上自定义疯狂学习之路。首先来一波最简单的圆的自定义。对于自定义View的原理这里不说,以后的自定义每次都会提上一点

第一步:三个构造函数(最少需要两个构造方法,三个比较好点,因为两个构造函数的时候可能编译的时候会有问题)

public CircleView(Context context) {
        super(context);
    }

    public CircleView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
    }

    public CircleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }
接着在每个构造函数中添加一个初始化方法,用来设置圆的一些属性,比如颜色,即下一步可如此,这里需要说明一下Paint的STyle的三种属性,刚好发现网上有这张解析,就盗了过来 image.png
    int mColor = Color.RED;
   private Paint paint;
    public CircleView(Context context) {
        super(context);
        init();
    }

    public CircleView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public CircleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        paint = new Paint();
        paint.setColor(mColor);
        paint.setAntiAlias(true);//抗锯齿
        paint.setStyle(Paint.Style.FILL);//样式
    }

到了这里还没有完成,自定义的三大流程,onDraw、onMeasure、onLayout一个都没有实现到。由于这个自定义圆比较简单,我这次仅是使用了onDraw的方法将圆绘制出来,方法如下:

@Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        int paddingLeft = getPaddingLeft();
        int paddingRight = getPaddingRight();
        int paddingTop = getPaddingTop();
        int paddingBottom = getPaddingBottom();
        int width = getWidth() - paddingLeft - paddingRight;
        int height = getHeight() - paddingTop - paddingBottom;
        int radius = Math.min(width,height)/2;
        canvas.drawCircle(paddingLeft + width/2,paddingTop + height/2,radius,paint);
    }

看到上面的方法,有没有人注意到,方法中多了getPaddingLeft();getPaddingRight();...的方法。为什么呢?这是因为当你仅以getWidth与getHeight方法获取到的长宽的时候,在布局文件中想要使用padding相关的属性是没有办法使用的,但是如果想上面这样写就不会出现padding无法使用的情况。
最后复制完整路径到布局文件

<com.example.zhou.view.CircleView
        android:layout_marginTop="10dp"
        android:layout_width="match_parent"
        android:layout_height="140dp"
        />

运行,恩成功了,贴上这次自定义圆的所有代码


public class CircleView extends View {

    int mColor = Color.RED;
    private Paint paint;


    public CircleView(Context context) {
        super(context);
        init();
    }

    public CircleView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public CircleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        paint = new Paint();
        paint.setColor(mColor);
        paint.setAntiAlias(true);//抗锯齿
        paint.setStyle(Paint.Style.FILL);
    }



    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        int paddingLeft = getPaddingLeft();
        int paddingRight = getPaddingRight();
        int paddingTop = getPaddingTop();
        int paddingBottom = getPaddingBottom();
        int width = getWidth() - paddingLeft - paddingRight;
        int height = getHeight() - paddingTop - paddingBottom;
        int radius = Math.min(width,height)/2;
        canvas.drawCircle(paddingLeft + width/2,paddingTop + height/2,radius,paint);
    }
}
上一篇下一篇

猜你喜欢

热点阅读