服务器之家:专注于VPS、云服务器配置技术及软件下载分享
分类导航

PHP教程|ASP.NET教程|Java教程|ASP教程|编程技术|正则表达式|C/C++|IOS|C#|Swift|Android|VB|R语言|JavaScript|易语言|vb.net|

服务器之家 - 编程语言 - Android - Android Canvas自定义实现时钟效果

Android Canvas自定义实现时钟效果

2022-11-11 16:04ajuan Android

这篇文章主要为大家详细介绍了Android Canvas自定义实现时钟效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

Android之Canvas自定义画一个时钟,供大家参考,具体内容如下

自定义控件,在安卓是也是一种无所不能的技术了,所有自带控件,以及组合自带控件不能实现的一些效果,我们都可以通过自定义控件来实现,不过,如果能有系统控件使用的就用系统自带的控件去实现,而不必要用自定义去实现,我们都知道,自定义控件在一定的程度上,效率往往会比系统自带的控件效率低,所以我不到万不得已,不要使用自定义控件,今天用自定一控件,实现一个小小的时钟,具体的实现在代码中注释功能。

ClockView.java

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
public class ClockView extends View implements Handler.Callback {
 
 //定义一个画笔
 private Paint paint;
 //定义个画小时指针的路径
 private Path hour;
 //定义一个画分针的路径
 private Path minute;
 //定义一个Handler来实现时钟跑动效果
 private Handler handler = new Handler(this);
 
 public ClockView(Context context) {
  this(context, null);
 }
 
 public ClockView(Context context, AttributeSet attrs) {
  this(context, attrs, 0);
 }
 
 public ClockView(Context context, AttributeSet attrs, int defStyleAttr) {
  super(context, attrs, defStyleAttr);
  //创建一个画笔
  this.paint = new Paint();
  //创建一个时针路径,用于绘制时针
  hour = new Path();
  //首先将点定位到时针尾部,所有的坐标,大家可以根据圆心点去寻找对应的点
  hour.moveTo(500, 380);
  //然后与(185,500)连接一条线
  hour.lineTo(485, 500);
  //然后与(500,515)连接一条线
  hour.lineTo(500, 515);
  //最后绘制成一个完整的时针线条了,效果为图中的绿色线条
  hour.lineTo(515, 500);
  //创建一个分针路径
  minute = new Path();
  minute.moveTo(500, 350);
  minute.lineTo(490, 500);
  minute.lineTo(500, 510);
  //最后连接成一条分针线条
  minute.lineTo(510, 500);
  //一开始就发送消息,让时钟开始运行
  handler.sendEmptyMessage(0);
 
 }
 
 @TargetApi(Build.VERSION_CODES.N)
 @Override
 protected void onDraw(Canvas canvas) {
  super.onDraw(canvas);
  //首先设置画布为黑色
  canvas.drawColor(0xff000000);
  //获取屏幕的宽,和高的比例,选取最小的比例,这样就能让图片位于中间了。
  float scale = Math.min(getWidth() / 1000.0f, getHeight() / 1000.0f);
  //设置画布的比例
  canvas.scale(scale, scale);
  //将图片绘制在屏幕的中间
  canvas.translate((getWidth() / scale - 1000) / 2, (getHeight() / scale - 1000) / 2);
  //设置画笔类型为空心的
  paint.setStyle(Paint.Style.STROKE);
  //颜色为白色
  paint.setColor(0xffffffff);
  //画笔的粗细
  paint.setStrokeWidth(5);
  //将上面所有绘制的内容进行保存一下
  canvas.save();
  //开始绘制一个时钟外圆
  canvas.drawCircle(500, 500, 200, paint);
  //通过for循环绘制12个小时的时钟刻度
  for (int i = 0; i < 12; i++) {
   if (i % 3 == 0) {//绘制12 3 6 9点时刻
    paint.setStrokeWidth(5);//设置粗度为5
    canvas.drawLine(500, 300, 500, 320, paint);
   } else {
    paint.setStrokeWidth(2);
    canvas.drawLine(500, 300, 500, 315, paint);
   }
   canvas.rotate(30, 500, 500);//将圆围绕圆点旋转30度,每30度绘制一个刻度
  }
  paint.setStrokeWidth(3);
  paint.setColor(0xff00ff00);
  paint.setStyle(Paint.Style.FILL);
  //定义一个Calendar时钟类
  Calendar calendar = Calendar.getInstance();
  //将上面所有绘制的东西保存下来
  canvas.save();
  //通过获取系统的时钟,然后绘制到对应的时针
  canvas.rotate(calendar.get(Calendar.HOUR) * 30 + calendar.get(Calendar.MINUTE), 500, 500);
  //绘制时针
  canvas.drawPath(hour, paint);
  //重绘上一次的时钟
  canvas.restore();
  //设置分针的颜色为红色
  paint.setColor(0xffff0000);
  //根据系统获取的时间旋转到对应的角度
  canvas.rotate(calendar.get(Calendar.MINUTE) * 6 + calendar.get(Calendar.SECOND) * 0.1f, 500, 500);
  //绘制分针
  canvas.drawPath(minute, paint);
  paint.setColor(Color.WHITE);
  paint.setStrokeWidth(2);
  canvas.save();
  canvas.rotate(calendar.get(Calendar.SECOND) * 6, 500, 500);
  //绘制秒针
  canvas.drawLine(500, 330, 500, 510, paint);
  canvas.restore();
  canvas.save();
 }
 
 /**
  * 通过Handler更新时钟走向
  * @param message
  * @return
  */
 @Override
 public boolean handleMessage(Message message) {
  switch (message.what) {
   case 0:
    //重新掉用onDraw方法
    invalidate();
    //每隔一秒绘制一次
    handler.sendEmptyMessageDelayed(0, 1000);
    break;
  }
  return true;
 }
}

通过如上的代码就能简单的绘制一个时钟了,我个人的美观不太好,所以只能绘制成如下的效果,还是那句话,对于能自定义控件不到万不得已就不要用。

Android Canvas自定义实现时钟效果

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。

原文链接:https://blog.csdn.net/qq_27630169/article/details/52454519

延伸 · 阅读

精彩推荐