106浏览
查看: 106|回复: 9

[项目] 【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒

[复制链接]
【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图1

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图2

驴友花雕  中级技神
 楼主|

发表于 2025-4-8 20:35:05

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图1
【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图2
回复

使用道具 举报

驴友花雕  中级技神
 楼主|

发表于 2025-4-8 20:36:46

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图2

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图1
回复

使用道具 举报

驴友花雕  中级技神
 楼主|

发表于 2025-4-8 20:38:05

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图2

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图1
回复

使用道具 举报

驴友花雕  中级技神
 楼主|

发表于 2025-4-8 20:39:19

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒


  【Arduino】189种传感器模块系列实验(资料代码+仿真编程+图形编程)
  实验二百四十九:1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  项目之四十一:GC9A01屏之非常炫目的万花筒效果

实验开源代码

  1. /*
  2.   【Arduino】189种传感器模块系列实验(资料代码+仿真编程+图形编程)
  3.   实验二百四十九:1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
  4.   项目之四十一:GC9A01屏之非常炫目的万花筒效果
  5. */
  6. //       GC9A01---------- ESP32
  7. //       RST ------------ NC(复位引脚,此处未连接)
  8. //       CS ------------- D4(片选引脚,连接到ESP32的D4引脚)
  9. //       DC ------------- D2(数据/命令选择引脚,连接到ESP32的D2引脚)
  10. //       SDA ------------ D23 (green)(主数据输出引脚,连接到ESP32的D23引脚,绿色线)
  11. //       SCL ------------ D18 (yellow)(时钟信号引脚,连接到ESP32的D18引脚,黄色线)
  12. //       GND ------------ GND(接地引脚,连接到ESP32的接地端)
  13. //       VCC -------------3V3(电源引脚,连接到ESP32的3.3V电源)
  14. #include "SPI.h"
  15. #include "Adafruit_GFX.h"
  16. #include "Adafruit_GC9A01A.h"
  17. // 定义屏幕引脚
  18. #define TFT_CS 4        // 片选引脚
  19. #define TFT_DC 2        // 数据/命令引脚
  20. #define TFT_RST -1      // 重置引脚(未使用时设置为 -1)
  21. // 初始化屏幕对象
  22. Adafruit_GC9A01A tft = Adafruit_GC9A01A(TFT_CS, TFT_DC, TFT_RST);
  23. // 定义屏幕中心
  24. #define CENTER_X (tft.width() / 2)
  25. #define CENTER_Y (tft.height() / 2)
  26. #define FRAME_DELAY 50    // 帧延迟
  27. #define NUM_SECTORS 6     // 扇区数量(万花筒对称数量)
  28. #define MAX_RADIUS 120    // 图案最大半径
  29. #define ROTATION_SPEED 2  // 每帧旋转的角度(度)
  30. // 定义颜色数组
  31. const uint16_t colors[] PROGMEM = {GC9A01A_RED, GC9A01A_GREEN, GC9A01A_BLUE, GC9A01A_YELLOW, GC9A01A_MAGENTA, GC9A01A_CYAN, GC9A01A_WHITE};
  32. const int numColors = sizeof(colors) / sizeof(colors[0]);
  33. // 绘制动态图案
  34. void drawPattern(int x, int y, uint16_t color) {
  35.     for (int radius = 5; radius <= MAX_RADIUS; radius += 10) {
  36.         int adjustedX = CENTER_X + (x - CENTER_X) * radius / MAX_RADIUS;
  37.         int adjustedY = CENTER_Y + (y - CENTER_Y) * radius / MAX_RADIUS;
  38.         tft.drawCircle(adjustedX, adjustedY, radius, color);
  39.     }
  40. }
  41. // 绘制万花筒扇区
  42. void drawKaleidoscopePattern(float rotationAngle) {
  43.     for (int sector = 0; sector < NUM_SECTORS; sector++) {
  44.         float angle = sector * (360.0 / NUM_SECTORS) + rotationAngle;
  45.         float radians = angle * 3.14159 / 180;
  46.         int x = CENTER_X + cos(radians) * MAX_RADIUS;
  47.         int y = CENTER_Y + sin(radians) * MAX_RADIUS;
  48.         uint16_t color = colors[random(0, numColors)];
  49.         drawPattern(x, y, color);
  50.     }
  51. }
  52. void setup() {
  53.     Serial.begin(115200);          // 初始化串口
  54.     Serial.println("Dynamic Kaleidoscope");
  55.     tft.begin();                   // 初始化屏幕
  56.     tft.setRotation(0);            // 设置屏幕方向
  57.     tft.fillScreen(GC9A01A_BLACK); // 设置黑色背景
  58. }
  59. void loop() {
  60.     static float rotationAngle = 0; // 初始化旋转角度
  61.     // 清屏
  62.     tft.fillScreen(GC9A01A_BLACK);
  63.     // 绘制动态万花筒图案
  64.     drawKaleidoscopePattern(rotationAngle);
  65.     // 更新旋转角度,制造动态效果
  66.     rotationAngle = fmod(rotationAngle + ROTATION_SPEED, 360.0);
  67.     delay(FRAME_DELAY); // 控制帧速率
  68. }
复制代码


回复

使用道具 举报

驴友花雕  中级技神
 楼主|

发表于 2025-4-8 20:41:04

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒

本帖最后由 驴友花雕 于 2025-4-8 20:51 编辑

代码解读

1. 对称结构
扇区数量 (NUM_SECTORS):屏幕被划分为多个扇区,每个扇区的内容通过旋转角度变化进行对称。

角度计算:

  1. float angle = sector * (360.0 / NUM_SECTORS) + rotationAngle;
  2. float radians = angle * 3.14159 / 180;
复制代码


每个扇区的中心通过其角度和旋转角度计算得出,确保图案动态变化。

2. 动态旋转
旋转逻辑:

  1. rotationAngle = fmod(rotationAngle + ROTATION_SPEED, 360.0);
复制代码


持续增加 rotationAngle 的值,制造图案动态旋转效果,使用 fmod 保证角度循环在 [0, 360] 范围内。

3. 图案绘制
drawPattern() 方法:

在每个扇区的中心位置绘制一组渐变圆形图案,形成复杂视觉效果。

圆的半径由循环控制,动态变化创造立体感。

4. 随机颜色
每帧为不同的扇区随机分配颜色,使图案更加丰富多彩。

5. 效果
复杂性:多个动态扇区组成对称的万花筒图案,每帧旋转。

动态性:图案持续更新,同时旋转并改变颜色。

视觉冲击力:鲜艳的颜色和不断变化的几何图案形成炫目效果。

回复

使用道具 举报

驴友花雕  中级技神
 楼主|

发表于 2025-4-8 20:47:51

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒

实验场景图  动态图

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图1

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图2
回复

使用道具 举报

驴友花雕  中级技神
 楼主|

发表于 2025-4-8 20:49:12

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图1

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图2
回复

使用道具 举报

驴友花雕  中级技神
 楼主|

发表于 2025-4-8 20:50:44

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒图1
回复

使用道具 举报

驴友花雕  中级技神
 楼主|

发表于 2025-4-9 10:23:14

【花雕学编程】Arduino动手做(249)--GC9A01屏的炫目万花筒

万花筒效果
  • 通过重复对称图案来模拟万花筒的视觉效果,随着时间旋转和变换。
  • 关键点:将画布划分为多个扇区,镜像每个扇区的内容。


  1. int x1 = CENTER_X + r * cos(theta);
  2. int y1 = CENTER_Y + r * sin(theta);
  3. tft.drawPixel(x1, y1, color);
  4. // 复制到其他对称位置
复制代码




回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

为本项目制作心愿单
购买心愿单
心愿单 编辑
[[wsData.name]]

硬件清单

  • [[d.name]]
btnicon
我也要做!
点击进入购买页面
上海智位机器人股份有限公司 沪ICP备09038501号-4 备案 沪公网安备31011502402448

© 2013-2025 Comsenz Inc. Powered by Discuz! X3.4 Licensed

mail