Sipeed LicheeRV 86 Panel 基于WAFT的家居控制

[yanmingjian]

采用waft系统完成一个家居参数监视和控制的终端

基于WAFT的家居控制——测试项目

项目测试的硬件基于平头哥LicheeRV 86 Panel开发板，采用waft系统完成软件开发，项目采用客户端-服务器模式架构。

项目以waft示例程序横向列表Demo为基础，开发了两种类型画面，建立了5个场景，分别为天气预报展示画面、厨房监视控制画面、卧室监视控制画面、客厅监视控制画面、门廊监视控制画面。

项目建立一个基于python的服务器，用来为设备提供数据和服务支持。

1、服务器建立

为了便于后面画面的描述，这里首先介绍一下简易服务器。

服务器采用Python建立了支持CGI的简易服务器，服务器支持提供文件和执行CGI脚本程序。

服务器下面包含三个目录和一个服务器启动文件，分别为文件夹cgi-bin、ico、img和pywebserver.py文件。

img文件夹中存放了主画面所需的图片文件。

ico文件夹中存放了开发板中显示的一些图标文件。

cgi-bin文件夹中存放了CGI脚本程序。

2、画面开发

项目采用waft开发平台，基于横向列表示例程序为基础，开发了三种类型画面。利用这三种类型画面开发了一个主画面和5个场景实例。

2.1 第一种画面类型：主画面，横向列表画面

主画面采用横向列表Demo为基础，横向列表为纯Waft开发的示例，共设计了5个场景实例，分别为天气预报、厨房、客厅、门廊、卧室。屏幕包含标题“WAFT 家居控制”，下面对应5个图标，分别代表5个场景，这5个图标支持通过服务器上传，只需要按照规则修改服务器目录下相关的图标即可，路径为webserver根目录/img。画面支持左右滑动选择不同的场景，用过点击场景图片，进入到相关场景的细节描述。

2.2 第二种画面类型：天气预报画面

通过在主画面点击“天气预报”场景图片，进入到天气预报显示子画面，画面显示的信息按照20秒间隔（时间可以在程序中调整）刷新显示画面的内容信息。

画面内容如下图所示，包含标题和显示内容。

天气预报子画面采用Waft-UI技术设计完成，包含标题“天气预报”，标题采用waft-ui中nav-bar控件实现，具有向上级画面和向下级画面索引的功能。

天气显示内容包含城市，日期，星期，天气情况图标，温度和湿度显示，风力和风向，紫外线等级，空气质量。数据的刷新来源于建立的服务器，服务器会定时的向数据源请求数据，并记录到数据库或文件中，为了简化，我这里直接存储到文件中。

2.3 第三种画面类型：监视控制画面

其它几个画面，包括厨房、客厅、门廊、卧室，通过在主画面点击相应的场景图片进入。由于这几个画面类型相同，所以这里以“门廊”画面为例说明，通过在主画面点击“门廊”场景图片，进入到门廊显示和控制子画面，画面显示的信息按照20秒间隔（时间可以在程序中调整）刷新显示画面的内容信息。

画面内容如下图所示，包含标题和显示内容。

门廊显示和控制子画面采用Waft-UI技术设计完成，包含标题，标题采用waft-ui中nav-bar控件实现，具有向上级画面和向下级画面索引的功能。

显示和控制内容包括灯光显示状态和控制按钮，温度和湿度数字显示及图标显示。画面采用的waft-ui控件如下所示。

"x-nav-bar": "waft-ui/assembly/nav-bar/nav-bar",
    "x-toast": "waft-ui/assembly/toast/toast",
    "x-overlay": "waft-ui/assembly/overlay/overlay",
    "x-card": "waft-ui/assembly/card/card",
    "x-dialog": "waft-ui/assembly/dialog/dialog",
    "x-button": "waft-ui/assembly/button/button",
    "x-image": "waft-ui/assembly/image/image"

画面中的灯光控制状态发送到服务器，服务器会将该命令转发给相应的灯光控制模块，并且将灯光控制模块上送的灯光状态和控制状态反馈到画面上来。

画面按照20秒间隔向服务器请求温湿度数据信息，这些信息是服务器定时获取的相应场景环境参数监视模块上送的信息，并存储到数据库或文件中。

灯光控制为关闭状态效果图：

灯光控制为打开状态效果图：

3、实测效果

3.1 服务器运行画面

3.2 演示视频

4、目前开发中遇到的问题

现在的waft系统对于json相关特性的支持还有待完善，例如关于UTF-8类型的中文到GBK类型中文字符串的转换，还需要提供合适的接口函数