陈拓 chentuo@ms.xab.ac.cn 2020/01/09-2020/01/10
1. 前期工作
先设置阿里云物联网平台,看《阿里云物联网平台基本设置-物模型》
https://blog.csdn.net/chentuo2000/article/details/103559553
再看看《树莓派+阿里云轻松智能家居DIY-Web》
https://zhuanlan.zhihu.com/p/101892866
熟悉《移动开发工作台》
https://studio.iot.aliyun.com/studiomobile-doc?spm=a2c9d.12728410.0.0.293b2760uA3Xtp#index.html
2. 移动可视化开发
- 控制台 > 物联网平台 > IoT Studio > 开发服务
- 在“我的智能家居”后面点击“进入”
3. 移动可视化开发
3.1 进入移动可视化开发
- 在快速入口点击移动可视化开发
- 填写基本信息,选择模板
- 点击“完成”,创建页面
3.2 页面布局
- 修改页面标题
双击上图的蓝色选中区域,将页面标题修改为:我的智能家居。
- 用容器分隔页面
根据页面布局添加若干个横向和纵向容器,后面添加的所有组件都放在容器中。
- 调整背景色
3.3 放置并设置组件
- 选择UI组件选项卡
- 添加图片
拖拽左侧组件的图片到画布,在右侧操作栏中点击“上传图片”,上传并选择图片。
点击右下角的“确定”:
- 增加仪表盘用来显示当前温度
■ 拖拽仪表盘组件到画布,设置外观属性
■ 配置数据,逐项选择产品、设备、属性
格式参考
■ 验证数据格式:成功!
■ 点击“确定”
- 增加实时曲线,显示温度变化趋势
■ 拖拽曲线图组件
■ 配置数据,逐项选择产品、设备、属性
■ 验证数据格式:成功!
■ 点击“确定”
- 增加开关
■ 拖拽开关组件到画布上
■ 将样式类型选择为图片,上传对应状态的图片
■ 开关组件关联设备布尔属性
■ 选择配置数据源,逐项选择产品、设备、属性即可。
■ 数据格式验证成功
■ 点击“确定”
- 增加文字组件到开关图片上作为标题“卧室灯”。
- 保存
4. 预览
4.1 树莓派操作
- 先在树莓派上运行测试程序
树莓派的相关开发工作请看参考文档《树莓派连接阿里云物联网平台-属性(nodejs)》。
树莓派按照指定的时间间隔发送温度数据:
4.2 阿里云操作
- 在阿里云平台查看数据
■ 实时数据
■ 查看数据曲线
■ 查看数据列表
4.3 预览页面操作
- 预览
在预览页面点击卧室灯图标可以控制树莓派上的LED开关。
- 页面响应
- 树莓派响应
- 云端响应
更详细的说明请看参考文档《阿里云物模型属性通过树莓派控制灯》。
5. 构建
5.1 设置首页
- 选择列表页
- 点击右边的“新增页面入口”
设置图标、标题和描述。
- 配置页面
点击“配置”。
选择页面,确定。
5.2 构建
- 保存
- 点击“构建”
- 选择“android构建”
- 我只想自己使用
随机生成一个Android包名
- 下一步,构建
- 下载
点击下载,或手机扫码安装。
5.3 Android手机运行
- 点击下面的图标运行app
- 注册一个账号
- 登录,显示首页
- 点击“我爱我家”进入“我的智能家居”
- 点击灯泡图标可以点亮或熄灭树莓派上的LED灯
- 点击右下角红色的小虫子查看调试信息
6. Web应用
请看《树莓派+阿里云轻松智能家居DIY-Web》
https://zhuanlan.zhihu.com/p/101892866
参考文档
- 家居控制面板
https://studio.iot.aliyun.com/studioweb-doc#living.html - 农业监控大屏
https://studio.iot.aliyun.com/studioweb-doc#agriculture.html - 阿里云物联网平台基本设置
https://blog.csdn.net/chentuo2000/article/details/103559553 - 微信小程序MQTT模拟器 阿里云物联网平台测试
https://blog.csdn.net/chentuo2000/article/details/102216865 - 自己写微信小程序MQTT模拟器
https://blog.csdn.net/chentuo2000/article/details/102507560 - 树莓派 Zero W+温度传感器DS18B20
https://blog.csdn.net/chentuo2000/article/details/81051701 - 树莓派GPIO控制
https://blog.csdn.net/chentuo2000/article/details/81051645 - 树莓派连接阿里云物联网平台-属性(nodejs)
https://blog.csdn.net/chentuo2000/article/details/103705694 - 树莓派连接阿里云物联网平台-服务(nodejs)
https://blog.csdn.net/chentuo2000/article/details/103754860 - 树莓派连接阿里云物联网平台-订阅(nodejs)
https://blog.csdn.net/chentuo2000/article/details/103769449 - 树莓派连接阿里云物联网平台-事件(nodejs)
https://blog.csdn.net/chentuo2000/article/details/103805559 - 阿里云物模型属性通过树莓派控制灯
https://zhuanlan.zhihu.com/p/101623092 - 树莓派+阿里云轻松智能家居DIY-Web
https://zhuanlan.zhihu.com/p/101892866 - alibabacloud IoT Device SDK for Javascript
https://github.com/aliyun/alibabacloud-iot-device-sdk - 阿里云移动开发工作台
https://studio.iot.aliyun.com/studiomobile-doc?spm=a2c9d.12728410.0.0.293b2760uA3Xtp#index.html