【花雕学编程】Arduino动手做（249）--GC9A01屏39个特色案例

实验串口返回情况

实验场景图  动态图

  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目实验之二十三：模拟数字时钟

实验开源代码

/*
  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目实验之二十三：模拟数字时钟
*/

//       GC9A010 -------- 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 "SPI.h"
#include "Adafruit_GFX.h"
#include "Adafruit_GC9A01A.h"

// 定义屏幕引脚
#define TFT_CS 4        // 片选引脚
#define TFT_DC 2        // 数据/命令引脚
#define TFT_RST -1      // 重置引脚（若未连接请设置为 -1）

// 初始化屏幕对象
Adafruit_GC9A01A tft = Adafruit_GC9A01A(TFT_CS, TFT_DC, TFT_RST);

// 初始化时间变量
int hours = 12;
int minutes = 0;
int seconds = 0;

void setup() {
    Serial.begin(115200);          // 初始化串口通信
    Serial.println("Digital Clock - GC9A01");

    tft.begin();                   // 初始化屏幕
    tft.setRotation(2);            // 设置屏幕方向
    tft.fillScreen(GC9A01A_BLACK); // 清屏并设置背景为黑色

    // 静态显示标题
    tft.setTextSize(2);             // 设置字体大小
    tft.setTextColor(GC9A01A_YELLOW); // 设置文字颜色为黄色
    tft.setCursor(45, 160);         // 设置标题位置
    tft.print("Digital Clock");     // 显示静态标题
}

void loop() {
    // 清除上一帧的时间显示
    tft.fillRect(20, 80, 200, 60, GC9A01A_BLACK); // 仅清除时间区域

    // 设置时间显示的颜色和大小
    tft.setTextSize(4);              // 设置字体大小
    tft.setTextColor(GC9A01A_GREEN); // 设置文字颜色为绿色
    tft.setCursor(25, 90);           // 设置文字的起始位置

    // 格式化时间
    char timeBuffer[9];
    sprintf(timeBuffer, "%02d:%02d:%02d", hours, minutes, seconds);
    tft.print(timeBuffer);           // 在屏幕上打印时间

    // 更新时间
    delay(1000);                     // 延迟1秒
    seconds++;
    if (seconds >= 60) {
        seconds = 0;
        minutes++;
    }
    if (minutes >= 60) {
        minutes = 0;
        hours++;
    }
    if (hours >= 24) {
        hours = 0;
    }
}
复制代码

代码特色说明

1、动态时间更新：

使用变量 hours、minutes 和 seconds 模拟时间递增，每秒更新一次。

2、屏幕刷新效果：

每秒刷新屏幕的时间显示，通过 tft.fillScreen() 清除上一帧内容，确保动态显示效果。

3、多种颜色和字体效果：

时间部分使用绿色的大号字体，标题部分使用黄色的小号字体。

4、友好的时间格式：

使用 sprintf() 格式化时间，使其显示为 HH:MM:SS 格式，增强可读性。

5、效果描述

屏幕中央显示动态变化的数字时间，格式为 HH:MM:SS。

屏幕底部显示固定的标题“Digital Clock”，用于说明功能。

每秒钟刷新一次，模拟一个简单的数字时钟。

实验串口返回情况

实验场景图  动态图

  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目实验之二十四：动态彩虹背景 + 闪烁文字

实验开源代码

/*
  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口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 "SPI.h"
#include "Adafruit_GFX.h"
#include "Adafruit_GC9A01A.h"

// 定义屏幕引脚
#define TFT_CS 4        // 片选引脚
#define TFT_DC 2        // 数据/命令引脚
#define TFT_RST -1      // 重置引脚（若未连接请设置为 -1）

// 初始化屏幕对象
Adafruit_GC9A01A tft = Adafruit_GC9A01A(TFT_CS, TFT_DC, TFT_RST);

// 定义彩虹颜色数组
uint16_t colors[] = {GC9A01A_RED, GC9A01A_ORANGE, GC9A01A_YELLOW, GC9A01A_GREEN, GC9A01A_BLUE, GC9A01A_MAGENTA, GC9A01A_CYAN};
int colorIndex = 0; // 当前颜色索引

void setup() {
  Serial.begin(115200);          // 初始化串口通信
  Serial.println("Rainbow Background + Blinking Text");

  tft.begin();                   // 初始化屏幕
  tft.setRotation(2);            // 设置屏幕方向
  tft.fillScreen(GC9A01A_BLACK); // 清屏
}

void loop() {
  // 动态背景：切换彩虹颜色
  tft.fillScreen(colors[colorIndex]); // 填充当前颜色
  colorIndex++;
  if (colorIndex >= sizeof(colors) / sizeof(colors[0])) {
    colorIndex = 0; // 循环重置颜色索引
  }

  // 闪烁文字
  static bool showText = true;  // 用于切换显示状态
  if (showText) {
    tft.setTextSize(3);             // 设置字体大小
    tft.setTextColor(GC9A01A_WHITE); // 设置文字颜色
    tft.setCursor(30, 120);         // 设置文字位置
    tft.print("TFT GC9A01");        // 显示文字
  } else {
    // 清除文字区域
    tft.fillRect(30, 120, 180, 30, colors[colorIndex]); // 用背景颜色填充文字区域
  }
  showText = !showText;               // 切换显示状态

  delay(500);                         // 延迟500毫秒
}
复制代码

代码特色说明

1、彩虹背景动态切换：

使用颜色数组 colors[] 实现背景颜色循环，从红色到紫色依次切换。

每种背景颜色停留 500 毫秒，通过 delay(500) 控制切换速度。

2、闪烁文字效果：

文字 “TFT GC9A01” 以 500 毫秒的间隔闪烁显示和隐藏。

使用 fillRect() 方法清除文字区域，让背景颜色填充该区域。

3、背景颜色与文字匹配：

隐藏文字时，背景颜色会填充文字区域，保持视觉一致性。

4、循环展示效果：

背景颜色和文字闪烁效果不断循环，适合演示动态屏幕特效。

5、效果描述

屏幕动态切换彩虹颜色作为背景，从红色、橙色到紫色依次呈现。

屏幕中央显示白色文字 “TFT GC9A01”，以闪烁方式呈现，每秒交替显示和隐藏。

整个效果流畅且富有视觉冲击力，适合制作炫目的界面展示。

实验串口返回情况

实验场景图  动态图

  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目实验之二十五：模拟指针式钟表

实验开源代码

/*
  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口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 "SPI.h"
#include "Adafruit_GFX.h"
#include "Adafruit_GC9A01A.h"

// 定义屏幕引脚
#define TFT_CS 4        // 片选引脚
#define TFT_DC 2        // 数据/命令引脚
#define TFT_RST -1      // 重置引脚（若未连接请设置为 -1）

// 初始化屏幕对象
Adafruit_GC9A01A tft = Adafruit_GC9A01A(TFT_CS, TFT_DC, TFT_RST);

#define SCREEN_CENTER_X 120    // 屏幕中心X坐标
#define SCREEN_CENTER_Y 120    // 屏幕中心Y坐标
#define CLOCK_RADIUS 100       // 钟表半径
#define HOUR_HAND_LENGTH 50    // 时针长度
#define MINUTE_HAND_LENGTH 70  // 分针长度
#define SECOND_HAND_LENGTH 90  // 秒针长度

void drawClockFace() {
    // 绘制钟表表盘
    tft.fillScreen(GC9A01A_BLACK);               // 设置背景为黑色
    tft.drawCircle(SCREEN_CENTER_X, SCREEN_CENTER_Y, CLOCK_RADIUS, GC9A01A_WHITE); // 外圆
    for (int i = 0; i < 12; i++) {               // 绘制小时刻度
        float angle = i * 30 * 3.14159 / 180;    // 每小时的刻度角度
        int x = SCREEN_CENTER_X + CLOCK_RADIUS * 0.85 * cos(angle);
        int y = SCREEN_CENTER_Y + CLOCK_RADIUS * 0.85 * sin(angle);
        tft.fillCircle(x, y, 3, GC9A01A_WHITE);  // 绘制刻度点
    }
}

void drawHand(int length, int angle, uint16_t color) {
    // 绘制时钟指针
    float radian = angle * 3.14159 / 180;
    int x = SCREEN_CENTER_X + length * cos(radian);
    int y = SCREEN_CENTER_Y + length * sin(radian);
    tft.drawLine(SCREEN_CENTER_X, SCREEN_CENTER_Y, x, y, color);
}

void setup() {
    Serial.begin(115200);             // 初始化串口
    Serial.println("Analog Clock Simulation");

    tft.begin();                      // 初始化屏幕
    tft.setRotation(2);               // 设置屏幕方向
    drawClockFace();                  // 绘制表盘
}

void loop() {
    static int hours = 10;            // 当前小时
    static int minutes = 15;          // 当前分钟
    static int seconds = 0;           // 当前秒钟

    // 清除指针区域（不清除表盘）
    tft.fillCircle(SCREEN_CENTER_X, SCREEN_CENTER_Y, CLOCK_RADIUS - 5, GC9A01A_BLACK);

    // 绘制时针、分针和秒针
    drawHand(HOUR_HAND_LENGTH, hours * 30 + minutes / 2, GC9A01A_RED);   // 时针
    drawHand(MINUTE_HAND_LENGTH, minutes * 6, GC9A01A_WHITE);            // 分针
    drawHand(SECOND_HAND_LENGTH, seconds * 6, GC9A01A_BLUE);             // 秒针

    delay(1000);                     // 每秒刷新一次
    seconds++;
    if (seconds >= 60) {
        seconds = 0;
        minutes++;
    }
    if (minutes >= 60) {
        minutes = 0;
        hours++;
    }
    if (hours >= 12) {
        hours = 0;
    }
}
复制代码

代码说明

1、动态指针绘制：

通过 drawHand() 绘制时针、分针和秒针，模拟指针的动态运动。

角度计算使用 angle = 秒/分/小时 * 单位角度。

2、钟表表盘设计：

使用 drawCircle() 和 fillCircle() 绘制圆形表盘和小时刻度点。

3、秒针运动效果：

每秒钟刷新一次秒针位置，分针和时针会根据秒针更新。

4、颜色区分：

时针为红色、分针为白色、秒针为蓝色，方便区分每个指针的功能。

5、圆形屏幕完美适配：

钟表中心与屏幕中心对齐，表盘半径与屏幕尺寸相匹配。

6、效果描述

屏幕中央显示一个模拟的指针式钟表，时针、分针和秒针动态更新。

表盘显示清晰的小时刻度，指针颜色丰富，视觉效果生动。

每秒钟更新秒针位置，模拟真实的时钟效果。

实验场景图  动态图

  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目实验之二十六：渐变色背景和动态旋转的风车动画

实验开源代码

/*
  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口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 "SPI.h"
#include "Adafruit_GFX.h"
#include "Adafruit_GC9A01A.h"

// 定义屏幕引脚
#define TFT_CS 4        // 片选引脚
#define TFT_DC 2        // 数据/命令引脚
#define TFT_RST -1      // 重置引脚（若未连接请设置为 -1）

// 初始化屏幕对象
Adafruit_GC9A01A tft = Adafruit_GC9A01A(TFT_CS, TFT_DC, TFT_RST);

#define SCREEN_CENTER_X 120  // 屏幕中心X坐标
#define SCREEN_CENTER_Y 120  // 屏幕中心Y坐标
#define WINDMILL_RADIUS 100  // 风车旋转半径
#define BLADE_WIDTH 40       // 风车叶片宽度
#define ROTATION_DELAY 100   // 每次旋转的延迟（毫秒）

void drawGradientBackground(uint16_t startColor, uint16_t endColor) {
    for (int i = 0; i < 240; i++) {  // 从顶部到底部绘制
        uint16_t color = startColor + (endColor - startColor) * i / 240;
        tft.drawFastHLine(0, i, 240, color);  // 在屏幕上绘制水平线
    }
}

void drawBlade(float angle, uint16_t color) {
    // 将角度转换为弧度
    float radian = angle * 3.14159 / 180;

    // 计算风车叶片的坐标
    int x1 = SCREEN_CENTER_X + WINDMILL_RADIUS * cos(radian);
    int y1 = SCREEN_CENTER_Y + WINDMILL_RADIUS * sin(radian);
    int x2 = SCREEN_CENTER_X + (WINDMILL_RADIUS - BLADE_WIDTH) * cos(radian + 3.14159 / 6);
    int y2 = SCREEN_CENTER_Y + (WINDMILL_RADIUS - BLADE_WIDTH) * sin(radian + 3.14159 / 6);
    int x3 = SCREEN_CENTER_X + (WINDMILL_RADIUS - BLADE_WIDTH) * cos(radian - 3.14159 / 6);
    int y3 = SCREEN_CENTER_Y + (WINDMILL_RADIUS - BLADE_WIDTH) * sin(radian - 3.14159 / 6);

    // 绘制风车叶片（三角形）
    tft.fillTriangle(x1, y1, x2, y2, x3, y3, color);
}

void setup() {
    Serial.begin(115200);           // 初始化串口通信
    Serial.println("Gradient + Rotating Windmill");

    tft.begin();                    // 初始化屏幕
    tft.setRotation(2);             // 设置屏幕方向

    // 绘制渐变背景
    drawGradientBackground(GC9A01A_BLUE, GC9A01A_CYAN); 
}

void loop() {
    static int angle = 0;           // 旋转角度初始化

    // 绘制风车动画
    tft.fillCircle(SCREEN_CENTER_X, SCREEN_CENTER_Y, WINDMILL_RADIUS, GC9A01A_BLACK); // 清除之前的风车
    drawBlade(angle, GC9A01A_RED);          // 绘制第一个叶片
    drawBlade(angle + 120, GC9A01A_GREEN); // 绘制第二个叶片
    drawBlade(angle + 240, GC9A01A_YELLOW);// 绘制第三个叶片

    // 更新旋转角度
    angle += 10;
    if (angle >= 360) {
        angle = 0; // 角度循环
    }

    delay(ROTATION_DELAY);          // 控制旋转速度
}
复制代码

代码说明

1、渐变背景：

使用 drawGradientBackground() 函数，从屏幕顶部到底部绘制蓝色到青色的平滑渐变。

背景增强了视觉效果，同时与动态动画完美结合。

2、动态旋转风车：

通过 drawBlade() 函数绘制三叶风车，叶片颜色分别为红、绿、黄。

动态更新角度，模拟顺时针旋转的效果。

3、高性能绘制：

使用 fillTriangle() 快速渲染叶片，清除时仅覆盖风车区域而不清除整个屏幕，优化了性能。

4、循环动画：

叶片不断旋转，延迟由 ROTATION_DELAY 控制，动画平滑流畅。

5、效果描述

背景为蓝色到青色的渐变，增强视觉层次感。

屏幕中央显示一个动态旋转的三叶风车，各叶片颜色为红、绿、黄。

风车顺时针旋转，旋转效果自然，色彩丰富。

这是一个独特的动态视觉效果，既展现了屏幕的渲染能力，又提供了一个生动的展示。

实验场景图  动态图

实验场景图  动态图