TFT 彩屏驱动实战：从点亮到 LVGL 界面

📅 2026-05-19 · 📂 硬件编程 · ⏱ 阅读约 5 分钟

📺 B站推荐视频：ESP32驱动TFT彩屏教程（st7789，st7735）

概述

ESP32 连接 ST7789 TFT 彩屏，从基础驱动到嵌入式 GUI 框架 LVGL，打造你的设备仪表盘。TFT 彩屏是 IoT 设备最直观的输出方式——温湿度数据、设备状态、控制按钮，一块屏幕全搞定。

物料清单

物料	型号/参数	参考价格
TFT 屏幕	ST7789 1.54寸 240×240 IPS	~15元
ESP32 开发板	ESP32-S3-DevKitC / NodeMCU-32S	~20元
杜邦线	母对母 10cm 8根	~3元
面包板	830孔	~5元

接线图

🔌 接线

  ESP32        ST7789
  3.3V ──────── VCC (不要接5V!)
  GND  ──────── GND
  GPIO18 ────── SCL/SCLK (SPI时钟)
  GPIO17 ────── SDA/MOSI (SPI数据)
  GPIO5  ────── CS (片选)
  GPIO2  ────── DC (数据/命令)
  GPIO4  ────── RST (复位)
  GPIO15 ────── BL (背光, 接3.3V常亮亦可)

基础代码：TFT_eSPI 库点屏

// ST7789_Basic.ino
#include <TFT_eSPI.h>
TFT_eSPI tft;

void setup() {
  pinMode(15, OUTPUT);
  digitalWrite(15, HIGH);  // 背光
  tft.init();
  tft.setRotation(1);
  tft.fillScreen(TFT_BLACK);
  tft.setTextColor(TFT_WHITE, TFT_BLACK);
  tft.drawString("Hello ESP32!", 10, 10, 4);
}
void loop() {}

💡 PlatformIO 配置
在 platformio.ini 中无需额外配置引脚——TFT_eSPI 使用 User_Setup.h 或 build_flags 定义所有引脚和驱动型号。

进阶：LVGL 嵌入式 GUI 框架

LVGL（Light and Versatile Graphics Library）是嵌入式领域最流行的 GUI 框架，提供按钮、图表、滑块等组件。配合 SquareLine Studio 可拖拽设计界面。

// LVGL 最小示例
#include <lvgl.h>
#include <TFT_eSPI.h>

static lv_disp_draw_buf_t draw_buf;
static lv_color_t buf[240 * 10];

void my_disp_flush(lv_disp_drv_t *disp, const lv_area_t *area, lv_color_t *color_p) {
  tft.startWrite();
  tft.setAddrWindow(area->x1, area->y1, area->x2 - area->x1 + 1, area->y2 - area->y1 + 1);
  tft.pushColors((uint16_t *)color_p, (area->x2 - area->x1 + 1) * (area->y2 - area->y1 + 1), true);
  tft.endWrite();
  lv_disp_flush_ready(disp);
}

void setup() {
  lv_init(); tft.init();
  lv_disp_draw_buf_init(&draw_buf, buf, NULL, 240 * 10);
  static lv_disp_drv_t disp_drv;
  lv_disp_drv_init(&disp_drv);
  disp_drv.hor_res = 240; disp_drv.ver_res = 240;
  disp_drv.flush_cb = my_disp_flush;
  disp_drv.draw_buf = &draw_buf;
  lv_disp_drv_register(&disp_drv);
  
  lv_obj_t *btn = lv_btn_create(lv_scr_act());
  lv_obj_set_size(btn, 120, 50);
  lv_obj_center(btn);
  lv_obj_t *label = lv_label_create(btn);
  lv_label_set_text(label, "点我");
}
void loop() { lv_timer_handler(); delay(5); }

实战场景：智能温湿度仪表盘

场景：放在桌面，随时查看室内环境数据。物料：DHT22（~8元）+ ST7789 屏幕（~15元），总成本不到 30 元。应用：结合之前学过的 WiFi 把数据上传到云端。

// 每2秒刷新一次
static unsigned long last = 0;
if (millis() - last > 2000) {
  last = millis();
  float t = dht.readTemperature();
  float h = dht.readHumidity();
  tft.fillRect(0, 40, 240, 180, TFT_BLACK);
  tft.setTextColor(TFT_CYAN);
  tft.drawString("温度: " + String(t, 1) + " C", 20, 80, 4);
  tft.setTextColor(TFT_GREEN);
  tft.drawString("湿度: " + String(h, 1) + " %", 20, 130, 4);
}

常见问题

⚠️ 白屏无显示 — 检查背光 BL 引脚是否拉高、SPI 引脚接线是否正确（MOSI/SCLK 最常见接反）。

⚠️ 花屏/闪烁 — 用 tft.startWrite()/tft.endWrite() 包裹所有绘图操作，降低 SPI 频率到 10MHz。

⚠️ ESP32-S3 跑 LVGL 闪退 — 需在 platformio.ini 中加 -DUSE_HSPI_PORT（S3 的 FSPI 可能不兼容）。