ESP32驱动ST7735屏幕:从零配置TFT_eSPI库到图形化显示

张开发
2026/4/12 20:04:02 15 分钟阅读

分享文章

ESP32驱动ST7735屏幕:从零配置TFT_eSPI库到图形化显示
1. ESP32与ST7735屏幕的硬件准备第一次接触ESP32和ST7735屏幕时我完全被那一堆杜邦线搞晕了。后来才发现只要搞清楚SPI接口的定义连接起来其实特别简单。ESP32开发板现在价格已经非常亲民性能却相当强悍特别适合用来驱动各种显示屏。ST7735是常见的1.8寸TFT屏幕驱动芯片价格便宜而且显示效果不错。你需要准备的硬件其实很简单一块ESP32开发板推荐使用ESP32-WROOM-32D兼容性好1.8寸ST7735驱动的TFT屏幕注意区分不同版本若干杜邦线建议使用母对母的连接更稳固5V电源可以用USB线直接供电这里有个小技巧购买屏幕时一定要确认具体型号。我就踩过坑买到了ST7735S而不是ST7735结果初始化代码需要调整。屏幕背面通常会贴有型号标签购买前最好跟卖家确认清楚。2. 硬件连接详解连接硬件时最让人头疼的就是那一堆引脚定义。不同厂家的屏幕引脚顺序可能不同我建议先找到屏幕的说明书。如果没有可以试试这个通用接法ESP32 ST7735屏幕 ---------------------- 3.3V → VCC GND → GND GPIO18 → SCL时钟线 GPIO23 → SDA数据线 GPIO5 → RES复位 GPIO17 → DC数据/命令选择 GPIO16 → CS片选注意有些屏幕需要背光控制如果屏幕有BLK或LED引脚需要接到3.3V上。我第一次使用时屏幕不亮折腾了半天才发现是背光没接。如果你用的是常见的1.8寸128x160分辨率屏幕大概率是ST7735S驱动。这种屏幕通常有8个引脚VCC、GND、SCL、SDA、RES、DC、CS、BLK。接线时一定要断电操作我就因为带电插拔烧过一个屏幕。3. 软件环境搭建装软件时最容易出问题的是Arduino IDE的配置。首先确保你已经安装了ESP32开发板支持打开Arduino IDE进入文件→首选项在附加开发板管理器网址中添加https://dl.espressif.com/dl/package_esp32_index.json然后到工具→开发板→开发板管理器中搜索安装ESP32安装TFT_eSPI库有个小技巧不要从GitHub直接下载zip而是通过库管理器安装点击工具→管理库搜索TFT_eSPI选择最新版本安装我第一次直接从GitHub下载结果缺少必要的依赖文件。通过库管理器安装最稳妥会自动解决依赖关系。4. 配置TFT_eSPI库的关键步骤这里是最容易出错的地方TFT_eSPI库需要修改User_Setup.h文件位置在Arduino安装目录/libraries/TFT_eSPI/User_Setup.h用文本编辑器打开这个文件找到以下几处关键配置#define ST7735_DRIVER // 注释掉其他驱动只保留这个 // 设置屏幕分辨率 #define TFT_WIDTH 128 #define TFT_HEIGHT 160 // 根据你的屏幕版本选择初始化模式 #define ST7735_GREENTAB // 常见于128x128屏幕 //#define ST7735_REDTAB // 常见于128x160屏幕 //#define ST7735_BLACKTAB // 某些特殊版本 // 引脚配置 - 必须与你的实际接线一致 #define TFT_CS 16 // 片选 #define TFT_DC 17 // 数据/命令选择 #define TFT_RST 5 // 复位可接ESP32的EN引脚 #define TFT_MOSI 23 // 数据线 #define TFT_SCLK 18 // 时钟线特别注意ST7735有多个变种如果屏幕显示颜色不对或镜像尝试修改ST7735_INITB、ST7735_GREENTAB等定义。我遇到过屏幕显示全黑的情况最后发现是TFT_RST引脚没接好。5. 上传第一个测试程序配置好后我们来上传一个简单的测试程序#include TFT_eSPI.h TFT_eSPI tft TFT_eSPI(); void setup() { tft.init(); tft.setRotation(3); // 尝试0-3不同值找到正确的屏幕方向 tft.fillScreen(TFT_BLACK); tft.setTextColor(TFT_WHITE, TFT_BLACK); tft.drawString(Hello World!, 20, 50, 4); } void loop() { }上传后如果屏幕显示Hello World!恭喜你成功了如果没显示按这个顺序检查电源指示灯是否亮起所有接线是否正确User_Setup.h配置是否与接线一致尝试调整setRotation的参数0-36. 绘制基本图形和文字现在我们来试试更复杂的功能。TFT_eSPI库支持各种图形绘制void setup() { tft.init(); tft.setRotation(3); // 绘制矩形 tft.fillRect(10, 10, 50, 30, TFT_RED); tft.drawRect(70, 10, 50, 30, TFT_BLUE); // 绘制圆形 tft.fillCircle(40, 80, 20, TFT_GREEN); tft.drawCircle(90, 80, 20, TFT_YELLOW); // 显示不同大小的文字 tft.setTextColor(TFT_WHITE); tft.drawString(Small, 10, 120, 2); // 字体2 tft.drawString(Medium, 60, 120, 4); // 字体4 }实际使用中发现fill开头的函数会填充图形draw开头的只画边框。颜色常量如TFT_RED、TFT_BLUE等已经预定义可以直接使用。7. 显示传感器数据动态更新结合传感器使用时我们需要动态更新显示内容。这里有个技巧可以避免屏幕闪烁void loop() { int val analogRead(34); // 读取ESP32的GPIO34引脚 tft.fillRect(50, 50, 60, 30, TFT_BLACK); // 先清空区域 tft.setTextColor(TFT_WHITE); tft.drawNumber(val, 50, 50, 4); // 显示数值 delay(200); // 适当延时 }注意频繁刷新整个屏幕会导致闪烁。最佳实践是只更新需要变化的部分就像上面的例子那样先清空特定区域再绘制新内容。8. 高级技巧使用双缓冲减少闪烁当需要更流畅的动画效果时可以使用双缓冲技术TFT_eSprite spr TFT_eSprite(tft); // 创建缓冲Sprite void setup() { tft.init(); spr.createSprite(128, 160); // 创建与屏幕同尺寸的缓冲区 } void loop() { spr.fillSprite(TFT_BLACK); // 清空缓冲区 // 在缓冲区绘制内容 spr.setTextColor(TFT_WHITE); spr.drawString(FPS:60, 10, 10, 2); spr.pushSprite(0, 0); // 将缓冲区内容一次性推送到屏幕 delay(16); // 约60FPS }这种方法先在内存中绘制完整帧然后一次性显示到屏幕能有效减少闪烁。我在做一个简单的游戏项目时就用了这个技巧效果非常好。9. 常见问题排查指南根据我的经验新手常遇到这些问题屏幕全白/全黑检查背光是否接好确认电源电压足够3.3V检查RESET引脚是否接好显示颜色异常尝试修改User_Setup.h中的TFT_RGB_ORDER检查ST7735_GREENTAB/REDTAB等定义是否正确显示内容错位调整setRotation的参数确认TFT_WIDTH和TFT_HEIGHT设置正确屏幕闪烁或显示不稳定检查电源是否稳定尝试降低SPI频率缩短连接线长度记得我第一次使用时屏幕显示全是乱码最后发现是GPIO16被其他程序占用了。所以如果遇到奇怪问题可以尝试换一组GPIO引脚。10. 项目实战打造一个环境监测显示器结合DHT11温湿度传感器我们可以做一个完整的环境监测显示器#include TFT_eSPI.h #include DHT.h TFT_eSPI tft; DHT dht(15, DHT11); // GPIO15接DHT11 void setup() { tft.init(); tft.setRotation(3); dht.begin(); tft.fillScreen(TFT_BLACK); tft.setTextColor(TFT_WHITE); tft.drawString(Environment Monitor, 10, 10, 2); } void loop() { float temp dht.readTemperature(); float humi dht.readHumidity(); tft.fillRect(10, 40, 100, 60, TFT_BLACK); tft.drawString(Temp: String(temp) C, 10, 40, 4); tft.drawString(Humi: String(humi) %, 10, 80, 4); delay(2000); // 每2秒更新一次 }这个项目展示了如何将传感器数据实时显示在屏幕上。你可以进一步添加更多传感器或者设计更漂亮的UI界面。

更多文章