模拟时钟
课程内容
时钟包含时、分、秒3个指针,分别控制3个指针旋转,指针旋转角度根据时间进行转换,可获取当前时间或根据输入的任意时间走时,可设置闹铃时间
课程目标
- 了解时间工具的使用
- 了解设置角色不同中心点效果
- 知道如何将时间和角度进行转换
- 了解循环嵌套的使用
- 掌握时分秒间的转换
课程概要
- 制作时钟面板
- 点击绘制新角色
- 在位图编辑模式下,绘制浅蓝色实心圆形
- 切换到矢量图编辑模式,绘制十字交叉的线,将中心设为交叉点
- 挑战实心圆位置,使其中心对准到十字交叉线
- 在中心点绘制浅蓝色(比刚才的颜色深一些)空心外边框
- 在中心点绘制空心暗浅蓝色圆形
- 当小绿旗被点击时,移到x:0 y:0
- 制作时钟大刻度
- 复制面板角色,此时可删除面板的十字交叉线
- 删除面板边框、中心圆孔
- 在面板正上方内侧绘制暗浅蓝色小矩形
- 删除面板
- 将角色命名为大刻度
- 编写大刻度生成代码
- 添加位置变量
- 当小绿旗被点击时,移到x:0 y:0
- 将位置设定为1
- 重复执行11次
- 克隆自己
- 将位置增加1
- 当作为克隆体启动时
- 右转 位置*(360/12) 度
- 制作时钟小刻度
- 复制时钟大刻度,命名为小刻度
- 点击造型,适当缩小角色
- 修改代码,将重复执行次数修改为59次
- 将 360/12 修改为 360/60
- 制作时针
- 复制小刻度,删除代码,此时可删除大小刻度的十字交叉线
- 选择线段工具,设置白色,设置线段大小
- 绘制原点到正上方大刻度的直线,缩短直线底部,留一些距离
- 复制直线,适当减小线段粗细,放置于原点到直线之间垂直对齐
- 在原点处绘制空心圆形,调整到适当大小
- 当小绿旗被点击时,移到x:0 y:0
- 编写时针代码
- 面向90度方向
- 重复执行(不柔和旋转)
- 等待60*60秒
- 右转360/12度
- 重复执行(优化,使其柔和旋转)
- 等待1秒
- 右转360/12/60/60度
- 制作分针
- 复制时针,命名为分针,此时可删除时针的十字交叉线
- 点击造型,修改直线长度到刚好碰到小刻度
- 修改右转为360/60/60度
- 制作秒针
- 复制分针,命名为秒针,此时可删除分针的十字交叉线
- 点击造型,删除顶部直线,延长原来较细的直线,刚好碰到小刻度外围
- 同时反向延长直线,使其另一端露出一些距离
- 适当减小线段粗细,使其粗细刚好合适
- 删除十字交叉线(若继续步骤9则先不删除)
- 修改脚本,将右转设置为360/60
- 制作刻度字(练习1)
- 复制秒针,命名为刻度字,此时可删除秒针的十字交叉线
- 点击造型,删除直线及空心圆圈
- 添加文字,写上1,调整大小及位置
- 复制11次文字,分别修改为2到12,调整好水平位置
- 删除十字交叉线
- 编写刻度字代码(练习1)
- 当小绿旗被点击时
- 移到x:0 y:0
- 面向90度方向
- 将造型切换为造型12
- 将位置设定为1,时针、分针、秒针的位置变量可删除
- 重复执行11次
- 克隆自己
- 将位置增加1
- 当作为克隆体启动时
- 将造型切换为位置
- 右转 位置*(360/12)度
- 同步时针与当前时间的小时(练习2)
- 在面向90度后添加代码
- 右转 360/12 * 当前时间的时
- 右转 360/12/60 * 当前时间的分
- 右转 360/12/60/60 * 当前时间的秒
- 同步分针与当前时间的分数(练习2)
- 在面向90度后添加代码
- 右转 360/60 * 当前时间的分
- 右转 360/60/60 * 当前时间的秒
- 同步秒针与当前时间的秒数(练习2)
- 在面向90度后添加代码
- 右转 360/60 * 当前时间的秒
- 添加闹铃功能(练习3)
- 新建全局列表
- 列表支持添加字符串元素:例如1102,代表11时02分
- 在舞台中添加代码循环判断当前时间是否与列表中某个时间一致
- 若时间一致,则显示弹窗播放铃声
课后练习
- 为时钟增加刻度字,从1到12
- 为时钟的各个表针添加初始化代码,使其跟当前时间对应
- 为时钟添加闹铃功能,闹铃到了弹出窗口并播放铃声