自定义View绘制详解

代码是我抄的，知识是我理解的，我挥舞着双手，发誓把世界码个明明白白。
效果图奉上，如图所示，这是一个自定义绘制View,外面是一个办个小强将手把手带你敲出来。

我们先在res文件下的values文件下新建一个attrs文件夹，一定先建自己的属性，attrs文件代码如下：

<?xml version="1.0" encoding="utf-8"?>
<resources>
//给自定义控件设置自定义属性
    <declare-styleable name="MyView">
    	<!--name就是自己起的名字，可以是a,是b,但最好见名知意，format的意思就是属性类型的意思-->
        <attr name="textSize" format="dimension"/>
        <attr name="text" format="string"/>
        <attr name="circleColor" format="color"/>
        <attr name="arcColor" format="color"/>
        <attr name="textColor" format="color"/>
        <attr name="startAngle" format="integer" />
        <attr name="sweepAngle" format="integer" />
    </declare-styleable>
 
   <!--
	Ⅰ、textSize——对应中间文本文字的大小
　　Ⅱ、text——对应中间文本
　　Ⅲ、circleColor——对应内圆的颜色
　　Ⅳ、arcColor——对应外环的颜色
　　Ⅴ、textColor——对应文本的颜色
　　Ⅵ、startAngle——对应外环的起始角度
　　Ⅶ、sweepAngle——对应外环扫描角度
   -->
</resources>

这是我写的MyView类，继承了View,代码如下：

package com.example.app3;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.View;

public class MyView extends View {
    private String text;
    private int circleColor;
    private int arcColor;
    private int textColor;
    private float textSize;
    private int startAngle;
    private int sweepAngle;
    private int mCircleXY;
    private float mRadius;
    private Paint mCirclePaint;
    private RectF mRectF;
    private Paint mArcPaint;
    private Paint mTextPaint;
    public MyView(Context context,AttributeSet attrs) {

        super(context, attrs);
        //初始化的时候获取自定义的属性，获取的是主布局中自己赋给自定义属性的值，第二个参数是如果你没有赋值，就是用默认值。
        TypedArray ta=context.obtainStyledAttributes(attrs,R.styleable.MyView);
        if(ta!=null)
        {
            circleColor =ta.getColor(R.styleable.MyView_circleColor,0);
            arcColor=ta.getColor(R.styleable.MyView_arcColor,0);
            textColor=ta.getColor(R.styleable.MyView_textColor,0);
            textSize=ta.getDimension(R.styleable.MyView_textSize,0);
            text=ta.getString(R.styleable.MyView_text);
            startAngle=ta.getInt(R.styleable.MyView_startAngle,0);
            sweepAngle=ta.getInt(R.styleable.MyView_sweepAngle,90);
            ta.recycle();//释放资源
        }
    }

//重写绘制的方法
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        drawSth(canvas);
    }

    private void drawSth(Canvas canvas)
    {
    //初始化方法
        init();
	//画一个圆形，第一个是参数是圆形的x坐标，第二个参数是圆形的y坐标，第三个是圆的半径，第四个是画笔。
        canvas.drawCircle(mCircleXY,mCircleXY,mRadius,mCirclePaint);
        //绘制一个扇形，第一个参数是确定外切矩形的范围，（即位置和大小），第二个是扇形的起始角度，第三个是结束角度，第四个（false）是代表空心扇形,true代表充满的扇形，最后一个是画笔
        canvas.drawArc(mRectF,startAngle,sweepAngle,false,mArcPaint);
        //绘制一个字符串，第一个字符串是自定义属性自己赋值的字符串，第二个字符串的x轴位置，第三个是文字的y轴位置，最后是画笔。
        
        canvas.drawText(text,mCircleXY,mCircleXY+textSize/4,mTextPaint);
    }

    private void init() {
    	//获取当前控件的宽和高
        int length=Math.min(getWidth(),getHeight());
        //得到当前控件一半的大小
        mCircleXY=length/2;
        
        mRadius=length*0.5f/2;
        //设置画笔的抗锯齿
        mCirclePaint=new Paint(Paint.ANTI_ALIAS_FLAG);
        mCirclePaint.setColor(circleColor);
        mRectF=new RectF(length*0.1f,length*0.1f,length*0.9f,length*0.9f);

        mArcPaint=new Paint(Paint.ANTI_ALIAS_FLAG);
        mArcPaint.setColor(arcColor);
        //设置画笔风格（空心或实心）
        mArcPaint.setStyle(Paint.Style.STROKE);
        //设置空心边框的宽度
        mArcPaint.setStrokeWidth((getWidth()*0.1f));


        mTextPaint=new Paint(Paint.ANTI_ALIAS_FLAG);
        mTextPaint.setTextSize(textSize);
        mTextPaint.setColor(textColor);
        //设置文本居中
        mTextPaint.setTextAlign(Paint.Align.CENTER);
    }
}

最后在主布局中调用一下自己自定义的控件，代码如下：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.example.app3.MyView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:startAngle="30"
        app:sweepAngle="240"
        app:text="hehe"
        app:textSize="30sp"
        app:textColor="@color/colorPrimaryDark"
        app:circleColor="@color/colorPrimary"
        app:arcColor="@color/colorAccent"/>

</android.support.constraint.ConstraintLayout>