【花雕学编程】Arduino动手做（249）--GC9A01横向滚动的文本

  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目之一百二十八：ESP32+GC9A01之实现一个基本的逐行下降且横向滚动的文本效果

实验开源代码

/*
  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目之一百二十八：ESP32+GC9A01之实现一个基本的逐行下降且横向滚动的文本效果
*/

//       GC9A01---------- ESP32
//       RST ------------ NC（复位引脚，此处未连接）
//       CS ------------- D4（片选引脚，连接到ESP32的D4引脚）
//       DC ------------- D2（数据/命令选择引脚，连接到ESP32的D2引脚）
//       SDA ------------ D23 (green)（主数据输出引脚，连接到ESP32的D23引脚，绿色线）
//       SCL ------------ D18 (yellow)（时钟信号引脚，连接到ESP32的D18引脚，黄色线）
//       GND ------------ GND（接地引脚，连接到ESP32的接地端）
//       VCC -------------3V3（电源引脚，连接到ESP32的3.3V电源）

#include <TFT_eSPI.h>
#include <SPI.h>

TFT_eSPI tft = TFT_eSPI();

#define SCREEN_WIDTH 240
#define SCREEN_HEIGHT 240
#define TEXT_COLOR TFT_WHITE
#define BACKGROUND_COLOR TFT_BLACK
#define TEXT_SIZE 2
#define LINE_HEIGHT (16 * TEXT_SIZE) // 估计行高，根据字体大小调整
#define SCROLL_SPEED 5             // 横向滚动速度（像素/帧）
#define RISE_SPEED 1              // 垂直上升速度（像素/帧）
#define REFRESH_RATE 30           // 目标刷新率 (帧/秒)
#define REFRESH_INTERVAL (1000 / REFRESH_RATE)
#define START_Y (SCREEN_HEIGHT + LINE_HEIGHT) // 文本初始 Y 坐标在屏幕底部下方

const char* lines[] = {
  "This is the first line scrolling horizontally.",
  "Here's a slightly longer second line for testing.",
  "The third line is also on the move across the screen.",
  "Line number four just keeps on going and going...",
  "And finally, the fifth line of our scrolling text."
};
const int numLines = sizeof(lines) / sizeof(lines[0]);

int yOffsets[numLines];      // 每个文本行的垂直偏移量
int xOffsets[numLines];      // 每个文本行的横向滚动偏移量
unsigned long lastUpdate = 0;

void setup() {
  tft.init();
  tft.setRotation(2);
  tft.fillScreen(BACKGROUND_COLOR);
  tft.setTextSize(TEXT_SIZE);
  tft.setTextColor(TEXT_COLOR);
  tft.setTextWrap(false); // 禁止自动换行

  for (int i = 0; i < numLines; i++) {
    yOffsets[i] = START_Y - i * LINE_HEIGHT; // 初始化每行文本的垂直起始位置
    xOffsets[i] = 0;                         // 初始化所有行的横向偏移量为 0
  }
}

void loop() {
  if (millis() - lastUpdate > REFRESH_INTERVAL) {
    lastUpdate = millis();
    tft.fillScreen(BACKGROUND_COLOR);
    drawScrollingText();
    updateOffsets();
  }
  delay(1); // 稍微延时，避免过度占用 CPU
}

void drawScrollingText() {
  for (int i = 0; i < numLines; i++) {
    tft.drawString(lines[i], xOffsets[i], yOffsets[i]);
  }
}

void updateOffsets() {
  bool allLinesOffScreen = true; // 假设所有行都已离开屏幕顶部

  for (int i = 0; i < numLines; i++) {
    yOffsets[i] -= RISE_SPEED;
    if (yOffsets[i] + LINE_HEIGHT > 0) {
      allLinesOffScreen = false; // 至少有一行还在屏幕上
    }

    xOffsets[i] -= SCROLL_SPEED;
    int textWidth = tft.textWidth(lines[i]);
    if (xOffsets[i] < -textWidth) {
      xOffsets[i] = SCREEN_WIDTH; // 从右侧重新开始横向滚动
    }
  }

  // 如果所有行都已离开屏幕顶部，则将它们重置到屏幕底部
  if (allLinesOffScreen) {
    for (int i = 0; i < numLines; i++) {
      yOffsets[i] = START_Y - i * LINE_HEIGHT;
    }
  }
}
复制代码

代码解读：
1、引入库: 包含 TFT_eSPI.h 和 SPI.h 库来控制 TFT 屏幕。

2、定义常量:
SCREEN_WIDTH, SCREEN_HEIGHT: 屏幕尺寸。
TEXT_COLOR, BACKGROUND_COLOR: 文本和背景颜色。
TEXT_SIZE: 字体大小。
LINE_HEIGHT: 估计的文本行高，需要根据实际字体大小调整，以保证行间距合适。
SCROLL_SPEED: 文本横向滚动的速度，值越大越快。
DROP_SPEED: 文本垂直下降的速度，值越大越快。
REFRESH_RATE, REFRESH_INTERVAL: 控制屏幕刷新的频率。

3、存储文本: lines 数组存储要显示的文本行。numLines 计算文本行的数量。

4、偏移量:
yOffset: 控制所有文本行的垂直位置，初始时设置为屏幕高度，使文本从底部开始出现。
xOffsets: 一个数组，存储每个文本行的横向滚动偏移量，初始都为 0。

5、setup() 函数:
初始化 TFT 屏幕。
设置屏幕旋转方向。
填充背景颜色。
设置文本大小和颜色。
禁用文本自动换行，确保文本在一行内横向滚动。
初始化每个文本行的横向偏移量为 0。

6、loop() 函数:
使用 millis() 函数控制刷新频率。
每次刷新时，先填充背景色清除上一帧的内容。
调用 drawScrollingText() 绘制当前位置的文本。
调用 updateOffsets() 更新垂直和水平偏移量。
短暂延时，避免 CPU 占用过高。

7、drawScrollingText() 函数:
遍历 lines 数组中的每一行文本。
计算每一行文本的垂直位置 yPos，使其从 yOffset 开始，并根据行号和 LINE_HEIGHT 逐行向上排列。
使用 tft.drawString() 在计算出的位置绘制文本，横向位置由 xOffsets 控制。

8、updateOffsets() 函数:
减小 yOffset，使文本整体向上移动（逐行下降的效果）。
当 yOffset 小于 -numLines * LINE_HEIGHT 时，表示所有文本行都已移出屏幕上方，将 yOffset 重置为 SCREEN_HEIGHT，使文本从底部重新开始。
对于每一行文本，都减小其横向偏移量 xOffsets[i]，实现向左滚动。
计算当前文本行的宽度 textWidth。
当 xOffsets[i] 小于 -textWidth 时，表示该行文本已经完全滚出屏幕左侧，将其 xOffsets[i] 重置为 SCREEN_WIDTH，使其从屏幕右侧重新开始横向滚动。

实验场景图  动态图