0
0

【嵌入式项目开源】基于ESP32的墨水屏桌面小屏幕

首先简要介绍一下这个项目：
这个项目的开源主要包括硬件，固件和软件两部分，外壳后面如果做了也会开源出来。该项目主要是参考了以下教学视频。
链接：桌面小屏幕实战教学
其中硬件部分改动不大，主要是把USB驱动改成了TypeC + CP2102，其他部分没有太大改动。
软件部分全部是自主编写，这部分与上面视频中的开源代码完全不同，各位可以作为参考。
说明：做这个项目主要是为了把我这段时间学的东西整合到一起，项目本身的难度并不大，适合新手入门。
在这里插入图片描述

项目开源仓库：https://github.com/Jozen-Lee/Desk_Screen

1. 项目简介

软件版本

PlatformIO：6.1.5
SquareLine Studio： 1.1.1
Visual Studio：2022
嘉立创EDA：专业版1.9.23

固件版本

lvgl：8.3.4

主要外设

ESP32-S：带有ESP32主控 + 蓝牙 + WIFI
ePaper：1.54寸黑白墨水屏，采用SPI通信
ft6336：触摸屏，采用I2C通信
蜂鸣器：PWM驱动
USB：TypeC + CP2102

物料清单

这里只给出核心的部件，电阻电容二极管这些可参考PCB原理图中的具体型号。
外设类别型号数量购买链接主控模块ESP32-S1ESP32-S模组WiFi+蓝牙ESP32串口转WiFi模块PCB开放板电子纸触摸屏GDEY0154D67-T031电子纸触摸屏USB芯片CP2102-GMR1CP2102-GMR锂电池充电管理模块TP405611A锂电池充电IC线性稳压器AMS1117-3.31正 Vin=18V Vout=3.3V 1A 60dB@(120Hz)蜂鸣器MLT-50201MLT-5020TypeC接插件TYPEC-324-BCP241Type-C 母座 卧贴轻触开关TS24CA2蓝牙耳机轻触开关锂电池3.7V3010301蓝牙耳机电池小体积大容量
建议TypeC改为以下的封装，比较便宜好焊，PCB图做简单修改即可。
KH-TYPE-C-16P

2. 硬件部分

这部分对应开源仓库中的Hardware，整体电路比较简单，这里只提一些关键点。

自动下载电路

CP2102是可以设计自动下载电路的，原理图如下：（参考稚晖君的开源项目）
在这里插入图片描述
本项目虽然使用了CP2102，但当时设计的时候没考虑到这个，所以是采用了手动下载的方式。
下载时需要拉低GPIO0再按复位键进行下载。(右方的两个按键)
在这里插入图片描述

屏幕接插口

这个属于是设计上的失误，当时买的外设是墨水屏+触摸屏一体化模块，但是两个接插件的相对位置存在误差，导致连接的时候触摸屏FPC线需要弯曲。
请添加图片描述
其余可优化的细节

  1. 缩小PCB尺寸（当前的尺寸明显是过大的）
  2. 添加锁紧开关（因为是锂电池供电，没有开关的话每次只能通过拔电池来断电，很麻烦）
  3. 添加电源指示灯（板子上目前只有锂电池充放电指示灯）
  4. 优化供电电路（目前USB的5V供电只拿来给锂电池充电，所以只插USB不接电池板子是无法正常工作的）

3. 固件部分

这部分对应开源仓库中的Firmware，开发平台选用的是vscode + PlatformIO。
项目中涉及到了很多外设的驱动库，原则上是尽量选用Platform平台上有的开源库，因为移植和使用都比较简单。不过也要考虑适配性，开源库不是万能的，大部分时候都需要根据使用的外设提供的demo，来修改开源库的参数或者源码。
首先介绍一下使用到的库和相关的配置。

epd_libraries

官方链接：https://github.com/Bodmer/EPD_Libraries
我使用的是其中的epd1in54库，对应了我所使用墨水屏的尺寸。
我根据官方demo修改了库中的刷屏源码。不修改的话，显示的图像会很模糊。
在这里插入图片描述

ft6336

这部分使用的是Platform Libraries中的htcw_ft6336库
主要修改的部分是GPIO口的配置和初始化的配置。

关键点：虽然pins_arduino.h中有I2C和SPI的引脚配置，但我们完全是可以根据我们的需求进行修改的，ESP32芯片也是支持的。

/* init code */boolinitialize(){if(!m_initialized){/* Device Reset */gpio_set_level((gpio_num_t)pin_res,0);vTaskDelay(50/ portTICK_PERIOD_MS);gpio_set_level((gpio_num_t)pin_res,1);vTaskDelay(100/ portTICK_PERIOD_MS);/* Init I2C */
      m_i2c.begin(33,32,10000);vTaskDelay(100/ portTICK_PERIOD_MS);device_gpio_config();/* Set normal mode */uint8_t w_data=0;reg(REG_DEVICE_MODE, w_data);/* set touch availd value to 22, smaller to more sensitive */
      w_data=22;reg(REG_THRESHHOLD, w_data);/* set active period 12 - 14 */                    
      w_data=14;reg(REG_TOUCHRATE_ACTIVE, w_data);/* Set interrupt mode */
      w_data =0;reg(REG_INTERRUPT_MODE, w_data);

      m_initialized=true;}returntrue;}

lvgl

这里引入lvgl主要是方便UI的开发以及链接显示屏与触摸屏的数据，库的相关配置可以参考我之前的博客：【LVGL学习笔记】（四）PlatformIO + LVGL8.3配置
因为墨水屏无法像LCD那样子不断刷新数据，所以在配置的时候，需要修改屏幕缓存更新的逻辑。
我采用的逻辑如下：

  1. 根据lvgl的数据刷新主控内部的缓存空间
  2. 每次屏幕被按下的时候，将主控的缓存一次性发过去给墨水屏的RAM并刷新显示。
/* 这里只给出核心部分代码，其余的源码请参考开源仓库中的代码 */uint8_t img_buf[MY_DISP_HOR_RES * MY_DISP_VER_RES /8];
Paint paint(img_buf, MY_DISP_HOR_RES, MY_DISP_VER_RES);staticvoiddisp_flush(lv_disp_drv_t * disp_drv,const lv_area_t * area, lv_color_t * color_p){uint32_t w =(area->x2 - area->x1 +1);uint32_t h =(area->y2 - area->y1 +1);for(int i = area->y1; i <= area->y2; i ++){for(int j = area->x1; j <= area->x2; j ++){if(color_p[(j-area->x1)+(i-area->y1)*w].full ==0xffff) paint.DrawPixel(j, i, UNCOLORED);else paint.DrawPixel(j, i, COLORED);}}lv_disp_flush_ready(disp_drv);}voidDisplay::refresh(void){
    epd.SetFrameMemory(paint.GetImage());
    epd.DisplayFrame();}

lvgl的图片与字体

lvgl官方提供了相关的网址，可以便捷地使用。
图片转换：Online Image Converter
字库生成；Online Font Converter
字库的相关配置可以参考这篇博客：lvgl界面库支持汉字显示

  1. 在设计UI的时候，使用的字体类别尽量少，因为每启用一类字体，都需要引入一个字库，需要比较多的内存。
  2. lvgl中带有中文的支持，字库类别是LV_FONT_SIMSUN_16_CJK，但是其中只有少量的中文字符，所以最好还是自己生成汉字字库。

BluetoothSerial&Wifi

ESP32-S内置有天线，可以支持蓝牙和WiFi通信。两者共用一根天线，但通信协议不同，所以两者是可以支持共存的，但不可以同时使用。详细的说明可以参考官方手册中的说明：RF共存
因为本项目相对简单，所以我没有配置共存相关的东西。因此，在二次开发的时候要注意，项目中的蓝牙和wifi的库都可以正常使用，但是使用前都需要将另一方关闭，否则程序会崩溃。

/* 蓝牙驱动核心代码 */voidBluetooth_Event(esp_spp_cb_event_t event, esp_spp_cb_param_t* param){/* the first event is from master, the second event is from slave */if(event == ESP_SPP_OPEN_EVT || event == ESP_SPP_SRV_OPEN_EVT){
        Serial.write("bluetooth connection successful!\r\n");}elseif(event == ESP_SPP_CLOSE_EVT){
        Serial.write("bluetooth disconnect successful!\r\n");}elseif(event == ESP_SPP_DATA_IND_EVT){uint16_t len =0;memset(rx_buff,'\0', BLUETOOTH_MAX_LEN);while(SerialBT.available()){if(len < BLUETOOTH_MAX_LEN){
                rx_buff[len]=char(SerialBT.read());
                len++;}}
        update_flag =true;
        rx_len = len;
        Serial.println(rx_buff);}elseif(event == ESP_SPP_WRITE_EVT){}}voidBluetooth::init(void){/* Register callback function */
    SerialBT.register_callback(Bluetooth_Event);/* Start bluetooth */stop();}voidBluetooth::start(void){if(BLT_MASTER_MODE){
        SerialBT.begin("ESP32_MASTER",true);
        SerialBT.connect(address);}else{
        SerialBT.begin("ESP32_SLAVE");}}voidBluetooth::stop(void){ SerialBT.end();}

/* WiFi驱动核心代码 */voidNetwork::init(String ssid, String password){/* enable wifi scan */#if0
    Serial.println("scan start");int n = WiFi.scanNetworks();
    Serial.println("scan done");if(n ==0){
        Serial.println("no networks found");}else{
        Serial.print(n);
        Serial.println(" networks found");for(int i =0; i < n;++i){
            Serial.print(i +1);
            Serial.print(": ");
            Serial.print(WiFi.SSID(i));
            Serial.print(" (");
            Serial.print(WiFi.RSSI(i));
            Serial.print(")");
            Serial.println((WiFi.encryptionType(i)== WIFI_AUTH_OPEN)?" ":"*");delay(10);}}
    Serial.println("");#endif

    Serial.print("Connecting: ");
    Serial.print(ssid.c_str());
    Serial.print(" @");
    Serial.println(password.c_str());
    WiFi.begin(ssid.c_str(), password.c_str());while(WiFi.status()!= WL_CONNECTED){delay(500);
        Serial.print(".");}
    Serial.println("");
    Serial.println("WiFi connected!");
    Serial.println("IP address: ");
    Serial.println(WiFi.localIP());/* config world time */configWorldTime();}

ledc

EPS32有基础的PWM驱动库，也有ledc，mcpwm等经过了二次封装的PWM驱动库。
官方的本意是提供更便捷的驱动API，ledc用了LED灯光亮度的控制，mcpwm用于电机驱动。但是我们完全可以用这些库来控制其他需要PWM信号进行驱动的外设。本项目用其来驱动无源蜂鸣器。

无源蜂鸣器没有正负极之分，所以蜂鸣器的发生效果只受PWM的频率影响，不受占空比影响。因此我们将占空比设置为定值即可。

该项目使用蜂鸣器实现了音乐播放/暂停，切换等操作。

voidmusic_timer_cb(void* arg){if(*_tune && music_playing){if(*_tune !=-1)ledcWriteTone(BEEP_PWM_CHANNEL,*_tune);
        _tune++;esp_timer_start_once(music_timer, BASIC_BEAT_TIME *1000*(*_beat));
        _beat++;}elseif(!*_tune && loop_flag){
        _tune = _tune_record;
        _beat = _beat_record;
        music_playing =true;esp_timer_start_once(music_timer,10);// Serial.println("music loop!");}else{
        music_playing =false;ledcWrite(BEEP_PWM_CHANNEL,0);// Serial.println("music pause!");}}voidBeep::init(void){/* Set freq and resolution to default value */ledcSetup(BEEP_PWM_CHANNEL,4000,8);ledcAttachPin(BEEP_PIN, BEEP_PWM_CHANNEL);stop();/* register music timer */
    esp_timer_create_args_t music_timer_args ={.callback =&music_timer_cb,.arg =NULL,.name ="music_timer"};
    esp_err_t err =esp_timer_create(&music_timer_args,&music_timer);}

ArduinoJson

因为EPS32可以联网，而联网访问各个网址，得到的信息一般都是json格式，所以需要该库来对信息进行解码操作。该库主要应用在了以下的获取天气信息的函数中。

获取天气信息

采用的是心知天气提供的API接口。
该API有免费版可以供用户使用，详情可以参考官方网址：心知天气
API返回的数据格式

{“results”:[{“location”:{“id”:“W7YGK0CKZKF9”,“name”:“茂名”,
“country”:“CN”,“path”:“茂名,茂名,广东,中国”,
“timezone”:“Asia/Shanghai”,“timezone_offset”:“+08:00”},
“now”:{“text”:“晴”,“code”:“0”,“temperature”:“21”},“last_update”:“2022-12-26T13:40:11+08:00”}]}

核心代码

/**
 * @brief get the information of your city refer to ip
 *
 * @param country
 * @param province
 * @param city
 * @param weather
 * @param temp
 */boolNetwork::getCityinfo(String& country, String& province, String& city, String& weather, String& temp){
    HTTPClient http;
    DynamicJsonDocument doc(1024);/* Compose url */
    String url_xinzhi =composeZXaddress("ip");
    http.begin(url_xinzhi);int httpGet = http.GET();if(httpGet >0){if(httpGet == HTTP_CODE_OK){
            String json = http.getString();deserializeJson(doc, json);
            String loc = doc["results"][0]["location"]["path"].as<String>();
            String loc_split[4];stringSplit(loc_split, loc,',');
            city = loc_split[1];
            province = loc_split[2];
            country = loc_split[3];
            weather = doc["results"][0]["now"]["text"].as<String>();
            temp = doc["results"][0]["now"]["temperature"].as<String>();returntrue;}else{
            Serial.printf("ERROR!");returnfalse;}}else{
        Serial.printf("ERROR!");returnfalse;}}

String Network::composeZXaddress(String city){
    String url_xinzhi ="https://api.seniverse.com/v3/weather/now.json?key=";
    url_xinzhi += XINZHI_KEY;
    url_xinzhi +="&location=";
    url_xinzhi += city;
    url_xinzhi +="&language=zh-Hans&unit=c";return url_xinzhi;}voidNetwork::stringSplit(String* dst, String message,char flag){int flag_position;uint8_t num =0;/* Split String */do{
        flag_position = message.indexOf(flag);if(flag_position !=-1){
            dst[num++]= message.substring(0, flag_position);
            message = message.substring(flag_position +1, message.length());}else{
            dst[num]= message;}}while(flag_position >=0);}

获取时间

ESP32提供了非常便捷的API接口供我们使用，并且我们只需要联网获取一次世界时间，ESP32就会调用内部的RTC时钟来自动更新时间，我们只需读取即可。
核心代码

#defineNTP1"ntp1.aliyun.com"#defineNTP2"ntp2.aliyun.com"#defineNTP3"ntp3.aliyun.com"/**
 * @brief Config World time
 *
 */voidNetwork::configWorldTime(){structtm timeinfo;if(!getLocalTime(&timeinfo)){configTime(8*3600,0, NTP1, NTP2, NTP3);return;}/* format output: 2021-10-24 23:00:44 Sunday */
    Serial.println(&timeinfo,"%F %T %A");}

FreeRTOS

不同于STM32需要从外部引入FreeRTOS，EPS32的FreeRTOS库是内部库，可以直接引入头文件进行调用。运用FreeRTOS可以很好地构建代码框架，本项目的架构如下：
在这里插入图片描述

因为PlatformIO的编译环境比较使用小体量的ESP32代码工程，所以我没有像STM32那样构建比较复杂的文件层级，只是将外设变量的定义，FreeRTOS的任务和变量创建用新的文件进行了封装，而不是全部堆砌在main中。

值得一提的是，ESP32中有两个核，所以它提供了新的FreeRTOS任务创建API：xTaskCreatePinnedToCore，它的最后一个参数可以为0或1，用于设置任务在哪个核上跑。

/* main.cpp */voidsetup(){System_Resource_Init();}

TickType_t _xTicksToWait =pdMS_TO_TICKS(10000);
String country, province, city, weather, temp;
String loc;voidloop(){lv_task_handler();delay(20);}

/* SystemConfig.cpp */voidSystem_Resource_Init(void){/* RTOS resources Init */
    MusicCmd_Port =xQueueCreate(4,sizeof(int8_t));/* Begin Serial */
    Serial.begin(115200);/* Init beep */
    beep.init();/* Init screen */
    screen.init();/* Init blt */
    blt.init();/* Init lvgl input device */lv_port_indev_init();/* connect network */
    String ssid ="TP-LINK_1CC0";// line-1 for WiFi ssid
    String password ="woaiwojia012668";// line-2 for WiFi password#if1
        wifi.init(ssid, password);/* Change to your BiliBili UID */// Serial.println(wifi.getBilibiliFans("472453800"));#endif/* Init ui */ui_init();/* Init system task */System_Tasks_Init();}voidSystem_Tasks_Init(void){Service_Devices_Init();Service_Interaction_Init();}/* Service_Device.cpp *//**
 * @brief Initialization of device management service
 *
 */voidService_Devices_Init(void){xTaskCreatePinnedToCore(Device_Beep,"Dev.Beep",2000,NULL,1,&Beep_Handle,0);xTaskCreatePinnedToCore(Device_Screen,"Dev.Screen",10000,NULL,1,&Screen_Handle,0);xTaskCreatePinnedToCore(Device_Touchpad,"Dev.Touchpad",10000,NULL,1,&Touchpad_Handle,0);}/* Service_Interaction .cpp *//**
 * @brief Initialization of interaction relative task
 *
 */voidService_Interaction_Init(void){xTaskCreatePinnedToCore(Interact_updateInfo,"Interact.updateInfo",10000,NULL,3,&updateInfo_Handle,1);xTaskCreatePinnedToCore(Interact_updateTime,"Interact.updateTime",2000,NULL,1,&updateTime_Handle,1);}

4. 软件部分

这里给出UI设计可能会用到的网站：

个人的LOGO设计：免费LOGO设计模板在线制作
矢量图标：阿里巴巴矢量图标库
图像二值化：图片二值化

SquareLine Studio

SquareLine Studio是lvgl官方推荐的UI设计软件，可以实现所见即所得。
详细的配置说明可以参考我之前的博客：【LVGL学习笔记】（五）使用SquareLine Studio设计UI
SquareLine Studio中有lvgl各种常见的控件，并且可以很方便地配置控件参数。
在这里插入图片描述
同时，它还可以为控件添加事件以及动画效果。

因为本项目用的是墨水屏，不可以频繁刷屏，所以各种动画效果我都设置为NONE。如果是LCD屏，搭配动画效果可以实现很酷炫的效果。

在这里插入图片描述

使用SquareLine Studio设计的界面如下
在这里插入图片描述

LvglSimulator（Visual Studio）

LvglSimulator是lvgl的模拟器，可以大大节约开发的时间。需要注意的是，上面提到的SquareLine Studio也具有一个播放模式，在这个模式下，也是可以模拟界面的变化。LvglSimulator与之的区别是可以验证业务层的代码逻辑，并且添加一些界面的细节（因为部分控件SquareLine Studio中是没有的，需要使用lvgl相关的API函数进行绘制）
LvglSimulator的配置可以参考我的博客：【LVGL学习笔记】（一）环境搭建
lvgl的控件使用可以参考我的博客：【LVGL学习笔记】（三）控件使用
在这里插入图片描述

效果展示

请添加图片描述
请添加图片描述
请添加图片描述

标签： 开源 LVGL 单片机
本文转载自: https://blog.csdn.net/weixin_45728705/article/details/128425519
版权归原作者 煜个头头 所有， 如有侵权，请联系我们删除。
登录后发布评论

“【嵌入式项目开源】基于ESP32的墨水屏桌面小屏幕”的评论:

还没有评论
关于作者
...
overfit同步小助手
文章同步
相关阅读

网络安全法-网络运行安全

使用selenium/drissionpage时如何阻止chrome自动跳转http到https

docker desktop 里部署的Open WebUI 管理员密码忘记了的处理方法

在ubuntu20.04中搭建onsite比赛运行环境

利用开源的低代码表单设计器FcDesigner高效管理和渲染复杂表单结构

Kafka学习笔记

【前端】浏览器输入url到页面呈现发生了什么？

文章导航