【自制】基于ESP32墨水屏的To do list

在之前成功驱动墨水屏显示时间天气后，最近小鱼君也是突发奇想将墨水屏的界面进行了修改，其中拥有4个待办事项可以上传，并且记录学习的时间。最终效果可以直接在视频中看到：https://www.bilibili.com/video/BV1Mg4y1N7AW/?spm_id_from=333.999.0.0;vd_source=6ae1f46247eae3d4f5525c98089598dc

 其中用到的主要功能有浏览器配网、编写一点html代码、墨水屏局部刷新、wifi更新时间。

 单片机为ESP32DevKit，也就是最普通的那种。

 开发平台为VScode+Platformio，用到的第三方库有三个：GxEPD2、U8g2、Json是用来获取天气的，不需要就不用加。直接将这三个库添加到ini文件中就可以了。

本文将按照使用顺序来逐个介绍它的主要功能。

首先需要将每天的4个任务传输到ESP32上，这里一开始小鱼君用的是蓝牙传输，但是发现中文直接传会发生乱码，虽然通过编码就可以解决但是想到用wifi好像能够更方便，由于之前也没怎么用过，所以想学习一下Ap配网就选择了浏览器配网。

大致逻辑是ESP32先作为一个热点，发出一个名为【ESP32_AP】的热点，用手机连接后在浏览器输入默认的ip：192.168.4.1就会进入我们写好的网页。所以这里就需要会一点html的编写了，之前在学习的时候也看到有wifi配网的教程，但是在当前需求下想要增加每日4个计划并且以Json的格式发送就有点难度了。（虽然最后没用Json）

所以这里直接借助于Chatgpt，生成了一大段代码：

差不多就是这样的效果，至于怎么样能看到自己代码在网页中的效果呢？在VScode中下载这个插件： liveServerPreview，然后按下F1就可以用了。

如果按照Gpt生成的代码来看的话还有一大堆Funtion定义了Json发送，但是在经过后面的测试小鱼君惊奇的发现删掉就可以了，具体配置在ESP32中，由于图片复制会疯狂降低画质所以这里直接插入代码。

看起来是不是简洁高效呢？至于代码也是非常简单的，就是把刚才编写的html文件放到板子里，然后每次收到网页信息后就会进行处理，但是在配网后网页连接就会断开，也就是说每次配网后就不能修改每日计划了。想调整也不难，等后续再修改吧。

至于墨水屏的显示可以找到之前传到Github的代码，可以直接调用然后修改。

等待WIFI配置之后就开始更新时间然后计算学习分钟数据，最顶层的古诗句是随机从6句中选择的，用到了随机数生成，只是为了装饰。

最后效果如下所示，为什么没有自己画板子呢，因为毕业回家后设备不全，也没有好伙伴给小鱼君3D建模了，一想到这里就懒得开始画板加硬件，应该至少得有一两个按键的。

最后展示一下：

工程写的有点乱，等整理后会上传到Github中。