自定义View

自定义View

自定义View分类

• ①自绘控件：顾名思义，这一类自定义控件注重控件本身的特性，如形状、动画效果等，一般继承View（但也不绝对，看具体需求），重写onDraw（）方法完成绘制。
• ②组合控件：组合控件的特点是使用原生控件组合成新的控件。
• ③继承控件：继承控件的特点是利用了父控件本身的一些特性，在此基础上添加新的功能。充分利用已有资源，避免了重复的开发。

时钟案例（思路+代码）

• 1.首先创建一个JAVA类继承于View，里面有四个构造器，一般情况下调用前2个构造器，

• 2.进行绘制图形操作（详细见代码部分）

• 3.绘制完成后为了实现秒针、分针和时针的走动，需要不断的向UI线程发送消息从而进行重新绘制，这就需要用到Handler向UI线程不断发送消息，同时不断得到当前系统时间刷新绘图的位置。必须要调用invalidate();方法提醒UI线程进行重新绘制

• 4.在布局文件中要调用自定义View需要写上包名+路径（com.my.mywidget.widget.MyView）这样才可以被真正的调用

• 5.代码实现

public class MyView extends View{
    private int width;
    private int heigth;
    private Paint mPaintLine;
    private Paint mPaintCircle;
    private Paint mPaintText;
    private Paint mPaintPoint;
    private Calendar mCalendar;
    public static final int NEED_REFRESH=0x23;
    private Handler handler=new Handler(){
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            switch (msg.what){
                case NEED_REFRESH:
                    mCalendar=Calendar.getInstance();
                    invalidate();//提醒UI线程重新绘制
                    handler.sendEmptyMessageDelayed(NEED_REFRESH,1000);//相当于迭代，每隔1s就发送一个空消息，告诉UI线程进行重绘操作
                    break;
            }
        }
    };
//    View有4个构造器
    public MyView(Context context) {
        super(context);
    }

    public MyView(Context context, AttributeSet attrs) {
        super(context, attrs);
        mCalendar=Calendar.getInstance();//初始化Calendar，得到当前时间

        mPaintLine=new Paint();
        mPaintLine.setColor(Color.BLACK);//设置颜色
        mPaintLine.setAntiAlias(true);//设置抗锯齿
        mPaintLine.setStrokeWidth(10);//设置线条宽度

        mPaintCircle=new Paint();
        mPaintCircle.setStrokeWidth(10);//设置线条宽度
        mPaintCircle.setColor(Color.BLACK);//设置颜色
        mPaintCircle.setAntiAlias(true);//设置抗锯齿
        mPaintCircle.setStyle(Paint.Style.STROKE);//设置为空心

        mPaintText=new Paint();
        mPaintText.setColor(Color.BLUE);//设置颜色
        mPaintText.setTextAlign(Paint.Align.CENTER);//设置对齐方式
        mPaintText.setAntiAlias(true);//设置抗锯齿
        mPaintText.setTextSize(30);//设置字体大小

        mPaintPoint=new Paint();
        mPaintPoint.setAntiAlias(true);//设置抗锯齿
        mPaintPoint.setStyle(Paint.Style.FILL);//设置为FILL
        mPaintPoint.setStrokeWidth(10);//设置宽度
        mPaintPoint.setColor(Color.BLACK);//设置颜色

        handler.sendEmptyMessage(NEED_REFRESH);//向Handler发送一个空消息
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        width=getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec);//得到系统默认的宽度
        heigth=getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec);//得到系统默认的高度
        setMeasuredDimension(width,heigth);//将默认宽高设置上去
    }
    //onDraw是有UI线程调用，不需要做其他处理
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
//        canvas.drawLine(0,600,600,600,mPaintLine);
//        canvas.drawCircle(300,300,100,mPaintCircle);
        canvas.drawCircle(width/2,heigth/2,300,mPaintCircle);
        canvas.drawCircle(width/2,heigth/2,10,mPaintPoint);
        //利用for循环绘制时钟的时刻信息
        for (int i=1;i<=12;i++){
            // canvas.save();和canvas.restore();需要配合使用
            //先保存，然后进行旋转，然后画线，最后在转到初始位置，
            canvas.save();//保存当前画布状态
            canvas.rotate(360/12*i,width/2,heigth/2);//第一参数代表旋转角度，第二和第三个参数代表旋转中心
            canvas.drawLine(width/2,heigth/2-300,width/2,heigth/2-280,mPaintLine);//前两个表示起始位置，第三和第四个表示末位置，最后一个表示画笔
            canvas.drawText(""+i,width/2,heigth/2-250,mPaintText);//第一个是文本内容，第二和第三个表示显示文本位置
            canvas.restore();//恢复到保存的画布状态
        }

            int minutes = mCalendar.get(Calendar.MINUTE);//得到当前时间的分钟数
            int hours = mCalendar.get(Calendar.HOUR);//得到当前时间的小时数
            int second=mCalendar.get(Calendar.SECOND);//得到当前时间的秒数

            canvas.save();
            Float minutesDegree = minutes / 60f * 360;//得到当前分钟数所占的角度
            canvas.rotate(minutesDegree, width / 2, heigth / 2);
            canvas.drawLine(width / 2, heigth / 2 - 200, width / 2, heigth / 2 + 20, mPaintLine);
            canvas.restore();

            canvas.save();
            Float hoursDegree = (hours * 60 + minutes) / 12f / 60 * 360;//得到当前小时数所占的角度
            canvas.rotate(hoursDegree, width / 2, heigth / 2);
            canvas.drawLine(width / 2, heigth / 2 - 100, width / 2, heigth / 2 + 30, mPaintLine);
            canvas.restore();

            canvas.save();
            Float secondDegree = second/60f*360;//得到当前小时数所占的角度
            canvas.rotate(secondDegree, width / 2, heigth / 2);
            canvas.drawLine(width / 2, heigth / 2 - 240, width / 2, heigth / 2 + 40, mPaintLine);
            canvas.restore();

    }
}

圆形ImageView(代码)

package com.lucasey.demo0808;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.util.AttributeSet;
import android.widget.ImageView;
/**
 * 20行代码写出一个圆形的imageview
 * @author Administrator
 */
public class CircleImage extends ImageView{

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

    @Override
    protected void onDraw(Canvas canvas) {
        //获得图片的宽度
        int width=getWidth();
        //获得图片的高度
        int height=getHeight();
        //短的二分之一作为半径
        int radius=height>width?width/2:height/2;

        //重新定义的一个画布，这一步很关键
        Paint mPaint = new Paint();
        //抗锯齿
        mPaint.setAntiAlias(true);
        Bitmap bitmap = Bitmap.createBitmap(width,height,
                Bitmap.Config.ARGB_8888);
        Canvas bitmapCanvas = new Canvas(bitmap);
        super.onDraw(bitmapCanvas);

        //圆形的框
        Bitmap cB = Bitmap.createBitmap(width, height,
                Bitmap.Config.ARGB_8888);
        Canvas cCanv = new Canvas(cB);
        //在控件中间画一个
        cCanv.drawCircle(width/ 2, height/ 2, radius,
                mPaint);

        canvas.drawBitmap(bitmap, 0.0f, 0.0f, mPaint);
        //dst是后画的图形
        mPaint.setXfermode(new PorterDuffXfermode(
                PorterDuff.Mode.DST_IN));
        //一定要用之前的画布，不然会出现边角是黑色
        bitmapCanvas.drawBitmap(cB, 0.0f, 0.0f, mPaint);

        //给图形加边框
        Paint paint =new Paint();
        paint.setAntiAlias(true);
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(5);
        paint.setColor(Color.BLACK);
        canvas.drawCircle(width/ 2, height/ 2, radius,
                paint);
    }

}