自定义 View 基础篇

 No Bi Bi 看代码直接

package com.example.hexl.customerview1;

import android.annotation.TargetApi;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.graphics.RectF;
import android.os.Build;
import android.util.AttributeSet;
import android.view.View;

/**
 * Created by hexl on 16/6/16.
 * 绘制基本图形
 * save 保存当前画布状态
 * restore 回滚到上一次保存的状态
 * translate 相对于当前位置位移
 * rotate 旋转
 */
public class CustomView extends View {

    /* 1.创建一个画笔 */
    private Paint mPaint;

    /* 2.初始化画笔*/
    private void initPaint() {
        mPaint = new Paint(); //初始化画笔
        mPaint.setColor(Color.BLACK); //设置画笔颜色

        mPaint.setStyle(Paint.Style.FILL); //设置画笔模式为填充 这里有三种方式,描边 STROKE 填充 FILL 填充加描边 FILL_AND_STROKE
//        mPaint.setStyle(Paint.Style.STROKE); //设置画笔模式为填充 这里有三种方式,描边 STROKE 填充 FILL 填充加描边 FILL_AND_STROKE
//        mPaint.setStyle(Paint.Style.FILL_AND_STROKE); //设置画笔模式为填充 这里有三种方式,描边 STROKE 填充 FILL 填充加描边 FILL_AND_STROKE

        mPaint.setStrokeWidth(10f); //设置画笔宽度为10px
    }

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

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

    public CustomView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
//        initView();
        initPaint();
    }

    @TargetApi(Build.VERSION_CODES.LOLLIPOP)
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        /*点*/
        canvas.drawPoint(200, 200, mPaint); //在坐标200,200位置绘制一个点
        canvas.drawPoints(new float[]{500, 500, 500, 600, 500, 700}, mPaint); //绘制一组点,坐标由 float 数组指定

        /*线*/
        canvas.drawLine(300, 500, 500, 500, mPaint); //在坐标(300,300) (500,600) 绘制一条线

        /*矩形*/

        /**
         * left 距离屏幕的左边距离
         * top  距离屏幕的上边距离
         * right 矩形左侧边到右侧边的距离
         * bottom 矩形顶部到底部的距离
         */
        canvas.drawRect(100, 300, 300, 600, mPaint);//第一种方式

        Rect rect = new Rect(400, 100, 300, 600); //第二种方式
        canvas.drawRect(rect, mPaint);

        RectF rectF = new RectF(100, 700, 300, 900); //第三种方式


        canvas.drawRect(rectF, mPaint);

        /*圆角矩形*/

        /**
         * 一般我们使用第一种,因为第二种是在 API 21 后出来的
         */
        RectF rectF1 = new RectF(100, 1000, 800, 1200); //第一种 当 rx ry 大于圆角矩形的宽高的2分之1,奇迹就出现了.椭圆

        mPaint.setColor(Color.GRAY); //改变画笔颜色
        canvas.drawRect(rectF1, mPaint); //绘制背景矩形

        mPaint.setColor(Color.RED);
        canvas.drawRoundRect(rectF1, 400, 150, mPaint);

        mPaint.setColor(Color.BLUE);

        canvas.drawRoundRect(100, 1300, 400, 1500, 30, 30, mPaint);//第二种 圆角矩形,上面方法是因为改了, rx ry 的值所以变成椭圆

        /*椭圆*/

        RectF rectF2 = new RectF(350, 50, 800, 200);

        canvas.drawOval(rectF2, mPaint);

        /*圆*/

        canvas.drawCircle(500, 300, 100, mPaint); //绘制一个圆心坐标在(500,500)半径400的圆

        /*圆弧*/

        /**
         * startAngle 开始角度
         * endAngle   结束角度
         * userCenter 是否使用中心
         */

        RectF rectF3 = new RectF(350, 700, 800, 900); //绘制矩形背景

        mPaint.setColor(Color.GRAY);
        canvas.drawRect(rectF3, mPaint);

        mPaint.setColor(Color.BLUE);
//        canvas.drawArc(rectF3,0,90,false,mPaint);  //如果不使用中心点则是圆弧起始点和结束点之间的连线加上圆弧围成的图形(个人认为用到的时候较少)
        canvas.drawArc(rectF3, 0, 90, true, mPaint); //如果使用中心绘制出来的图形为扇形

    }
}

布局文件,