【零基础】一起DIY智能家居 篇八：墨水屏驱动下篇接线及显示示例

前言

上篇部分网友反馈逻辑问题

首先检讨下上篇文章叙事过程

因为我本身也是边学边写

过程是

需求——官网例子——发现问题——解决问题

原本打算连遇到的坑也一并写了

免得大家再采坑

而且也本打算一篇讲完

结果写一半发现内容有点多

而且也搞到凌晨三点多了

就打算代码部分另起一篇详细说

事先没规划好篇幅是我的错

之前代码示例为了安全性也都只是代码片段

以后上完整yaml文件，只要接线一样

到手直接点击编译安装就能用

这样应该么问题了吧

直接喂到嘴里好了吧

至于接线还没考虑好继续用软件模拟

还是这样简单画图

还是干脆接线过程也路个视频？

大家给个意见

代码部分

圆规正转

上期只能显示固定内容是没有意义的

固定内容打印张只贴上去好了

1.条件触发显示特定内容和温湿度示例

示例代码

https://gitee.com/sonata1/esphome/raw/master/墨水屏/温湿度+人体感应翻页.yaml

使用针脚

所用字体

https://gitee.com/sonata1/esphome/raw/master/墨水屏/WenQuanDengKuanWeiMiHei-1.ttf

我们想显示中文就需要中文字体

可中文字体一般文件尺寸都在4M-10M之间

esp32 flash只有4M

除了用精简版字体，和扩充flash之外还可以只烧录特定字符

在glyphs: 后面跟上要用到的字符即可

这样只需要调用字库里的部分字符，就没有容量问题了

我们创建大小两种字符分别命名font1 font2调用

这里创建了page1 page2两个页面

第一个页面第一行的 0 20

代表 在屏幕X坐标0Y坐标20输入SMZDM字符

至于center_left代表对齐方式，这个和网页css类似

有需要的可以自行研究

第二行显示的时间 time1

是在time模块生成的

%H %M意味着只显示小时分钟

至于三四行 温度后面的 %.1f则是占位符 ，

代表显示的内容是逗号后面的传感器数据

看着不太好理解

我们分解一下，就好理解了

就是保留一位小数显示温度和湿度

红外传感器显示有人会翻页

代码如图

第五篇讲过

2.显示图片

我们制作一个smzdm网站的二维码图片

保存在配置文件目录

增加image组件并设置ID后

下面的代码就变成了红外触发就会显示二维码

大家可以尝试自己制作2个温湿度图片代替文字

其实esphome有专门的二维码组件

有需要的可以去看看示例

3，表格

首先添加画图组件graph

绘制两个表格

表二本身是多线条的

这里没有多余传感器只画了一条线

这里没设好网格和标题

回头弄一个好看点的界面

更新在gitee上

总结

这期没什么实际操作内容，主要是理解代码

大家可以以此类推自己做co2或者甲醛 天然气的监控显示器

建议的大家多看看官网

大部分都有示例的

作者声明本文无利益相关，欢迎值友理性交流，和谐讨论～