【花雕学编程】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"                   // 引入SPI库，用于与SPI设备通信
#include "Adafruit_GFX.h"          // 引入Adafruit GFX库，用于图形绘制
#include "Adafruit_GC9A01A.h"      // 引入GC9A01A显示屏驱动库

#define TFT_DC 2                   // 定义TFT显示屏的DC引脚
#define TFT_CS 4                   // 定义TFT显示屏的CS引脚

Adafruit_GC9A01A tft(TFT_CS, TFT_DC); // 创建GC9A01A对象，初始化显示屏

void setup() {
    Serial.begin(9600);            // 初始化串口通信，波特率为9600
    Serial.println(" ");
    Serial.println("GC9A01A Circle Animation Test!"); // 打印测试信息到串口
    Serial.println(" ");
    Serial.println("项目实验之四：放大与缩小的动态同心园");

    tft.begin();                   // 初始化显示屏
    tft.setRotation(3);            // 设置显示屏方向
    tft.fillScreen(GC9A01A_BLACK); // 清屏，填充黑色背景
}

void loop() {
    int centerX = tft.width() / 2;  // 屏幕中心X坐标
    int centerY = tft.height() / 2; // 屏幕中心Y坐标
    int radius = 10;                // 圆的初始半径
    int step = 10;                  // 半径递增步长
    bool increasing = true;         // 控制半径增大或减小

    // 循环画圆动画
    for (int i = 0; i < 50; i++) {  // 限制循环次数，防止死循环
        tft.fillScreen(GC9A01A_BLACK); // 清屏，避免重叠

        // 绘制当前圆
        tft.drawCircle(centerX, centerY, radius, GC9A01A_WHITE);

        // 控制半径的增大或减小
        if (increasing) {
            radius += step;         // 增大半径
            if (radius >= 100) {    // 达到最大值后反转方向
                increasing = false;
            }
        } else {
            radius -= step;         // 减小半径
            if (radius <= 10) {     // 达到最小值后反转方向
                increasing = true;
            }
        }

        delay(300); // 延迟0.3秒
    }
}
复制代码

代码解读：
1、引入库文件

#include "SPI.h"
#include "Adafruit_GFX.h"
#include "Adafruit_GC9A01A.h"
复制代码

SPI.h：提供SPI协议支持，SPI是一种快速的串行通信方式，用于Arduino与GC9A01A显示屏进行数据交换。
Adafruit_GFX.h：一个通用的图形库，支持绘制图形元素（如线条、圆形、矩形等）和显示文本。
Adafruit_GC9A01A.h：GC9A01A显示屏的特定驱动库，用于初始化和操作该型号的显示屏。

2、定义引脚与屏幕对象

#define TFT_DC 2
#define TFT_CS 4

Adafruit_GC9A01A tft(TFT_CS, TFT_DC);
复制代码

TFT_DC：定义显示屏的数据/命令选择引脚（DC），用于区分发送的是指令还是数据。
TFT_CS：定义显示屏的片选引脚（CS），用于启用或禁用屏幕与控制器的通信。
tft：通过Adafruit_GC9A01A创建的对象，表示对GC9A01A显示屏的控制实例。
3、初始化显示屏（setup 函数）

void setup() {
   Serial.begin(9600); 
   Serial.println("GC9A01A Test!");

   tft.begin();
   tft.setRotation(3); 
   tft.fillScreen(GC9A01A_BLACK);
}
复制代码

串口通信初始化：
Serial.begin(9600) 设置波特率为9600，便于调试和查看输出信息。
Serial.println("GC9A01A Test!") 向串口输出测试信息，表明程序已启动。
显示屏初始化：
tft.begin() 完成屏幕的初始化工作，使其准备接受控制指令。
tft.setRotation(3) 设置屏幕的显示方向，3表示特定的旋转角度（通常是逆时针旋转270°）。
tft.fillScreen(GC9A01A_BLACK) 将屏幕背景填充为黑色（清屏操作）。

4、主循环逻辑（loop 函数）

void loop() {
   int centerX = tft.width() / 2;
   int centerY = tft.height() / 2;
   int radius = 10;
   int step = 10;
   bool increasing = true;

   for (int i = 0; i < 50; i++) {
       tft.fillScreen(GC9A01A_BLACK);
       tft.drawCircle(centerX, centerY, radius, GC9A01A_WHITE);

       if (increasing) {
           radius += step;
           if (radius >= 100) {
               increasing = false;
           }
       } else {
           radius -= step;
           if (radius <= 10) {
               increasing = true;
           }
       }

       delay(300);
   }
}
复制代码

主逻辑分解
屏幕中心点坐标计算：
centerX = tft.width() / 2：计算屏幕宽度的一半，获取X轴的中心位置。
centerY = tft.height() / 2：计算屏幕高度的一半，获取Y轴的中心位置。
圆的动态参数初始化：
radius = 10：初始半径设为10像素。
step = 10：每次循环半径变化的步长为10像素。
increasing = true：设置半径增长的初始方向为增大。
循环绘制圆动画：
tft.fillScreen(GC9A01A_BLACK)：在每次绘制前清屏，防止圆形重叠。
tft.drawCircle(centerX, centerY, radius, GC9A01A_WHITE)：以屏幕中心为圆心，绘制当前半径的白色圆形。
控制圆半径的增长与缩减：
如果increasing为true，半径增加，当达到最大值（100）时，改为减小方向。
如果increasing为false，半径减小，当达到最小值（10）时，改为增大方向。
动画节奏控制：
delay(300)：每次绘制后延时300毫秒，控制画圆的速度，增强视觉效果。

5、总结
这段代码的功能是：
以屏幕的中心为原点，动态绘制半径逐渐增大或减小的圆形。
半径变化范围在10到100像素之间，形成“呼吸”式的动画效果。
每次绘制后清屏，避免圆形堆叠，保持屏幕画面整洁。

实验串口返回情况

实验场景图  动态图

  【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"                   // 引入SPI库
#include "Adafruit_GFX.h"          // 引入Adafruit GFX库
#include "Adafruit_GC9A01A.h"      // 引入GC9A01A显示屏驱动库

#define TFT_DC 2                   // 定义TFT显示屏的DC引脚
#define TFT_CS 4                   // 定义TFT显示屏的CS引脚

Adafruit_GC9A01A tft(TFT_CS, TFT_DC); // 创建GC9A01A对象

void setup() {
    Serial.begin(9600);            // 初始化串口通信
    Serial.println("Multi-Circle Animation with Color Change!");

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

void loop() {
    int centerX = tft.width() / 2; // 屏幕中心X坐标
    int centerY = tft.height() / 2; // 屏幕中心Y坐标

    // 定义颜色数组用于动态颜色切换
    uint16_t colors[] = {GC9A01A_RED, GC9A01A_GREEN, GC9A01A_BLUE, GC9A01A_YELLOW, GC9A01A_CYAN, GC9A01A_MAGENTA, GC9A01A_WHITE};
    int colorCount = sizeof(colors) / sizeof(colors[0]);
    static int colorIndex = 0;      // 当前颜色索引

    static int radius1 = 10;        // 第一个圆的半径
    static int radius2 = 20;        // 第二个圆的半径
    static int radius3 = 30;        // 第三个圆的半径

    int step = 5;                   // 半径的变化步长
    static bool increasing1 = true; // 控制第一个圆半径增减
    static bool increasing2 = true; // 控制第二个圆半径增减
    static bool increasing3 = true; // 控制第三个圆半径增减

    // 清屏，绘制新一帧动画
    tft.fillScreen(GC9A01A_BLACK);

    // 绘制三个圆
    tft.drawCircle(centerX, centerY, radius1, colors[colorIndex]);                 // 圆1
    tft.drawCircle(centerX, centerY, radius2, colors[(colorIndex + 1) % colorCount]); // 圆2
    tft.drawCircle(centerX, centerY, radius3, colors[(colorIndex + 2) % colorCount]); // 圆3

    // 更新第一个圆半径
    if (increasing1) {
        radius1 += step;
        if (radius1 >= 115) {       // 达到最大半径后反向
            increasing1 = false;
        }
    } else {
        radius1 -= step;
        if (radius1 <= 10) {        // 达到最小半径后反向
            increasing1 = true;
        }
    }

    // 更新第二个圆半径
    if (increasing2) {
        radius2 += step;
        if (radius2 >= 115) {
            increasing2 = false;
        }
    } else {
        radius2 -= step;
        if (radius2 <= 10) {
            increasing2 = true;
        }
    }

    // 更新第三个圆半径
    if (increasing3) {
        radius3 += step;
        if (radius3 >= 115) {
            increasing3 = false;
        }
    } else {
        radius3 -= step;
        if (radius3 <= 10) {
            increasing3 = true;
        }
    }

    // 更新颜色索引
    colorIndex = (colorIndex + 1) % colorCount;

    // 延时0.3秒，控制动画速度
    delay(300);
}
复制代码

代码说明

1、颜色变化：

定义一个颜色数组colors，包含多种颜色（红、绿、蓝等）。

每次循环通过增加颜色索引colorIndex，动态切换绘制的颜色。

2、多圆绘制：

绘制三个圆，分别使用不同的颜色索引，让每个圆的颜色不同。

每个圆的半径独立变化，通过不同的逻辑控制，形成丰富的视觉效果。

3、半径变化控制：

每个圆的半径在10到115像素之间变化，分别通过变量increasing1、increasing2和increasing3独立控制。

4、动态清屏：

每次循环用tft.fillScreen(GC9A01A_BLACK)清屏，保持画面整洁，仅显示当前的圆形动画。

5、可扩展性：

圆的数量和颜色可以轻松扩展，通过增加数组或变量即可实现更多效果。

效果描述

屏幕上会同时绘制三个动态圆，圆的半径在10到115像素之间往复变化。

每个圆的颜色随着时间循环变化，形成绚丽的动画效果。

三个圆独立控制半径变化，带来层次感和动态美感。

实验场景图  动态图

实验记录视频（45秒）



【【花雕学编程】Arduino动手做（249）---ESP32驱动1.28寸 TFT GC9A01圆屏之多色彩动态循环同心园】



https://www.bilibili.com/video/BV1EbosYJEc7/?share_source=copy_web&vd_source=371a292a55e5ca9be994cbb4a86cc987

  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目实验之六：最大半径120的多彩填充圆形

实验开源代码

/*
  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目实验之六：最大半径120的多彩填充圆形
*/

//       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"                   // 引入SPI库
#include "Adafruit_GFX.h"          // 引入Adafruit GFX库
#include "Adafruit_GC9A01A.h"      // 引入GC9A01A显示屏驱动库

#define TFT_DC 2                   // 定义TFT显示屏的DC引脚
#define TFT_CS 4                   // 定义TFT显示屏的CS引脚

Adafruit_GC9A01A tft(TFT_CS, TFT_DC); // 创建GC9A01A对象

void setup() {
    Serial.begin(9600);            // 初始化串口通信
    Serial.println("Multi-Colored Filled Circle with Max Radius 120!");

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

void loop() {
    int centerX = tft.width() / 2;  // 屏幕中心X坐标
    int centerY = tft.height() / 2; // 屏幕中心Y坐标

    // 定义颜色数组用于动态颜色切换
    uint16_t colors[] = {GC9A01A_RED, GC9A01A_GREEN, GC9A01A_BLUE, GC9A01A_YELLOW, GC9A01A_CYAN, GC9A01A_MAGENTA, GC9A01A_WHITE};
    int colorCount = sizeof(colors) / sizeof(colors[0]);
    static int colorIndex = 0;      // 当前颜色索引

    static int radius = 10;         // 圆的初始半径
    int step = 5;                   // 半径变化步长
    int maxRadius = 120;            // 最大半径设置为120
    int minRadius = 10;             // 最小半径
    static bool increasing = true;  // 控制半径增减方向

    // 清屏
    tft.fillScreen(GC9A01A_BLACK);

    // 绘制填充圆
    tft.fillCircle(centerX, centerY, radius, colors[colorIndex]);

    // 调整圆半径
    if (increasing) {
        radius += step;             // 增加半径
        if (radius >= maxRadius) {  // 达到最大半径时反向
            increasing = false;
        }
    } else {
        radius -= step;             // 减少半径
        if (radius <= minRadius) {  // 达到最小半径时反向
            increasing = true;
        }
    }

    // 更新颜色索引
    colorIndex = (colorIndex + 1) % colorCount;

    // 延时0.3秒
    delay(300);
}
复制代码

代码解读：

1、最大半径调整：

将最大半径maxRadius设定为120，保证圆形的大小动态变化达到指定值。

2、多彩填充效果：

使用tft.fillCircle绘制圆形填充，增强动画的视觉丰富度。

动态颜色切换通过颜色数组colors实现，每次循环绘制时自动更新颜色。

3、逻辑控制：

使用increasing变量控制半径的增减，确保圆形在最小半径10和最大半径120之间循环变化。

4、动画节奏：

延时delay(300)保证圆形绘制的节奏稳定且不失流畅。

5、效果描述

一个填充圆形在屏幕中央动态绘制，其半径从10像素逐渐增大到120像素，并往复变化。

每次绘制的圆形颜色都会在红、绿、蓝、黄、青、紫和白之间循环切换。

动画流畅且色彩丰富，具有较强的视觉吸引力。

代码解读：

1、最大半径调整：

将最大半径maxRadius设定为120，保证圆形的大小动态变化达到指定值。

2、多彩填充效果：

使用tft.fillCircle绘制圆形填充，增强动画的视觉丰富度。

动态颜色切换通过颜色数组colors实现，每次循环绘制时自动更新颜色。

3、逻辑控制：

使用increasing变量控制半径的增减，确保圆形在最小半径10和最大半径120之间循环变化。

4、动画节奏：

延时delay(300)保证圆形绘制的节奏稳定且不失流畅。

5、效果描述

一个填充圆形在屏幕中央动态绘制，其半径从10像素逐渐增大到120像素，并往复变化。

每次绘制的圆形颜色都会在红、绿、蓝、黄、青、紫和白之间循环切换。

动画流畅且色彩丰富，具有较强的视觉吸引力。

实验场景图  动态图

  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目实验之七：大小往复循环显示字母“OK”

实验开源代码

/*
  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目实验之七：大小往复循环显示字母“OK”
*/

//       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"                   // 引入SPI库
#include "Adafruit_GFX.h"          // 引入Adafruit GFX库
#include "Adafruit_GC9A01A.h"      // 引入GC9A01A显示屏驱动库

#define TFT_DC 2                   // 定义TFT显示屏的DC引脚
#define TFT_CS 4                   // 定义TFT显示屏的CS引脚

Adafruit_GC9A01A tft(TFT_CS, TFT_DC); // 创建GC9A01A对象

void setup() {
    Serial.begin(9600);            // 初始化串口通信
    Serial.println("Display 'OK' Animation!");

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

void loop() {
    int centerX = tft.width() / 2; // 屏幕中心X坐标
    int centerY = tft.height() / 2; // 屏幕中心Y坐标

    static int textSize = 1;       // 初始字号
    int step = 1;                  // 字号变化步长
    int maxSize = 5;               // 最大字号
    int minSize = 1;               // 最小字号
    static bool increasing = true; // 控制字号增减方向

    // 清屏
    tft.fillScreen(GC9A01A_BLACK);

    // 设置文字属性
    tft.setTextColor(GC9A01A_WHITE);
    tft.setTextSize(textSize);

    // 显示字母“OK”
    tft.setCursor(centerX - (6 * textSize), centerY - (8 * textSize)); // 让“OK”居中
    tft.print("OK");

    // 调整字号
    if (increasing) {
        textSize += step;          // 增加字号
        if (textSize >= maxSize) { // 达到最大字号时反向
            increasing = false;
        }
    } else {
        textSize -= step;          // 减小字号
        if (textSize <= minSize) { // 达到最小字号时反向
            increasing = true;
        }
    }

    // 延时0.3秒
    delay(300);
}
复制代码

代码说明

1、字号大小控制：

通过textSize变量控制字号大小，字号在minSize（1）和maxSize（5）之间循环变化。

使用increasing变量控制字号增大或减小。

2、动态居中显示：

根据字号大小动态调整setCursor的起始位置，让“OK”始终显示在屏幕中心。

计算方式：centerX - (6 * textSize) 和 centerY - (8 * textSize)，其中6和8为字符的像素基准值。

3、屏幕清屏：

每次绘制前调用tft.fillScreen(GC9A01A_BLACK)清屏，避免字符重叠。

4、动画节奏控制：

使用delay(300)设置每次循环间隔为0.3秒，确保动画效果平滑。

5、效果描述

屏幕中心将动态显示“OK”字符。

字符的字号从最小值（1）逐渐增大到最大值（5），再从最大值逐渐减小回最小值，循环往复。

“OK”字符始终保持居中，并具有动态变化的视觉效果。

实验场景图  动态图