画一个钟表，陪着我走

其他 2018-07-05 20:45:14 阅读次数: 0

1. 先看看效果图

2：看看属性

    <declare-styleable name="ClocksView">
        <attr name="bgColor" format="color"/>
        <attr name="viewWidth" format="dimension"/>
        <attr name="viewHeight" format="dimension"/>
        <attr name="viewRoundWidth" format="dimension"/>
        <attr name="clockRoundColor" format="integer"/>
        <attr name="clockSecondHandColor" format="integer"/>
        <attr name="clockClockwiseColor" format="integer"/>
        <attr name="clockMinuteHandColor" format="integer"/>
    </declare-styleable>

　简单介绍下：

    /*** view 高 */
    private float viewH = 200;

    /*** view 宽度 */
    private float viewW = 200;

    /**** view 圆环描边宽度 */
    private float PaintStrokeWidth = 3;
    /*** 秒针  描宽*/
    private float SecondStrokeWidth = 3;
    /*** 分针描宽*/
    private float MstrokeWidth = 5;
    /*** 时针 描宽*/
    private float ClockwiseWidth = 7;

    /*** 表盘刻度 描宽*/
    private float clockWidth = 1;

    /*** 钟表圆环颜色 */
    private int clockRoundColor = Color.BLACK;

    /*** 钟表 秒针颜色 */
    private int clockSecondHandColor = Color.RED;

    /*** 钟表时针颜色*/
    private int clockClockwiseColor = Color.BLACK;

    /*** 钟表分针颜色*/
    private int clockMinuteHandColor = Color.BLUE;

    /*** 画笔 */
    private Paint paint;

    /*** textSize */
    private int textSize = 16;

    /*** 中心点的半径*/
    private int centerRadius = 10;


    /*** 小刻度的总数*/
    private int count = 60;

    /***  整点 小刻度的长度*/
    private int KeduLength = 8;

    /*** 非整点 小刻度长度 */
    private int NOKeduLength = 6;

    /*** 时间数值的大小*/
    private int timeCodeSize = 28;

    private  boolean isFrist=true;

    /*** 圆点坐标点*/
    private int centerX, centerY;

　　

    /*** 秒针的长度*/
    private int RadiuSecond = 140;
    /*** 时针的长度*/
    private int RadiusWise = 90;
    /*** 分针的长度*/
    private int RadiusM = 120;

    private int Num = 0;
    /*** 设置时针初始角度*/
    private double wiseAlgle = 0;
    private double wiseNum = 0;

    /*** 设置分针初始角度*/
    private double mAngle = 0;
    private double mNum = 0;

    /*** 设置秒针初始角度*/
    private double secondAngle = 0;
    private double secondNum = 0;

　3：完整类文件

package com.guoxw.clocks;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.os.Build;
import android.support.annotation.Nullable;
import android.support.annotation.RequiresApi;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;

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

/***
 *  1. 该view 的寛高必须一样，便于设置绘制圆形表盘
 *
 *  2.
 */

public class ClocksView extends View {


    /*** view 高 */
    private float viewH = 200;

    /*** view 宽度 */
    private float viewW = 200;

    /**** view 圆环描边宽度 */
    private float PaintStrokeWidth = 3;
    /*** 秒针  描宽*/
    private float SecondStrokeWidth = 3;
    /*** 分针描宽*/
    private float MstrokeWidth = 5;
    /*** 时针 描宽*/
    private float ClockwiseWidth = 7;

    /*** 表盘刻度 描宽*/
    private float clockWidth = 1;

    /*** 钟表圆环颜色 */
    private int clockRoundColor = Color.BLACK;

    /*** 钟表 秒针颜色 */
    private int clockSecondHandColor = Color.RED;

    /*** 钟表时针颜色*/
    private int clockClockwiseColor = Color.BLACK;

    /*** 钟表分针颜色*/
    private int clockMinuteHandColor = Color.BLUE;

    /*** 画笔 */
    private Paint paint;

    /*** textSize */
    private int textSize = 16;

    /*** 中心点的半径*/
    private int centerRadius = 10;


    /*** 小刻度的总数*/
    private int count = 60;

    /***  整点 小刻度的长度*/
    private int KeduLength = 8;

    /*** 非整点 小刻度长度 */
    private int NOKeduLength = 6;

    /*** 时间数值的大小*/
    private int timeCodeSize = 28;

    private  boolean isFrist=true;

    /*** 圆点坐标点*/
    private int centerX, centerY;


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

    public ClocksView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        paint = new Paint();
        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.ClocksView);
        viewH = array.getDimension(R.styleable.ClocksView_viewHeight, 0);
        viewW = array.getDimension(R.styleable.ClocksView_viewWidth, 0);
        clockClockwiseColor = array.getColor(R.styleable.ClocksView_clockClockwiseColor, clockClockwiseColor);
        clockMinuteHandColor = array.getColor(R.styleable.ClocksView_clockMinuteHandColor, clockMinuteHandColor);
        clockSecondHandColor = array.getColor(R.styleable.ClocksView_clockSecondHandColor, clockSecondHandColor);
        array.recycle();
        timer = new Timer();
        timer.schedule(timerTask, 1000, 1000);
    }

    public ClocksView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);

    }

    @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
    public ClocksView(Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
    }



    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        Log.d("Tag:", "onDraw1: " + getLeft() + "--" + getTop());
        centerX = (int) (getLeft() + viewW / 2);
        centerY = (int) (getTop() + viewH / 2);
        if(isFrist){
            endSecondX = centerX;
            endSecondY = centerY;
            endMX = centerX;
            endMY = centerY;
            endWiseX = centerX;
            endWiseY = centerY;
            isFrist=false;
        }

        Log.d("Tag:", "onDraw2: " + centerX + "--" + centerY);
        paint = new Paint();
        drawDialPlate(canvas, centerX, centerY, (int) viewH / 2);
    }

    /**** 时，分 秒 针的初始顶点位置 全部初始为center 点*/
    private float endSecondX , endSecondY, endMX , endMY, endWiseX, endWiseY;

    /***示例中是传参是200,200，表示的表盘的中心点*/
    private void drawDialPlate(Canvas canvas, int centerX, int centerY, int radius) {
        canvas.save();
        /*** 初始化 paint */

        paint.setColor(clockRoundColor);
        paint.setStrokeJoin(Paint.Join.ROUND);
        paint.setStrokeCap(Paint.Cap.ROUND);
        paint.setStrokeWidth(PaintStrokeWidth);
        paint.setAntiAlias(true);
        paint.setStyle(Paint.Style.STROKE);
        canvas.drawCircle(centerX, centerY, radius, paint);
        canvas.save();
        /**** drawtextOnPath 绘制文字 */
        paint.setTextSize(textSize);
        /*** 绘制中心点圆心*/
        paint.setStyle(Paint.Style.FILL);
        canvas.drawCircle(centerX, centerY, centerRadius, paint);
        canvas.save();
        /*** 绘制红色线段，充当 秒针 */
        paint.setColor(clockSecondHandColor);
        paint.setStrokeWidth(SecondStrokeWidth);
        canvas.drawLine(centerX, centerY, endSecondX, endSecondY, paint);
        canvas.save();
        /*** 绘制蓝颜线段，充当分针 */
        paint.setColor(clockMinuteHandColor);
        paint.setStrokeWidth(MstrokeWidth);
        canvas.drawLine(centerX, centerY, endMX, endMY, paint);
        canvas.save();
        /*** 绘制黑色线段，充当时针 */
        paint.setColor(clockClockwiseColor);
        paint.setStrokeWidth(ClockwiseWidth);
        canvas.drawLine(centerX, centerY, endWiseX, endWiseY, paint);
        canvas.save();

        /*** 画表盘刻度  ****/
        Paint timePaint = new Paint(paint);
        timePaint.setStrokeWidth(clockWidth);
        timePaint.setColor(Color.BLACK);
        timePaint.setTextSize(timeCodeSize);
        paint.setColor(Color.BLACK);
        paint.setStrokeWidth(PaintStrokeWidth);
        for (int i = 0; i <= count; i++) {
            if (i % 5 == 0) {
                /*** 整点刻度 */
                canvas.drawLine(centerX, getTop(), centerY, getTop() + KeduLength, paint);
                if (i != 0) {
                    canvas.drawText((String.valueOf(i / 5)), centerX - timeCodeSize / 2, getTop() + 2 + timeCodeSize, timePaint);
                }
            } else {
                /*** 小刻度 */
                canvas.drawLine(centerX, getTop(), centerY, getTop() + NOKeduLength, timePaint);
            }
            /*** 旋转坐标系 */
            canvas.rotate(360 / count, centerX, centerY);
        }


    }


    /*** 秒针的长度*/
    private int RadiuSecond = 140;
    /*** 时针的长度*/
    private int RadiusWise = 90;
    /*** 分针的长度*/
    private int RadiusM = 120;

    private int Num = 0;
    /*** 设置时针初始角度*/
    private double wiseAlgle = 0;
    private double wiseNum = 0;

    /*** 设置分针初始角度*/
    private double mAngle = 0;
    private double mNum = 0;

    /*** 设置秒针初始角度*/
    private double secondAngle = 0;
    private double secondNum = 0;


    private Timer timer;
    private TimerTask timerTask = new TimerTask() {
        @Override
        public void run() {
            if(Num==60*60*12){
                Num=0;
            }
            Num++;
            secondNum = Num % 60;
            double secondNow=180 - (6 * secondNum+secondAngle);
            endSecondX = RadiuSecond * (float) Math.sin(changeAngle(secondNow)) + centerX;
            endSecondY = RadiuSecond * (float) Math.cos(changeAngle(secondNow)) + centerY;

            mNum = Num % (3600);
            double mNow=180 - (360 * mNum / 3600+mAngle);
            endMX = RadiusM * (float) Math.sin(changeAngle(mNow)) + centerX;
            endMY = RadiusM * (float) Math.cos(changeAngle(mNow)) + centerY;

            wiseNum = Num % (3600 * 12);
            double wiseNow=180 - (360 * wiseNum / 3600 / 12+wiseAlgle);
            endWiseX = RadiusWise * (float) Math.sin(changeAngle(wiseNow)) + centerX;
            endWiseY = RadiusWise * (float) Math.cos(changeAngle(wiseNow)) + centerY;
            postInvalidate();
            Log.d("Tag:", "run: ");

        }
    };


    /*** 角度转弧度*/
    private double changeAngle(double angle) {
        return angle * Math.PI / 180;
    }


    /***
     *
     * @param wiseAlgle 设置当前显示时间的 小时  (0-12 )
     * @param mAngle   设置当前显示时间的  分钟  (0-60 )
     * @param secondAngle 设置当前显示时间的 秒数 (0-60 )
     */
    public void setNowTime(int wiseAlgle,int mAngle,int secondAngle){
        this.secondAngle=secondAngle*6;
        this.mAngle=mAngle*360/60+secondAngle/10;
        this.wiseAlgle=wiseAlgle*360/12+mAngle*360/12/60+secondAngle*360/12/60/60;
    }


    public void setClockwiseWidth(float clockwiseWidth) {
        ClockwiseWidth = clockwiseWidth;
    }

    public void setClockWidth(float clockWidth) {
        this.clockWidth = clockWidth;
    }

    public void setClockRoundColor(int clockRoundColor) {
        this.clockRoundColor = clockRoundColor;
    }

    public void setClockSecondHandColor(int clockSecondHandColor) {
        this.clockSecondHandColor = clockSecondHandColor;
    }

    public void setClockClockwiseColor(int clockClockwiseColor) {
        this.clockClockwiseColor = clockClockwiseColor;
    }

    public void setClockMinuteHandColor(int clockMinuteHandColor) {
        this.clockMinuteHandColor = clockMinuteHandColor;
    }


    public void setPaintStrokeWidth(float paintStrokeWidth) {
        PaintStrokeWidth = paintStrokeWidth;
    }

    public void setSecondStrokeWidth(float secondStrokeWidth) {
        SecondStrokeWidth = secondStrokeWidth;
    }

    public void setMstrokeWidth(float mstrokeWidth) {
        MstrokeWidth = mstrokeWidth;
    }


    public void setTextSize(int textSize) {
        this.textSize = textSize;
    }

    public void setCenterRadius(int centerRadius) {
        this.centerRadius = centerRadius;
    }


    public void setKeduLength(int keduLength) {
        KeduLength = keduLength;
    }

    public void setNOKeduLength(int NOKeduLength) {
        this.NOKeduLength = NOKeduLength;
    }

    public void setTimeCodeSize(int timeCodeSize) {
        this.timeCodeSize = timeCodeSize;
    }


    public void setRadiuSecond(int radiuSecond) {
        RadiuSecond = radiuSecond;
    }

    public void setRadiusWise(int radiusWise) {
        RadiusWise = radiusWise;
    }

    public void setRadiusM(int radiusM) {
        RadiusM = radiusM;
    }

}

　4： 使用很简单  如：设置时间为 8:30:23 

       <com.guoxw.clocks.ClocksView
            android:id="@+id/clocksView"
            android:layout_width="400dp"
            android:layout_height="400dp"
            app:viewHeight="200dp"
            app:viewWidth="200dp"
            />

　

 ClocksView clocksView=findViewById(R.id.clocksView);
  clocksView.setNowTime(8,30,23);

　　

5：code

链接: https://pan.baidu.com/s/1CYJjRpGtyV68y8T5LQK3WA 密码: hsfs

　　

猜你喜欢

转载自www.cnblogs.com/galibujianbusana/p/9270292.html
今日推荐
《美国对全球网络空间安全与发展的威胁和破坏》报告发布
火速冲上 GitHub 热榜 —— 开源编程语言、框架哪有这么可爱？
北京人形机器人创新中心发布全球首个纯电驱拟人奔跑的全尺寸人形机器人“天工”
LFOSSA 源来如此公开课 | 掌握云原生未来：CNCF 认证全面攻略与备考秘籍
周排行
循环神经网络（rnn）讲解
Tigao教程四：单独的关节运动
金蝶K3WISE15.0-注册套打教程
如何在Mac上配置Kubernetes
Android应用结束自身进程的方法
SpringMVC学习 十三 拦截器栈
中国驻洛杉矶总领馆举行新春招待会
HttpClient get post 发送
11 - three.js 笔记 - 绘制三维字体模型
Mysql递归获取某个父节点下面的所有子节点和子节点上的所有父节点
每日归档
更多
2024-05-01(4)
2024-04-30(1)
2024-04-29(40)
2024-04-28(0)
2024-04-27(56)
2024-04-26(39)
2024-04-25(22)
2024-04-24(36)
2024-04-23(26)
2024-04-22(39)

代码天地 © 2018 codetd.com

境外服务器   最新电视剧2022