行空板K10 | 大屏真香之温湿度计

2024-11-254287
AI 快速预览详细 收起
本文介绍了如何使用行空板K10制作一个可视化温湿度计。硬件准备包括行空板K10和USB线,软件使用Mind+ V1.8.1 RC1.0。通过编写程序,实现了条形和扇形动态显示温度及湿度的效果。项目不仅适合STEM教育场景,还锻炼了孩子的编程能力和数据可视化技能。



行空板K10 | 大屏真香之温湿度计图1


行空板K10板载温湿度传感器,要获取环境温度和湿度无需外接传感器,非常方便。我想,用行空板K10进行硬件编程教学,制作一个温湿度计应该会是一个基础案例。
行空板K10 | 大屏真香之温湿度计图2

通常,我们会做出上图这种简单的数字温湿度计。但是对于这块2.8寸的大屏来说,有种没有物尽其用的感觉。我之前用Mind+的实时模式结合掌空板和一些传感器做过很多科学实验的项目,为了让数据可视化,一般都会借助“画笔”工具来完成;后来Mind+有了可视化面板,让制作这类项目变得更加方便,呈现效果也更加惊艳。不过这些效果都是在电脑的屏幕上呈现的,现在行空板K10也有一块大屏,能不能也做出可视化面板的效果呢。为此,我做了一些尝试,成功制作出了一个能以条形、扇形动态显示温度及湿度的温湿度计,现在分享给大家。
行空板K10 | 大屏真香之温湿度计图3

演示视频







制作步骤:

【硬件准备】
行空板K10 | 大屏真香之温湿度计图4
行空板K10 × 1     USB线 × 1

【软件准备】

1.下载、打开软件
行空板K10 | 大屏真香之温湿度计图5
Mind+ V1.8.1 RC1.0(公测版) ——上传模式

2.加载扩展模块。
行空板K10 | 大屏真香之温湿度计图6
主控板——行空板K10

【编写程序】

一、主程序部分
行空板K10 | 大屏真香之温湿度计图7
1. 居中显示名称“温湿度计”。
2. 建立2个数字类型变量——“t”和“ h”,赋值为获取的当前温度和湿度数据。
3. 建立2个函数——“显示温度”、“显示湿度”,含有两个数值型参数,是一组坐标,用来控制显示位置。放入主程序中,具体功能待后面进行定义。
4. 将缓存内容显示/显示更新。
5. 加入一定的等待时长(根据实际需求设置)。
行空板K10 | 大屏真香之温湿度计图8
运行结果

二、“显示温度”函数
(一)绘制圆角矩形
行空板K10 | 大屏真香之温湿度计图9
1. 设置线宽。
2. 以点(xy)为圆心画一个半径为30的上圆。
3. 画一个与上圆同宽的矩形,长为160,上边的中点与上圆的圆心重合。
4. 以矩形的下边中点为圆心画一个半径为30的下圆。

行空板K10 | 大屏真香之温湿度计图14
运行结果


(二)绘制刻度线
行空板K10 | 大屏真香之温湿度计图10
1. 以中间的矩形为基准,从上往下每隔4个像素画一条长为12的线段,共计40条,作为短刻度线。
行空板K10 | 大屏真香之温湿度计图11
2. 以中间的矩形为基准,从上往下每隔20个像素画一条长为20的线段,共计9条,作为长刻度线。
行空板K10 | 大屏真香之温湿度计图13
运行结果



(三)绘制圆形“玻璃泡”
行空板K10 | 大屏真香之温湿度计图12
在最下面的长刻度线下方绘制一个半径为10的圆,模拟“玻璃泡”效果。


行空板K10 | 大屏真香之温湿度计图15
运行结果

(四)绘制条形“液柱”
行空板K10 | 大屏真香之温湿度计图16
1. 设置线宽为8
2. 将温度值通过映射转换为“液柱”最高点Y坐标值。
3. 以最下面的长刻度线(0刻度线)往上画出“液柱”。

行空板K10 | 大屏真香之温湿度计图18
运行结果

(五)显示温度值
行空板K10 | 大屏真香之温湿度计图17
将温度值显示在最上面的长刻度线上方位置。

行空板K10 | 大屏真香之温湿度计图19
运行结果

行空板K10 | 大屏真香之温湿度计图20
“显示温度”程序


三、“显示湿度”函数
(一)绘制圆形
行空板K10 | 大屏真香之温湿度计图21
1. 设置线宽为4
2. 以点(xy)为圆心画一个半径为72的大圆。
行空板K10 | 大屏真香之温湿度计图22
运行结果
(二)绘制刻度线
行空板K10 | 大屏真香之温湿度计图23
1. 以圆心为起点,从0°开始,每隔18°画1条半径到圆上,共20条半径。
2. 以点(xy)为圆心画一个半径为60的中圆,遮盖半径的大部分,剩余部分形成了刻度线。
行空板K10 | 大屏真香之温湿度计图24
运行结果

(三)绘制动态扇形
行空板K10 | 大屏真香之温湿度计图25
1. 设置线宽为6
2. 以圆心为起点,从0°开始,每隔3.6°画1条半径到圆上,总数量同湿度的整数值。
行空板K10 | 大屏真香之温湿度计图26
运行结果

(四)显示湿度值
行空板K10 | 大屏真香之温湿度计图27
将温度值居中显示在圆的中心位置。

行空板K10 | 大屏真香之温湿度计图29
运行结果
行空板K10 | 大屏真香之温湿度计图28
“显示湿度”程序





【完整程序】
行空板K10 | 大屏真香之温湿度计图30

温湿度计源程序.zip

171.5 KB, 下载次数: 2466

创作许可协议

本项目采用 None(不开放任何权利,保留所有权利) 进行许可。

评论(2)
Y_XiaoBai
Y_XiaoBai
将作者最近两个行空板k10的作品结合了
怀若谷
怀若谷
作者
回复Y_XiaoBai
挺好的,我下载运行了一下
rzyzzxw
rzyzzxw
超赞
- 没有更多了 -