【物联网初探】- 02 - ESP32 利用 SPI 连通 TFT 彩屏 (Arduino IDE)

1. 硬件配置

1.1 ESP32

• 本篇中的 ESP32 仍然是上一篇的板子。

1.1 TFT 彩屏

• 本篇使用的 TFT 屏幕 也是在某宝上买的，显示屏的型号是 ILI9488 尺寸是 3.5寸480*320。

• 如果是想配合 ESP32 一起玩，建议去搜搜 ESP32 搭配 TFT 的组合进行购买，某宝上有很多集成度很高的，不用自己接线，如果单买屏幕自己连 ESP32，记得买带转接板的屏幕，能够直接用杜邦线连 SPI 接口。

  

1.2 TFT 彩屏上的触摸屏

• 该屏幕有带触摸和不带触摸的，观察了大部分带触摸的，是在屏幕上贴一块同样大小的触摸屏，并把线接在一起，触摸屏可能是类似 XPT2046 的产品。下图是该彩屏的背面，可以看到左侧，触摸屏的接线端子（ T_IRQ、T_DO、T_DIN、T_CS、T_CLK）是跟 TFT 的接线端子（ LED 至 VCC ）并排在一起的。

  

2. 接线

2.1 SPI 接口简介

• SPI（Serial Peripheral Interface）是串行外设接口的缩写，是一种高速的，全双工，同步的通信总线，并且在芯片的管脚上只占用四根线，这四根线分别是：

  • MISO– Master Input Slave Output**，**主设备数据输入，从设备数据输出，也称 SDO。
  • MOSI– Master Output Slave Input，主设备数据输出，从设备数据输入，也称 SDI。
  • SCLK– Serial Clock，时钟信号，由主设备产生，也有板子上标为 SCK。
  • CS – Chip Select，从设备使能信号，由主设备控制。

• 除了上述主要的 4 根线，TFT屏幕还有其他管脚标识及含义如下，参考这个文档TFT User Manual

  • LED - 该引脚用于控制背光的强度，如果不是由模拟电压控制，将此引脚连接到 3.3V 会将显示器设置为全亮度。 。
  • DC - Data/Command select，DC 线低电平时，接受命令； DC 线高电平，接受数据。
  • RESET - 用于重置，也有板子标为 RST。
  • VCC - 5V/3.3V 供电
  • GND - 接地

2.2 TFT SPI 与 ESP GPIO 连接

网上各类博客的接线图五花八门，板子也不尽相同，这里我总结一个基本原则如下。

• 接线原则：SPI 管脚名称 - 接 - GPIO 号，举例，如果你确定 SPI 中的 SCK 管脚应该接 ESP 32 上的 GPIO = 18，那么不论你的 ESP32 板子上面是怎么标的号，只要从原理图上找到 GPIO 为 18 的管脚并与 TFT 屏幕的 SCK 管脚用导线连起来就对了。

• 这里分享一个接线对应关系如下表所示：

  TFT 9488 显示触摸屏 SPI 管脚 （从上至下）	ESP 32 GPIO 管脚
  T_IRQ 【触屏相关】	空
  T_DO 【触屏相关】	19 单独接
  T_DIN 【触屏相关】	23 与显示屏 SDI 并联，同样接 23
  T_CS 【触屏相关】	21 单独接
  T_CLK【触屏相关】	18 与显示屏 SCK 并联，同样接 18
  SDO(MISO) 【显示屏相关】	空着 注意这里 SDO 空着
  LED 【显示屏相关】	可接 3v3
  SCK 【显示屏相关】	18
  SDI(MOSI) 【显示屏相关】	23
  DC 【显示屏相关】	2
  RESET 【显示屏相关】	4
  CS 【显示屏相关】	15
  GND 【显示屏相关】	GND
  VCC 【显示屏相关】	3v3/V5 均可

• 特别注意，接下来我们将使用 TFT_eSPI 这个 Arduino 库来驱动屏幕，为了避免触摸屏与显示屏的冲突，这里将显示屏的 SDO 空着，只接触摸屏的 T_DO 即可，参考了这位博主ESP32连接ILI9488触摸屏触摸功能无法使用问题。

• 上表中有需要并联的线，有些博客介绍了直接驱动触摸屏的方法，利用了触摸屏的 Arduino 库（例如 TFT Touch Shield），然后需要单独定义触摸屏的 针脚号，而 TFT_eSPI 库中直接能够驱动触摸屏，前提是把触摸屏的相关线和显示屏并在一起，仅需要单独接 T_CS 这一根即可。

3. TFT_eSPI 库驱动屏幕

TFT_eSPI 是在 Ardunio 中编写 ESP32 驱动 TFT 屏幕最广泛使用的库，方便入门。

3.1 Arduino 中安装 TFT_eSPI

• 仍然是在 Tools - Manage Libraries 中打开库管理器，然后搜索 TFT_eSPI 找到 Bodmer 作者的进行安装。github - TFT_eSPI

• 安装后就可以在 File - Examples 中看到 TFT_eSPI 相关的例程了，那么在测试例子之前，还有一些配置工作要做。

3.2 TFT_eSPI 配置文件

• 已安装好库后，一般在 ubuntu 你的 arduino 安装路径下会有一个 libraries 文件夹，打开它就能看到 TFT_eSPI 这个文件夹。

  

• 进入后，打开 User_Setup.h 这个头文件，我们需要针对我们的屏幕和管脚进行一些配置定义。

• 需要修改的主要有，显示屏型号、尺寸、管脚与ESP的GPIO对应关系、字体、SPI参数这几项，分享一个我的配置如下，删去了大部分注释。

  #define ILI9488_DRIVER
  #define TFT_WIDTH  320
  #define TFT_HEIGHT 480
  
  // The hardware SPI can be mapped to any pins
  #define TFT_MISO 19
  #define TFT_MOSI 23
  #define TFT_SCLK 18
  #define TFT_CS   15  // Chip select control pin
  #define TFT_DC    2  // Data Command control pin
  #define TFT_RST   4  // Reset pin (could connect to RST pin)
  #define TOUCH_CS 21
  
  // Section 3. Define the fonts that are to be used here
  #define LOAD_GLCD   // Font 1. Original Adafruit 8 pixel font needs ~1820 bytes in FLASH
  #define LOAD_FONT2  // Font 2. Small 16 pixel high font, needs ~3534 bytes in FLASH, 96 characters
  #define LOAD_FONT4  // Font 4. Medium 26 pixel high font, needs ~5848 bytes in FLASH, 96 characters
  #define LOAD_FONT6  // Font 6. Large 48 pixel font, needs ~2666 bytes in FLASH, only characters 1234567890:-.apm
  #define LOAD_FONT7  // Font 7. 7 segment 48 pixel font, needs ~2438 bytes in FLASH, only characters 1234567890:-.
  #define LOAD_FONT8  // Font 8. Large 75 pixel font needs ~3256 bytes in FLASH, only characters 1234567890:-.
  //#define LOAD_FONT8N // Font 8. Alternative to Font 8 above, slightly narrower, so 3 digits fit a 160 pixel TFT
  #define LOAD_GFXFF  // FreeFonts. Include access to the 48 Adafruit_GFX free fonts FF1 to FF48 and custom fonts
  
  #define SMOOTH_FONT
  
  // Section 4. Other options
  #define SPI_FREQUENCY  27000000
  #define SPI_READ_FREQUENCY  20000000
  #define SPI_TOUCH_FREQUENCY  2500000
  
  #define USE_HSPI_PORT //这条重要
  

• 这里简要说明一下:

  • Section 3 的字体和Section 4的Other options保持了默认没有动；
  • 最后一句 USE_HSPI_PORT 打开了注释，参考了这个博主LittleVGL踩坑指南03：Arduino下显示和触摸驱动配置(TFT_eSPI)；
  • 最上面三句就是按照你的屏幕来选择，我是 9488，480x320，所以我选择这些参数；
  • 中间的接线定义完全跟 2.2 节中的表格一致，注意这里需要把 TOUCH_CS 打开注释并设置 GPIO 号。
  • 上述修改完成后，保存 User_Setup.h 文件即可，配置就结束了。

3.3 Demo_3D_cube 例程测试

• 从 File - Examples - TFT_eSPI - 480x320 中打开 Demo_3D_cube 这个例子，代码较多就不再这里放了。

• 编译上传之前别忘了给串口权限 sudo chmod 777 /dev/ttyUSB0 ，根据你自己的串口来就行。

• 最后，编译，上传都没有问题，屏幕上出现了旋转变换的立方体。

esp32 上 TFT