Android自定义View实现时钟效果

本文实例为大家分享了Android自定义View实现时钟效果的具体代码,供大家参考,具体内容如下

自定义时钟

初学自定义View,先画一个不太成熟的时钟(甚至只有秒针)

时钟效果

@SuppressLint("DrawAllocation")
public class ClockView extends View {

    private final Context mContext;
    private Canvas mCanvas;// 画布
    private Paint clockPaint;// 表盘画笔
    private Paint textPaint;// 文字画笔
    private Paint secondPaint;// 秒针画笔
    private int x,y;// 表中心坐标
    private Thread refreshThread;
    private boolean isStop = false;
    // 用于获取当前秒数
    private  Date currentDate;
    private SimpleDateFormat sp = new SimpleDateFormat("ss");

    @SuppressLint("HandlerLeak")
    private final Handler mHandler = new Handler(){
        @Override
        public void handleMessage(@NonNull Message msg) {
            super.handleMessage(msg);
            if(msg.what == 0){
                invalidate();//每隔一秒刷新一次
            }
        }
    };

    public ClockView(Context context) {
        this(context,null);
    }

    public ClockView(Context context, @Nullable AttributeSet attrs) {
        this(context,null,0);
    }

    public ClockView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        this(context,null,0,0);
    }

    public ClockView(Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
        this.mContext = context;
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int widthMeasure;
        // 设置宽高一致
        if(widthMeasureSpec > heightMeasureSpec){
            super.onMeasure(heightMeasureSpec, heightMeasureSpec);
            widthMeasure  = getMeasuredHeight();
        }else{
            super.onMeasure(widthMeasureSpec, widthMeasureSpec);
            widthMeasure = getMeasuredWidth();
        }
        initPaint(widthMeasure);
    }

    private void initPaint(int width){
        // 表盘画笔
        clockPaint = new Paint();
        clockPaint.setColor(mContext.getColor(R.color.black));// 颜色
        clockPaint.setAntiAlias(true);// 抗锯齿
        clockPaint.setStyle(Paint.Style.STROKE);// 样式
        clockPaint.setStrokeWidth(width/80f);// 宽度

        //字体画笔
        textPaint = new Paint();
        textPaint.setColor(mContext.getColor(R.color.black));
        textPaint.setAntiAlias(true);
        textPaint.setStyle(Paint.Style.FILL);
        textPaint.setTextSize(width/16f);
        textPaint.setTextAlign(Paint.Align.CENTER);

        // 秒针画笔
        secondPaint = new Paint();
        secondPaint.setColor(mContext.getColor(R.color.red));
        secondPaint.setAntiAlias(true);
        secondPaint.setStyle(Paint.Style.FILL);
        secondPaint.setStrokeWidth(5f);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        mCanvas = canvas;

        // 获取画布中心坐标
        x = getWidth() / 2;
        y = getHeight() / 2;

        // 绘制表盘
        mCanvas.drawCircle(x, y,getWidth()/40f, clockPaint);// 表盘中心
        mCanvas.drawCircle(x, y, x -getWidth()/40f, clockPaint);// 表盘边框

        // 绘制刻度
        for(int i = 1;i <= 60;i++){
            mCanvas.rotate(6, x, y);
            if(i%5 == 0){
                // 绘制大刻度
                mCanvas.drawLine(x, getWidth()*3/80f, x, getWidth()*5/80f, clockPaint);
            }else{
                // 绘制小刻度
                mCanvas.drawLine(x, getWidth()*3/80f, x, getWidth()/20f, clockPaint);
            }
        }

        // 绘制 1-12小时 字体
        for(int i = 1;i <= 60;i++){
            if(i%5 == 0){
                float x1 = (float) Math.sin(Math.toRadians(6 * i)) * (y * 3 / 4f) + x;
                float y1 = y - (float) Math.cos(Math.toRadians(6 * i)) * (y * 3 / 4f) + getWidth()/40f;
                mCanvas.drawText(String.valueOf(i/5), x1, y1, textPaint);
            }
        }

        // 绘制秒针
        currentDate = new Date(System.currentTimeMillis());
        int ss = Integer.parseInt(sp.format(currentDate));// 获取当前秒数
        // 根据当前秒数 计算出秒针的 start 及 end 坐标
        float sin = (float) Math.sin(Math.toRadians(6 * ss));
        float cos = (float) Math.cos(Math.toRadians(6 * ss));
        float x0 = x - sin * (y / 10f);
        float y0 = y + cos * (y / 10f);
        float x1 = x + sin * (y * 13 / 20f);
        float y1 = y - cos * (y * 13 / 20f);
        mCanvas.drawLine(x0, y0, x1, y1, secondPaint);
        mCanvas.drawCircle(x, y,getWidth()/80f, secondPaint);
    }

    @Override
    protected void onAttachedToWindow() {
        super.onAttachedToWindow();
        refreshThread = new Thread(){
            @Override
            public void run() {
                super.run();
                while (!isStop){
                    SystemClock.sleep(1000);
                    mHandler.sendEmptyMessage(0);
                }
            }
        };
        refreshThread.start();
    }

    @Override
    protected void onDetachedFromWindow() {
        super.onDetachedFromWindow();
        mHandler.removeCallbacksAndMessages(null);
        isStop = true;
    }

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

(0)

相关推荐

  • Android多功能时钟开发案例(基础篇)

    本文我们进入Android多功能时钟开发实战学习,具体的效果可以参考手机上的时钟,内容如下 首先我们来看一看布局文件layout_main.xml 整个布局: <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/container" android:layout_width="match_parent" androi

  • Android实现简单时钟View的方法

    通过Canvas的平移与旋转简化绘图逻辑是一个非常有用的技巧,下面的时钟view就是利用这个方法完成的,省去了使用三角函数计算坐标的麻烦. package com.example.swt369.simpleclock; import android.content.Context; import android.graphics.Canvas; import android.graphics.Paint; import android.support.annotation.Nullable; i

  • Android仿小米时钟效果

    我在一个[博客] android高仿小米时钟(使用Camera和Matrix实现3D效果)上面看到了小米时钟实现.特别感兴趣.就认真的看了一遍.并自己敲了一遍.下面说下我自己的理解和我的一些改进的地方效果真的特别棒就发布了自己的时钟应用. 先上图(电脑没有gif截图软件.大家凑合看.哪个软件好也可以给我推荐下) 话不多说,首先自定义控件XimiClockView继承view  并做一些初始化的操作 看到的漂亮时钟图片我自己画的效果图(以后妈妈再也不用担心我迟到了) public XimiCloc

  • android高仿小米时钟(使用Camera和Matrix实现3D效果)

    继续练习自定义View..毕竟熟才能生巧.一直觉得小米的时钟很精美,那这次就搞它~这次除了练习自定义View,还涉及到使用Camera和Matrix实现3D效果. 一个这样的效果,在绘制的时候最好选择一个方向一步一步的绘制,这里我选择由外到内.由深到浅的方向来绘制,代码步骤如下: 1.首先老一套~新建attrs.xml文件,编写自定义属性如时钟背景色.亮色(用于分针.秒针.渐变终止色).暗色(圆弧.刻度线.时针.渐变起始色),新建MiClockView继承View,重写构造方法,获取自定义属性值

  • Android编程基于自定义控件实现时钟功能的方法

    本文实例讲述了Android编程基于自定义控件实现时钟功能的方法.分享给大家供大家参考,具体如下: 在学习安卓群英传自定义控件章节的时候,有一个例子是绘制时钟,在实现了书上的例子后就想看这个时钟能不能动起来. 这里选择延迟一秒发送消息重绘view来实现的动画,对外提供了开启时钟,关闭时钟的方法,当activity执行onResume方法的时候,执行startClock()方法,当移除view或activity执行onStop方法的时候可以执行stopClock()方法. 首先根据view的宽高来

  • android实现widget时钟示例分享

    一.在 AndroidManifest.xml文件中配置Widgets: 复制代码 代码如下: <manifest xmlns:android="http://schemas.android.com/apk/res/android"    package="com.example.widget"    android:versionCode="1"    android:versionName="1.0" >   

  • Android获取设备CPU核数、时钟频率以及内存大小的方法

    本文实例讲述了Android获取设备CPU核数.时钟频率以及内存大小的方法.分享给大家供大家参考,具体如下: 因项目需要,分析了一下 Facebook 的开源项目 - Device Year Class. Device Year Class 的主要功能是根据 CPU核数.时钟频率 以及 内存大小 对设备进行分级.代码很简单,只包含两个类: DeviceInfo -> 获取设备参数, YearClass -> 根据参数进行分级. 下表是 Facebook 公司提供的分级标准,其中 Year 栏表

  • Android 仿日历翻页、仿htc时钟翻页、数字翻页切换效果

    废话不多说,效果图: 自定义控件找自网络,使用相对简单,具体还没有来得及深入研究,只是先用笨方法大概实现了想要的效果,后续有空会仔细研究再更新文章, 本demo切换方法是用的笨方法,也就是由新数字和旧数字相比较来切换数字变换的,大致使用方法如下: //获取输入框中的数字 int newNumber = Integer.parseInt(etInput.getText().toString()); //获取个.十.百位数字 int nbai = newNumber / 100; int nshi

  • Android自定义动态壁纸开发(时钟)

    看到有些手机酷炫的动态壁纸,有没有好奇过他们是如何实现的,其实我们自己也可以实现. 先看效果 上图是动态壁纸钟的一个时钟. 我们先来看看 Livewallpaper(即动态墙纸)的实现,Android的动态墙纸并不是GIF图片,而是一个标准的Android应用程序,也就是APK.既然是应用程序,当然意味着天生具有GIF图片不具备的功能--能与用户发生交互,而且动态的背景变化绝不仅仅局限于GIF图片那般只能是固定的几张图片的循环播放.但是我们在这里没有加入与用户交互的动作,只是加入一个时钟(当然时

  • Android多功能时钟开发案例(实战篇)

    上一篇为大家介绍的是Android多功能时钟开发基础内容,大家可以回顾一下,Android多功能时钟开发案例(基础篇) 接下来进入实战,快点来学习吧. 一.时钟 在布局文件中我们看到,界面上只有一个TextView,这个TextView的作用就是显示一个系统的当前时间,同时这个时间还是一秒一秒跳的,要实现一秒一秒的跳就需要我们每隔一秒就要刷新一下,同时我们这里还考虑了切换到另一个Tab的时候,这个时间就不跳动了,这样就会减少这个对系统的占用,考虑到了这点我们在这里用到了Handler,通过han

随机推荐