【柿饼学习营】+werrysuzhen+汽车仪表盘

发布于 2018-09-14 15:32:28
    本帖最后由 werrysuzhen 于 2018-9-14 15:34 编辑


一.开发环境
1.开发板:野火I.MX1052 PRO
2.win7-64位 专业版
二.作业题目
1.使用画布控件绘制汽车仪表盘

三.过程和结果
1.在page上放置两个画布控件Canvas1和Canvas2,Canvas1作为转速表,Canvas2作为速度表。官方给的教程中提供了绘制仪表盘的示例程序,在page的onLoad事件中验证示例程序
1.png
2.修改程序将速度表的最大范围由100改为200,并修改相应的指针指示值,将默认值改成0,在表盘上标注速度单位为km/h,表盘下方标注当前实时速度值
2.png
3.使用相同的程序在Canvas1上绘制转速表
3.png
3.增加两个按钮,一个控制加速,一个控制减速
4.png
4.让仪表盘动起来,在两个按钮的onButton事件中,每次触发将转速表和速度表的值增加或减小一个单位,然后将画布内容清空,根据实际值重新绘制
GIF.gif
5.做一个超速报警指示,当速度超过160Km/h时,速度指示显示为"Dange"报警,然后显示一个危险图标
GIF1.gif

四.作业总结
1.本次的作业比较适合我,不需要太多的JS代码编写,主要是熟练使用官方的画布控件API函数。
2.本次学习营接近尾声了,不得不感叹柿饼实在是太好用了,简单几句代码就能实现想要的效果
3.特别期待下一期的和硬件结合的课程

查看更多

关注者
0
被浏览
2k
2 个回答
bernard
bernard 2018-09-14
可以考虑把字体更改下,也把仪表盘的几个图标指示也加上:lol

撰写答案

请登录后再发布答案,点击登录

发布
问题

分享
好友