之前我们发布过 Pi Dashboard,一款树莓派仪表盘工具,用来显示树莓派运行状态和资源使用情况。这需要在电脑或手机的浏览器中打开树莓派上部署的网页来查看这些信息。
下面我们来 DIY 一个可爱的智能终端设备,通过 MQTT 协议获取任何想要监控和展示的信息,显示在一块 1.3 寸的 OLED 屏幕上。这些信息可以是类似树莓派仪表盘所展示的信息,也可以是其他你希望展示的信息,例如货币汇率、基金指数等实时数据。
![]()
该项目分为两个部分。树莓派作为信息收集者和发送者,同时 MQTT Broker(代理服务器)也搭建在树莓派上。NXEZ Cube(小方屏)作为信息接收端和显示设备。
部署主机端程序
在要监控的主机(树莓派、其他 Linux 系统的服务器或个人电脑)上运行下面的命令部署监控主机的程序。这个程序的作用是采集自身的实时数据并通过 MQTT 协议转发出来。
安装依赖项
sudo apt-get update sudo apt-get install python3-pip sudo apt-get install mosquitto mosquitto-clients
部署程序
程序有两个版本,下面我们用 Lite 版来介绍。
cd ~ git clone https://github.com/nxez/cube-dashboard cd cube-dashboard/server-lite sudo pip3 install paho-mqtt
修改 main.py 中的 mqttServerIP 这行变量的值,改成主机的 IP 地址。并且确保这个 IP 地址可以被小方屏访问到。
sudo nano main.py
Ctrl+X 然后会提示输入 Y 保存修改。运行下面的命令启动程序。
sudo python3 main.py &
到这里如果顺利的话,程序就已经开始运行了。只是还没有设备接收这些信息并显示出来。请继续往下看。
另外还可以通过配置让这个程序在每次开机后自动启动。
编辑 rc.local 文件。
sudo nano /etc/rc.local
在 exit 0 之前添加一行(其中脚本的路径请根据实际情况修改):
sudo python3 /home/pi/cube-dashboard/server-lite/main.py &
小方屏的制作
NXEZ Cube 小方屏由一块 ESP8266 开发板驱动一块 OLED 屏幕实现。你可以购买成套的材料来 DIY,或者直接下单已组装好的成品,亦或者自行准备类似功能的材料,按照下面的电路连接方式自制一个具有同样功能的小玩意。
![]()
小方屏购买地址:
http://link.nxez.com/buy/nxez-cube
相关的说明和开发资源已在文末单独列出。
代码调试
我们开源了 ESP8266 上的 Lite 版本源码和对应的服务端。同时也提供完整功能版的服务端源码和用于 ESP8266 的完整功能版固件:
https://github.com/nxez/cube-dashboard
如果你不需要二次开发,想直接使用完整版固件的功能,请参考产品主页里的安装说明(https://make.quwj.com/project/379)和这里的烧录方法来完成。这样就跳过代码调试步骤了。
对于二次开发来说,Lite 版本已经够用了。这个简化版大大简化了你修改程序需要关注的要素。
我们先下载 Lite 版源码,用 Visual Studio Code 打开。在此之前,你需要为 Visual Studio Code 安装 PlatformIO 插件并安装 ESP8266 相关的支持。具体方法 Google 一下就有。
源码需要修改 app-lite/src/settings.h 中的几处配置。
// WIFI const char* WIFI_SSID = "WIFI_SSID"; const char* WIFI_PWD = "WIFI_PWD"; //MQTT Broker char mqttBroker[16] = "192.168.1.204"; char mqttBrokerPort[6] = "1883";
在 WIFI 的部分配置好可用的 WIFI 名称和密码。在 MQTT Broker 部分将 mqttBroker 配置为树莓派的 IP 地址(需要确认小方屏可以访问到这个 IP)。如果你打算将 MQTT 代理服务搭建在树莓派之外的服务器上,那这里就改成其他服务器的地址即可。端口号 1883 是默认值,如果没有自定义的话也就不需要修改。
修改好之后通过 Visual Studio Code 将代码上传到小方屏的 ESP8266 开发板上这步就算完成了。
![]()
一切顺利的话,给小方屏通电,就能看到效果了。
Lite 版用于二次开发使用,你可以通过编程加入个性化的数据来显示。只需要修改服务端和 ESP8266 的代码即可。
完整版功能效果如下。
![]()
包含以下控制选项。
![]()
小方屏相关资源
产品主页:
https://make.quwj.com/project/376
购买地址:
http://link.nxez.com/buy/nxez-cube
组装视频:
https://www.bilibili.com/video/BV1pv411j7cB/
硬件和固件资源列表:
https://make.quwj.com/member/2/bookmarks?category=92
DIY 讨论组:
https://talk.quwj.com/node/cube
发表评论