Android Canvas自定义实现时钟效果

 更新时间:2019年12月20日 09:48:59   作者:ajuan  
这篇文章主要为大家详细介绍了Android Canvas自定义实现时钟效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

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

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

ClockView.java

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使用Rxjava实现倒计时功能

    android使用Rxjava实现倒计时功能

    这篇文章主要为大家详细介绍了android使用Rxjava实现倒计时功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-06-06
  • Flutter实现顶部导航栏功能

    Flutter实现顶部导航栏功能

    这篇文章主要为大家详细介绍了Flutter实现顶部导航栏功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • Android笔记之:App调试的几个命令的实践与分析

    Android笔记之:App调试的几个命令的实践与分析

    本篇文章介绍了,在Android中:App调试的几个命令的实践与分析。需要的朋友参考下
    2013-04-04
  • 屏蔽RecyclerView单边滑动到头阴影(fadingEdge)的方法

    屏蔽RecyclerView单边滑动到头阴影(fadingEdge)的方法

    这篇文章主要给大家介绍了如何屏蔽RecyclerView单边滑动到头阴影(fadingEdge)的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
    2018-04-04
  • Android获取文字高度的三种方法

    Android获取文字高度的三种方法

    这篇文章主要给大家介绍了Android获取文字高度的三种方法,文中通过图文介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-01-01
  • Android编程实现屏幕禁止休眠的方法

    Android编程实现屏幕禁止休眠的方法

    这篇文章主要介绍了Android编程实现屏幕禁止休眠的方法,分析了Android的Manifest.xml设置与代码实现两种操作技巧,需要的朋友可以参考下
    2016-10-10
  • Android编程实现换肤功能实例

    Android编程实现换肤功能实例

    这篇文章主要介绍了Android编程实现换肤功能的方法,结合实例形式较为详细的分析了Android换肤的具体步骤与相关技巧,需要的朋友可以参考下
    2015-12-12
  • Android打开相机和相册实例代码

    Android打开相机和相册实例代码

    这篇文章主要为大家详细介绍了Android打开相机和相册实例代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-08-08
  • Android mvvm之LiveData原理案例详解

    Android mvvm之LiveData原理案例详解

    这篇文章主要介绍了Android mvvm之LiveData原理案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下
    2021-09-09
  • Android开发环境搭建图文教程 亲测有效!

    Android开发环境搭建图文教程 亲测有效!

    这篇文章主要为大家详细介绍了Android开发环境搭建图文教程,亲自测试有效的搭建方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-03-03

最新评论