【花雕学编程】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 <SPI.h>
  #include <TFT_eSPI.h> // 引入 TFT_eSPI 库，用于驱动 TFT 显示屏

  #define TFT_GREY 0x5AEB // 定义灰色作为背景颜色

  TFT_eSPI tft = TFT_eSPI(); // 初始化 TFT 屏幕对象

  // 定义指针的坐标变量
  float sx = 0, sy = 1, mx = 1, my = 0, hx = -1, hy = 0;  // 用于存储时、分、秒针的旋转坐标
  float sdeg=0, mdeg=0, hdeg=0; // 用于存储时、分、秒针的角度
  uint16_t osx=120, osy=120, omx=120, omy=120, ohx=120, ohy=120;  // 旧坐标值，用于擦除指针
  uint16_t x0=0, x1=0, yy0=0, yy1=0; // 刻度线坐标
  uint32_t targetTime = 0;  // 定义时间变量，每秒更新一次

  // 获取编译时间（仅用于初始化时钟）
  static uint8_t conv2d(const char* p); // 预声明转换函数
  uint8_t hh = conv2d(__TIME__);        // 解析当前小时
  uint8_t mm = conv2d(__TIME__ + 3);    // 解析当前分钟
  uint8_t ss = conv2d(__TIME__ + 6);    // 解析当前秒数

  bool initial = true;  // 标记是否为初始化状态

  void setup(void) {
    tft.init();  // 初始化屏幕
    tft.setRotation(0);  // 设置屏幕旋转方向
    tft.fillScreen(TFT_GREY);  // 填充背景颜色

    tft.setTextColor(TFT_WHITE, TFT_GREY);  // 设置文字颜色，背景颜色自动清除旧文字

    // **绘制时钟表盘**
    tft.fillCircle(120, 120, 118, TFT_GREEN);  // 绘制外层绿色圆形
    tft.fillCircle(120, 120, 110, TFT_BLACK);  // 绘制内层黑色圆形（表盘主体）

    // **绘制 12 个刻度线**
    for (int i = 0; i < 360; i += 30) {
        sx = cos((i - 90) * 0.0174532925);  // 计算角度偏移
        sy = sin((i - 90) * 0.0174532925);
        x0 = sx * 114 + 120;  // 外端坐标
        yy0 = sy * 114 + 120;
        x1 = sx * 100 + 120;  // 内端坐标
        yy1 = sy * 100 + 120;
        tft.drawLine(x0, yy0, x1, yy1, TFT_GREEN);  // 绘制绿色刻度线
    }

    // **绘制 60 个分钟标记**
    for (int i = 0; i < 360; i += 6) {
        sx = cos((i - 90) * 0.0174532925);
        sy = sin((i - 90) * 0.0174532925);
        x0 = sx * 102 + 120;
        yy0 = sy * 102 + 120;
        tft.drawPixel(x0, yy0, TFT_WHITE);  // 绘制白色像素点

        // **绘制四个主刻度点**
        if (i == 0 || i == 180) tft.fillCircle(x0, yy0, 2, TFT_WHITE);
        if (i == 90 || i == 270) tft.fillCircle(x0, yy0, 2, TFT_WHITE);
    }

    // **绘制中心点**
    tft.fillCircle(120, 121, 3, TFT_WHITE);

    // **在屏幕底部绘制文字**
    tft.drawCentreString("Time flies", 120, 260, 4);  // 居中显示文字

    targetTime = millis() + 1000;  // 设置目标时间，每秒更新一次
  }

  void loop() {
    // **每秒更新时间**
    if (targetTime < millis()) {
        targetTime += 1000;
        ss++;  // 秒数递增
        if (ss == 60) {
            ss = 0;
            mm++;  // 分钟递增
            if (mm > 59) {
                mm = 0;
                hh++;  // 小时递增
                if (hh > 23) {
                    hh = 0;
                }
            }
        }

        // **计算指针角度**
        sdeg = ss * 6;  // 秒针：0-59 -> 0-354
        mdeg = mm * 6 + sdeg * 0.01666667;  // 分针：包含秒钟偏移
        hdeg = hh * 30 + mdeg * 0.0833333;  // 时针：包含分钟偏移
        hx = cos((hdeg - 90) * 0.0174532925);
        hy = sin((hdeg - 90) * 0.0174532925);
        mx = cos((mdeg - 90) * 0.0174532925);
        my = sin((mdeg - 90) * 0.0174532925);
        sx = cos((sdeg - 90) * 0.0174532925);
        sy = sin((sdeg - 90) * 0.0174532925);

        // **擦除旧指针**
        if (ss == 0 || initial) {
            initial = false;
            tft.drawLine(ohx, ohy, 120, 121, TFT_BLACK);
            ohx = hx * 62 + 121;
            ohy = hy * 62 + 121;
            tft.drawLine(omx, omy, 120, 121, TFT_BLACK);
            omx = mx * 84 + 120;
            omy = my * 84 + 121;
        }

        // **绘制新指针**
        tft.drawLine(osx, osy, 120, 121, TFT_BLACK);  // 擦除旧秒针
        osx = sx * 90 + 121;
        osy = sy * 90 + 121;
        tft.drawLine(osx, osy, 120, 121, TFT_RED);  // 绘制新秒针
        tft.drawLine(ohx, ohy, 120, 121, TFT_WHITE);  // 绘制时针
        tft.drawLine(omx, omy, 120, 121, TFT_WHITE);  // 绘制分针
        tft.drawLine(osx, osy, 120, 121, TFT_RED);  // 绘制秒针

        // **绘制中心点**
        tft.fillCircle(120, 121, 3, TFT_RED);
    }
  }

  // **字符串转换为数字**
  static uint8_t conv2d(const char* p) {
    uint8_t v = 0;
    if ('0' <= *p && *p <= '9')
        v = *p - '0';
    return 10 * v + *++p - '0';
  }
复制代码

这段代码绘制了一个模拟时钟，并且 实时更新指针位置 来显示当前时间。
代码结构

1️⃣ 初始化屏幕

• 使用 TFT_eSPI 驱动 GC9A01 显示屏，设定 灰色背景。
  
  

2️⃣ 绘制时钟表盘

• fillCircle() 绘制 绿色外圈 和 黑色表盘。
  
• drawLine() 画 12 个小时刻度，确保时钟准确性。
  
• drawPixel() 画 60 个小刻度，增强细节表现。
  
  

3️⃣ 计算指针角度

• 秒针：sdeg = ss * 6，秒数直接映射到角度。
  
• 分针：mdeg = mm * 6 + sdeg * 0.01666667，确保秒钟影响分针。
  
• 时针：hdeg = hh * 30 + mdeg * 0.0833333，包括分钟偏移。
  
  

4️⃣ 指针动态旋转

• 每秒更新 时针、分针、秒针，并擦除旧位置，确保流畅动画。
  
• 红色秒针动态变化，形成真实时钟效果。
  
  

5️⃣ 持续刷新

• millis() 计算时间，每 1 秒更新 指针位置，保持流畅动画。
  
  

最终效果
屏幕上显示模拟时钟，时针、分针、秒针动态更新
表盘美观，增强视觉体验
秒针移动流畅，使时间显示真实

实验场景图  动态图