android 小米时钟的实现

不多说，先上个效果图

代码也贴出来了：

package com.example.administrator.testmyidea.myView;

import android.content.Context;
import android.graphics.*;
import android.util.AttributeSet;
import android.view.View;

import java.util.Timer;
import java.util.TimerTask;

public class xiaomiClock extends View {
    private Paint textPaint,colokPaint,rPaint,paint;
    private Path mTriangle;
    private Timer mTimer;
    private float agree=0;
    Shader fshader,mshader;
    PathEffect mEffect;
    public xiaomiClock(Context context) {
        super(context);
    }

    public xiaomiClock(Context context, AttributeSet attrs) {
        super(context, attrs);
        mEffect=new DashPathEffect(new float[]{4,6,},0);
        mshader=new SweepGradient(500,500,Color.parseColor("#1d8a7d"),Color.WHITE);
        fshader=new SweepGradient(500,500,Color.GREEN,Color.RED);

        textPaint=new Paint();
        textPaint.setStrokeWidth(16);
        textPaint.setColor(Color.WHITE);
        textPaint.setStrokeCap(Paint.Cap.ROUND);
        textPaint.setAntiAlias(true);

        colokPaint=new Paint();
        colokPaint.setStrokeWidth(8);
        colokPaint.setColor(Color.parseColor("#018172"));
        colokPaint.setAntiAlias(true);
        colokPaint.setStrokeCap(Paint.Cap.ROUND);

        paint =new Paint();
        paint.setAntiAlias(true);

        rPaint = new Paint();
        rPaint.setColor(Color.WHITE);
        rPaint.setAntiAlias(true);
        rPaint.setStyle(Paint.Style.STROKE);

        mTriangle=new Path();
        mTriangle.moveTo(791, 500);// 此点为多边形的起点
        mTriangle.lineTo((float) (791-Math.sqrt(1200)), 525);
        mTriangle.lineTo((float) (791-Math.sqrt(1200)), 475);
        mTriangle.close();
        setmTimer();
        System.out.println("度数"+((float)6.0/10));
    }

    @Override
    protected void onDraw(Canvas canvas) {
        canvas.drawColor(Color.parseColor("#018172"));
        //中心小圆
        canvas.drawCircle(500,500,19,textPaint);

        //外围白色圆圈
        canvas.drawCircle(500,500,230,rPaint);

//        //手表指针
        colokPaint.setColor(Color.WHITE);
        canvas.drawLine(500,500,500+getheith(200,100),600,colokPaint);
        canvas.drawLine(500,500,500+getheith(140,70),400,colokPaint);
        canvas.drawPoint(350,500+getheith(230,150),textPaint);
        colokPaint.setColor(Color.parseColor("#018172"));

//        //手表最中心绿色小圆
        canvas.drawCircle(500,500,10,colokPaint);

        //绘画手表盘
        drawbeauty(canvas);


    }

    public void drawbeauty(Canvas canvas){
        int canvasWidth = canvas.getWidth();
        int canvasHeight = canvas.getHeight();
        //设置缓存层，因为下面要实用xfermode，使用xfemode必须使用缓存层，否则会出现黑色背景
        int layerId = canvas.saveLayer(0, 0, canvasWidth, canvasHeight, null, Canvas.ALL_SAVE_FLAG);

        //初始化画笔，因为上下两层做画需要的画笔属性不一样，所以只能每次重新设置一次
        //设置画笔为不填充模式
        paint.setStyle(Paint.Style.STROKE);

        //设置笔画样式，这里设置的是虚线样式
        paint.setPathEffect(mEffect);

        //设置笔画宽度
        paint.setStrokeWidth(40);

        //画一个纯色表盘，虚线，空心圆形
        canvas.drawCircle(500,500,320,paint);

        //设置画笔属性，SRC_IN属性，让第二个图案只能花在第一个图案上面，也就是只能画在上面所说那个纯色表盘里面
        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));

        //把画笔虚线属性去掉，因为我要的是一个实心圆形，然后让这个实心但是颜色不一样圆形画在上面所说表盘上面，
        // 因为设置了xfermode，所以显示的一样会是虚线圆形表盘，但是颜色会变成你现在的颜色
        paint.setPathEffect(null);

        //设置画笔shader属性，这里设置的是SweepGradient模式，可以让颜色过渡泾渭分明，以圆形为中心开始变化
        paint.setShader(mshader);
        paint.setStyle(Paint.Style.FILL);

        //保存画布
        canvas.save();

        //旋转画布，然后你就会发现时钟表盘开始动了
        canvas.rotate(agree,500,500);
        canvas.drawRect(100, 100, 900, 900, paint);
        canvas.drawPath(mTriangle,textPaint);
        canvas.restore();
        //最后将画笔去除Xfermode
        paint.setXfermode(null);
        canvas.restoreToCount(layerId);
    }

    private void setmTimer(){
        mTimer=new Timer();
        mTimer.schedule(new TimerTask() {
            @Override
            public void run() {
                agree=agree+((float)6.0/100);
                if(agree>360)agree=0;
                System.out.println("旋转"+agree);
                postInvalidate();
            }
        },100,10);
    }

    private float getheith(int xie,int di){
        return (float) Math.sqrt(Math.pow(xie,2)-Math.pow(di,2));
    }
}