【花雕学编程】Arduino动手做（249）--GC9A01动态矩形环动画

  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目之一百零一：GC9A01园屏之不断变化颜色和尺寸的动态矩形环动画

实验开源代码

/*
  【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
  实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目之一百零一：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      

Adafruit_GC9A01A tft = Adafruit_GC9A01A(TFT_CS, TFT_DC, TFT_RST);

#define SCREEN_WIDTH 240
#define SCREEN_HEIGHT 240
#define NUM_RINGS 8  // **矩形环的数量**
#define MAX_SIZE 100  // **矩形环最大尺寸**
#define MIN_SIZE 30  // **矩形环最小尺寸**
#define COLOR_VARIATION 5  // **颜色变化速度**
uint16_t colors[] = {GC9A01A_RED, GC9A01A_GREEN, GC9A01A_BLUE, GC9A01A_YELLOW, GC9A01A_MAGENTA, GC9A01A_CYAN, GC9A01A_WHITE};
int numColors = sizeof(colors) / sizeof(colors[0]);

void setup() {
    Serial.begin(115200);
    tft.begin();
    tft.setRotation(2);
}

void loop() {
    tft.fillScreen(GC9A01A_BLACK);

    for (int i = 0; i < NUM_RINGS; i++) {
        int x = random(20, SCREEN_WIDTH - 20);
        int y = random(20, SCREEN_HEIGHT - 20);
        int outerSize = random(MIN_SIZE, MAX_SIZE);
        int innerSize = random(outerSize / 2, outerSize - 1);
        uint16_t color = colors[random(0, numColors)];

        // **绘制外层矩形**
        tft.fillRect(x, y, outerSize, outerSize, color);

        // **绘制内层矩形（形成矩形环效果）**
        tft.fillRect(x + outerSize / 4, y + outerSize / 4, innerSize / 2, innerSize / 2, GC9A01A_BLACK);
    }

    delay(200);
}
复制代码

这段代码的核心功能是 动态矩形环动画，它使用不同大小的矩形形成环状结构，并且 不断变化颜色和尺寸，让整个屏幕充满动态视觉效果。

代码结构

1️⃣ 初始化屏幕

• 使用 Adafruit_GC9A01A 控制 TFT 显示屏，设定黑色背景。
  

2️⃣ 随机矩形环

• random(MIN_SIZE, MAX_SIZE) 让矩形环的 尺寸变化不固定。
• tft.fillRect() 用随机颜色填充矩形，形成 外层矩形环。
• tft.fillRect() 在矩形中心 绘制黑色小矩形，形成环状结构。
  

3️⃣ 持续循环

• delay(200); 控制动画刷新速率，使视觉流畅。
• 每次循环生成 不同位置、颜色、大小 的矩形环，使画面不断变化。
  

最终效果

屏幕显示多个动态矩形环，模拟几何动效
颜色不断变化，增强视觉层次
流畅动画，让矩形环动态旋转扩展

实验场景图  动态图