Android 自定义模拟时钟控件

自定义view—透明模拟时钟显示

项目中要用到模拟时钟的显示，查了一些资料根据自己的需要进行了自定义view

思路：重写view，1.根据控件的宽高进行获取模拟时钟的半径大小。2.重写onDraw方法，将画布进行不同角度的旋转进行绘制表盘圆心刻度指针
这里就直接上代码了
自定义的TimeClockView：

package com.eq.viewdemo;import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.os.Handler;
import android.os.Message;
import android.text.TextPaint;
import android.util.AttributeSet;
import android.view.View;import java.util.Calendar;/*** Created by pc on 2017/3/29.*/
public class TimeClockView extends View {private int width;private int height;private Paint mPaintLine;private Paint mPaintCircle;private Paint mPaintHour;private Paint mPaintMinute;private Paint mPaintSec;private TextPaint mPaintText;private Calendar mCalendar;public static final int START_ONDRAW = 0X23;//每隔一秒，在handler中调用一次重新绘制方法private Handler handler = new Handler() {@Overridepublic void handleMessage(Message msg) {switch (msg.what) {case START_ONDRAW:mCalendar = Calendar.getInstance();invalidate();//告诉UI主线程重新绘制handler.sendEmptyMessageDelayed(START_ONDRAW, 1000);break;default:break;}}};public TimeClockView(Context context) {super(context);}public TimeClockView(Context context, AttributeSet attrs) {super(context, attrs);mCalendar = Calendar.getInstance();mPaintLine = new Paint();mPaintLine.setColor(Color.GREEN);mPaintLine.setStrokeWidth(2);mPaintLine.setAntiAlias(true);//设置是否抗锯齿mPaintLine.setStyle(Paint.Style.STROKE);//设置绘制风格mPaintCircle = new Paint();mPaintCircle.setColor(Color.RED);//设置颜色mPaintCircle.setStrokeWidth(2);//设置线宽mPaintCircle.setAntiAlias(true);//设置是否抗锯齿mPaintCircle.setStyle(Paint.Style.FILL);//设置绘制风格mPaintText = new TextPaint();mPaintText.setColor(Color.BLUE);mPaintText.setStrokeWidth(5);mPaintText.setTextAlign(Paint.Align.CENTER);mPaintText.setTextSize(30);mPaintHour = new Paint();mPaintHour.setStrokeWidth(6);mPaintHour.setColor(Color.BLUE);mPaintHour.setAntiAlias(true);mPaintMinute = new Paint();mPaintMinute.setStrokeWidth(4);mPaintMinute.setColor(Color.BLUE);mPaintMinute.setAntiAlias(true);mPaintSec = new Paint();mPaintSec.setStrokeWidth(2);mPaintSec.setColor(Color.BLUE);mPaintSec.setAntiAlias(true);handler.sendEmptyMessage(START_ONDRAW);//向handler发送一个消息，让它开启重绘}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);width = getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec);height = getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec);setMeasuredDimension(width, height);}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);int circleRadius ; //模拟时钟的圆半径大小if (width > height) {circleRadius = height / 2 -10;} else {circleRadius = width / 2 -10;}//画出圆中心canvas.drawCircle(width / 2, height / 2, 5, mPaintCircle);//依次旋转画布，画出每个刻度和对应数字for (int i = 1; i <= 60; i++) {canvas.save();//保存当前画布if (i % 5 == 0) {//将画布进行以圆心以固定的角度旋转进行旋转canvas.rotate(360 / 60 * i, width / 2, height / 2);//设置字体大小，这里是以圆半径的十分之一大小mPaintText.setTextSize(circleRadius / 10);//如果绘制对应的数字时只进行一次旋转是不能达到目标的，需要再次以书写文字的地方在进行反向旋转这样写出来的就是正向的canvas.rotate(-360 / 60 * i, width / 2, height / 2 - circleRadius+5);canvas.drawText("" + i / 5, width / 2, height / 2 - circleRadius+circleRadius / 20 , mPaintText);} else {canvas.rotate(360 / 60 * i, width / 2, height / 2);//左起：起始位置x坐标，起始位置y坐标，终止位置x坐标，终止位置y坐标，画笔(一个Paint对象)canvas.drawCircle(width/2,height/2-circleRadius,2,mPaintCircle);}canvas.restore();}int minute = mCalendar.get(Calendar.MINUTE);//得到当前分钟数int hour = mCalendar.get(Calendar.HOUR);//得到当前小时数int sec = mCalendar.get(Calendar.SECOND);//得到当前秒数String time;if (sec < 10 && hour < 10 && minute < 10) { //都小于10time = "0" + hour + ":0" + minute + ":0" + sec; //02:02:02} else if (sec < 10 && hour < 10 && minute > 9) {//分钟大于9time = "0" + hour + ":" + minute + ":0" + sec; //02:12:02} else if (sec > 9 && hour < 10 && minute < 10) {//秒大于9time = "0" + hour + ":0" + minute + ":" + sec; //02:02:12} else if (sec < 10 && hour > 9 && minute < 10) {//时大于9time = hour + ":0" + minute + ":0" + sec; //12:02:02} else if (sec < 10 && hour > 9 && minute > 9) {//时分于9time = hour + ":" + minute + ":0" + sec; //12:12:02} else if (sec > 9 && hour > 9 && minute < 10) {//时秒大于9time = hour + ":0" + minute + ":" + sec; //12:02:12} else if (sec > 9 && hour < 10 && minute > 9) {//分秒大于9time = "0" + hour + ":" + minute + ":" + sec; //02:12:12} else {time = hour + ":" + minute + ":" + sec; //12:12:12}//绘制中心下方的时间显示mPaintText.setTextSize(circleRadius / 10 * 2);canvas.save();canvas.drawText(time, width / 2, height / 2 + circleRadius / 10 * 4, mPaintText);//绘制时分秒相应的指针float minuteDegree = minute / 60f * 360;//得到分针旋转的角度canvas.save();canvas.rotate(minuteDegree, width / 2, height / 2);canvas.drawLine(width / 2, height / 2 - circleRadius + circleRadius / 3, width / 2, height / 2 + circleRadius / 6, mPaintMinute);canvas.restore();float hourDegree = (hour * 60 + minute) / 12f / 60 * 360;//得到时钟旋转的角度canvas.save();canvas.rotate(hourDegree, width / 2, height / 2);canvas.drawLine(width / 2, height / 2 - circleRadius + circleRadius / 2, width / 2, height / 2 + circleRadius / 9, mPaintHour);canvas.restore();float secDegree = sec / 60f * 360;//得到秒针旋转的角度canvas.save();canvas.rotate(secDegree, width / 2, height / 2);canvas.drawLine(width / 2, height / 2 - circleRadius + 2, width / 2, height / 2 + circleRadius / 4, mPaintSec);canvas.restore();}
}

在布局中进行调用
activity_main.xml :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context="com.eq.viewdemo.MainActivity"><com.eq.viewdemo.TimeClockView
       android:layout_width="match_parent"android:layout_height="match_parent"android:background="#f99"/></RelativeLayout>

到此自定义的模拟时钟就完成了，希望对有需要的朋友起到帮助

Android 自定义模拟时钟控件相关推荐

Android Studio利用时钟控件AnalogClock显示模拟时钟以及TextClock显示数字时钟
前言利用时钟控件AnalogClock快速制作一个模拟时钟.利用TextClock显示数字时钟. 一.AnalogClock是什么? AnalogClock继承的是View,可重写OnDraw方法. ...
Android 自定义时钟控件时针、分针、秒针的绘制这一篇就够了
前言对于 Android 开发者来说,自定义 View 是绕不开的一个坎.二对一自定义 View 自定义时钟必然是首选,那么我们该如何绘制自定义时钟呢?本篇我结合 github 上一个有趣的三方库, ...
C#时钟控件（C# Clock Control）
周末实现了一个比较漂亮的时钟控件,如下图: 功能: (1)自定义样式(时钟边框颜色,小时.分钟.秒针的颜色自定义,自定义时钟内部填充色,刻度及刻度值颜色,刻度可使用矩形或圆形). (2)可作为图片水印 ...
C 时钟控件（C Clock Control）
分享一下我老师大神的人工智能教程!零基础,通俗易懂!http://blog.csdn.net/jiangjunshow 也欢迎大家转载本篇文章.分享知识,造福人民,实现我们中华民族伟大复兴! 周末实现 ...
[发布] 多选控件和时钟控件
关键字:自定义控件(Custom Control),C++,WIN32 SDK 本文发布的是我在工作中开发的自定义控件.第一个是多选控件,该控件主要启发来自于 ExplorerBar,即资源管理器左侧 ...
Android自定义AlertDialog的控件获取操作
Android自定义AlertDialog的控件获取操作在自定义的AlertDialog布局虽然可以显示,但是试过很多方法都不能获得其中的控件进行操作,找了很多方法最后这种方法可以. dialog的 ...
c# winform LED数字时钟控件
包含颜色选择器,日历控件(类似于Google日历),数字时钟,LED等控件 1.日历控件 calendar.rar 2.Office 2003中的颜色选择器 OfficePicker ...
android日历价格控件,Android 自定义价格日历控件
介绍上个星期项目有一个日历价格的需求,类似一个商品在不同的日期价格可能会不同,由于时间给得特别紧所以打算找个合适的开源项目进行修改.参考了网上大多数是通过继承view直接draw一个monthVie ...
Android自定义标签列表控件LabelsView
无论是在移动端的App,还是在前端的网页,我们经常会看到下面这种标签的列表效果: 标签从左到右摆放,一行显示不下时自动换行.这样的效果用Android源生的控件很不好实现,所以往往需要我们自己去自定义 ...

Android 自定义模拟时钟控件

自定义view—透明模拟时钟显示

Android 自定义模拟时钟控件相关推荐

最新文章

热门文章