美文网首页
canvas基础之 倒计时炫酷效果

canvas基础之 倒计时炫酷效果

作者: 萝卜仔1 | 来源:发表于2017-03-22 22:12 被阅读0次

    整体思路

    先定义一些常量 比如小球的半径 固定的坐标位置 颜色, 重点是一个2维数组用来记录数字的阵列

    获取时间,在定时器执行绘制和更新的函数

    绘制函数 需要获取当前的时间 ,所以定义一个专门用来获取当前时间的函数即可

    在绘制函数中获取当前时间具体时 分 秒  在对应的阵列把数字画上去,通过双重for循环遍历拿到点阵数据

    判断是否为一,为一就画一个圆,这样就可以显示具体的时间在点阵上

    更新函数用来获取当前时间和下一次的时间 做一个判断 当两个时间不相等的时候 就添加小球

    所以创建一个添加小球的方法  用一个数组把小球放进去 在绘制时间时候同时把小球也一同绘制,不同的是,彩色小球会运动

    所以定义一个让小球运动的函数,里面进行运动的函数,并且判断何时清除小球,  

    关键点,时间与点阵的如何绘制成对应的数字  何时需要添加小球 

    相关文章

      网友评论

          本文标题:canvas基础之 倒计时炫酷效果

          本文链接:https://www.haomeiwen.com/subject/yhuanttx.html