236浏览
查看: 236|回复: 0

[ESP8266/ESP32] FireBeetle 2 Board ESP32 C6之初体验(1)Arduino点亮TFT屏

[复制链接]
本帖最后由 豆爸 于 2024-4-22 03:33 编辑

关于ESP32-C6

ESP32-C6 是一款支持 2.4 GHz Wi-Fi 6、Bluetooth 5、Zigbee 3.0 及 Thread 1.3 系统级芯片 (SoC),集成了一个高性能 RISC-V 32 位处理器和一个低功耗 RISC-V 32 位处理器、Wi-Fi、Bluetooth LE、802.15.4 基带和 MAC、RF 模块及外设等。Wi-Fi、蓝牙及 802.15.4 共存,共用同一个天线。

FireBeetle 2 Board ESP32 C6之初体验(1)Arduino点亮TFT屏图2


FireBeetle 2 ESP32-C6是DFRobot公司的一款基于ESP32-C6芯片设计的低功耗物联网主控板,支持Wi-Fi 6、Bluetooth 5、Zigbee 3.0、Thread 1.3通讯协议,可接入多种通讯协议的物联网网络,支持Type-C、5V DC、太阳能供电。处理器:RISC-V单核处理器;主频:160 MHz;SRAM:512KB;ROM:320KB;Flash:4MB;RTC SRAM:16KB;USB: USB CDC。


引脚定义

FireBeetle 2 Board ESP32 C6之初体验(1)Arduino点亮TFT屏图1

FireBeetle 2 ESP32-C6的引脚定义,如上图所示。


升级Arduino板卡

FireBeetle 2 Board ESP32 C6之初体验(1)Arduino点亮TFT屏图3


如上图所示,设置开发板管理器地址为:https://espressif.github.io/ardu ... sp32_dev_index.json

FireBeetle 2 Board ESP32 C6之初体验(1)Arduino点亮TFT屏图4


如上图所示,在开发板管理器里选择 esp32 by Espressif Systems “3.0.0-rc1”,安装。

点灯测试

  1. int led = 15;
  2. void setup() {
  3.   pinMode(led,OUTPUT);
  4. }
  5. void loop() {
  6.   digitalWrite(led,HIGH);
  7.   delay(1000);
  8.   digitalWrite(led,LOW);
  9.   delay(1000);
  10. }
复制代码


编写如上图所示程序

FireBeetle 2 Board ESP32 C6之初体验(1)Arduino点亮TFT屏图5


如上图所示,选择开发板DFRobot FireBeetle 2 ESP32-C6,端口号,上传程序。

FireBeetle 2 Board ESP32 C6之初体验(1)Arduino点亮TFT屏图6


如上图所示,程序上传完成,开发板自动重启。可以看到板载LED灯交替点亮、熄灭。
至此,说明Arduino下的配置及开发板的连接均正常,可以进行进一步开发与学习。

点亮ST7789 TFT屏幕

方案一:使用DFRobot的GDL驱动库。
FireBeetle 2 Board ESP32 C6之初体验(1)Arduino点亮TFT屏图7


如上图所示,安装DFRobot_GDL库。


连接TFT屏与ESP32-C6


TFT屏              ESP32-C6


SCK                     23
MOSI                  22
MISO                  21
TFT_DC                8
TFT_RST              14
TFT_CS               15
TFT_BL                1
编写如下图所示程序,并上传。


  1. /*!
  2. * @file basicTest.ino
  3. * @brief Demonstrate various graphic painting effects
  4. * @n This demo supports Arduino Uno, Leonardo, Mega2560, FireBeetle-ESP32, FireBeetle-ESP8266, and FireBeetle-M0.
  5. * @copyright Copyright (c) 2010 DFRobot Co. Ltd (http://www.dfrobot.com)
  6. * @license The MIT License (MIT)
  7. * @author [tangjie] (jie.tang@dfrobot.com)
  8. * @version V1.0
  9. * @date 2022-05-16
  10. * @url https://github.com/DFRobot/DFRobot_GDL
  11. */
  12. #include "DFRobot_GDL.h"
  13. /*
  14. * FireBeetle 2 Board ESP32 C6
  15. * 屏幕ST7789
  16. * SCK 23
  17. * MOSI 22
  18. * MISO 21
  19. */
  20. #define TFT_DC  8
  21. #define TFT_RST 14
  22. #define TFT_CS  15
  23. #define TFT_BL 1
  24. /**
  25. * @brief Constructor  硬件SPI通信的构造函数
  26. * @param dc  SPI通信的命令/数据线引脚
  27. * @param cs  SPI通信的片选引脚
  28. * @param rst  屏的复位引脚
  29. */
  30. DFRobot_ST7789_240x320_HW_SPI screen(/*dc=*/TFT_DC,/*cs=*/TFT_CS,/*rst=*/TFT_RST,/*bl=*/TFT_BL);
  31. // DFRobot_ST7789_240x240_HW_SPI screen(/*dc=*/TFT_DC,/*rst=*/TFT_RST);
  32. /*
  33. *可供用户选择的宏定义颜色
  34. *COLOR_RGB565_BLACK   COLOR_RGB565_NAVY    COLOR_RGB565_DGREEN   COLOR_RGB565_DCYAN
  35. *COLOR_RGB565_MAROON  COLOR_RGB565_PURPLE  COLOR_RGB565_OLIVE    COLOR_RGB565_LGRAY     
  36. *COLOR_RGB565_DGRAY   COLOR_RGB565_BLUE    COLOR_RGB565_GREEN    COLOR_RGB565_CYAN  
  37. *COLOR_RGB565_RED     COLOR_RGB565_MAGENTA COLOR_RGB565_YELLOW   COLOR_RGB565_ORANGE           
  38. *COLOR_RGB565_WHITE   
  39. */
  40. void setup() {
  41.   Serial.begin(115200);
  42.   screen.begin();//生成了screen对象
  43. }
  44. void loop(){
  45.     testDrawPixel();
  46.     testLine();
  47.     testFastLines(COLOR_RGB565_PURPLE,COLOR_RGB565_YELLOW);      
  48.     testRects(COLOR_RGB565_BLACK,COLOR_RGB565_WHITE);
  49.     testRoundRects();
  50.     testCircles(24,COLOR_RGB565_BLUE);
  51.     testTriangles(COLOR_RGB565_YELLOW);
  52.     testPrint();
  53. }
  54. /*测试画像素点*/
  55. void testDrawPixel() {
  56.   /*
  57.    *@brief 清屏
  58.    *@param c 屏幕颜色
  59.    */
  60.   screen.fillScreen(COLOR_RGB565_BLACK);
  61.   int x = 0;
  62.   int y = screen.height();
  63.   for(int i = 0; i <= screen.width()/2; i += 10){
  64.     for (x = screen.width() - i; x >= i; x-=10 ){
  65.       /*
  66.        *@brief 画像素点
  67.        *@param x 横坐标
  68.        *       y 纵坐标
  69.        *       c 像素点颜色
  70.        */
  71.       screen.drawPixel(x, y, COLOR_RGB565_ORANGE);
  72.       delay(10);
  73.     }
  74.     for (y = screen.height() - i; y >= i; y-=10){
  75.       screen.drawPixel(x, y, COLOR_RGB565_ORANGE);
  76.       delay(10);
  77.     }
  78.     for (x = i; x <= screen.width() - i + 1; x+=10 ){
  79.       screen.drawPixel(x, y, COLOR_RGB565_ORANGE);
  80.       delay(10);
  81.     }
  82.     for (y = i; y <= screen.height() - i + 1; y+=10){
  83.       screen.drawPixel(x, y, COLOR_RGB565_ORANGE);
  84.       delay(10);
  85.     }
  86.   }
  87. }
  88. /*测试画线*/
  89. void testLine(){
  90.      //0x00FF 是格式为RGB565的颜色数据
  91.   uint16_t color = 0x00FF;
  92.   screen.fillScreen(COLOR_RGB565_BLACK);
  93.   for (int16_t x=0; x < screen.width(); x+=6) {
  94.     /*
  95.      *@brief 画线段
  96.      *@param x0 第一个顶点横坐标
  97.      *       y0 第一个顶点纵坐标
  98.      *       x1 第二个顶点横坐标
  99.      *       y1 第二个顶点纵坐标
  100.      *       c 线段颜色
  101.      */
  102.     screen.drawLine(/*x0=*/screen.width()/*屏幕宽度*//2, /*y0=*/screen.height()/*屏幕高度*//2, /*x1=*/x, /*y1=*/0, /*c=*/color+=0x0700);
  103.   }
  104.   for (int16_t y=0; y < screen.height(); y+=6) {
  105.     screen.drawLine(screen.width()/2, screen.height()/2, screen.width(), y, color+=0x0700);
  106.   }
  107.   for (int16_t x = screen.width(); x >= 0; x-=6) {
  108.     screen.drawLine(screen.width()/2, screen.height()/2, x,screen.height(), color+=0x0700);
  109.   }
  110.   for (int16_t y = screen.height(); y >= 0; y-=6) {
  111.     screen.drawLine(screen.width()/2, screen.height()/2, 0, y, color+=0x0700);
  112.   }
  113. }
  114. /*测试快速画线(需设置延时),只有横线和纵线*/
  115. void testFastLines(uint16_t color1, uint16_t color2) {
  116.   for (int16_t y=0; y < screen.height(); y+=4) {
  117.     /*
  118.      *@brief 画线段
  119.      *@param x 第一个顶点横坐标
  120.      *       y 第一个顶点纵坐标
  121.      *       w 线段的长度
  122.      *       c 线段颜色
  123.      */
  124.     screen.drawFastHLine(/*x=*/0, /*y=*/y, /*w=*/screen.width(),/*c=*/color2);
  125.     delay(10);
  126.   }
  127.   for(int16_t x=0; x < screen.width(); x+=3) {
  128.     /*
  129.      *@brief 画线段
  130.      *@param x 第一个顶点横坐标
  131.      *       y 第一个顶点纵坐标
  132.      *       h 线段的长度
  133.      *       c 线段颜色
  134.      */
  135.     screen.drawFastVLine(/*x=*/x, /*y=*/0, /*h=*/screen.height(), /*c=*/color1);
  136.     delay(10);
  137.   }
  138. }
  139. /*测试画矩形*/
  140. void testRects(uint16_t color1, uint16_t color2) {
  141.     screen.fillScreen(COLOR_RGB565_BLACK);
  142.     int16_t x=screen.width()-12;
  143.     for (; x > 100; x-=screen.width()/40) {
  144.       /*
  145.        *@brief 画空心矩形
  146.        *@param x 顶点横坐标
  147.        *@param y 顶点纵坐标
  148.        *@param w 横向边长
  149.        *@param h 纵向边长
  150.        *@param color 填充颜色,565结构的RGB色
  151.        */
  152.       screen.drawRect(/*x=*/screen.width()/2 -x/2, /*y=*/screen.height()/2 -x/2 , /*w=*/x, /*h=*/x, /*color=*/color2+=0x0F00);
  153.       delay(100);
  154.     }
  155.     /*
  156.      *@brief 画填充矩形
  157.      *@param x 顶点横坐标
  158.      *@param y 顶点纵坐标
  159.      *@param w 横向边长
  160.      *@param h 纵向边长
  161.      *@param color 填充颜色,565结构的RGB色
  162.     */
  163.     screen.fillRect(/*x=*/screen.width()/2 -x/2, /*y=*/screen.height()/2 -x/2 , /*w=*/x, /*h=*/x, /*color=*/color2);
  164.     delay(100);
  165.     for(; x > 6; x-=screen.width()/40){
  166.       screen.drawRect(screen.width()/2 -x/2, screen.height()/2 -x/2 , x, x, color1);
  167.       delay(100);
  168.     }
  169. }
  170. /*测试画圆角矩形*/
  171. void testRoundRects() {
  172.   screen.fillScreen(COLOR_RGB565_BLACK);
  173.    //0xF00F 是格式为RGB565的颜色数据
  174.   int color = 0xF00F;
  175.   int i;
  176.   int x = 0;
  177.   int y = 0;
  178.   int w = screen.width()-3;
  179.   int h = screen.height()-3;
  180.   for(i = 0 ; i <= 16; i+=2) {
  181.     /*
  182.      *@brief 画空心圆角矩形
  183.      *@param x0 起始顶点横坐标
  184.      *@param y0 起始顶点纵坐标
  185.      *@param w 横向边长
  186.      *@param h 纵向边长
  187.      *@param radius 圆角半径
  188.      *@param color 边框颜色,565结构的RGB色
  189.      */
  190.     screen.drawRoundRect(/*x0=*/x, /*y0=*/y, /*w=*/w, /*h=*/h, /*radius=*/20, /*color=*/color);
  191.     x+=5;
  192.     y+=5;
  193.     w-=10;
  194.     h-=10;
  195.     color+=0x0100;
  196.     delay(50);
  197.   }
  198.   for(i = 0 ; i <= 16; i+=2) {
  199.     /*
  200.      *@brief 画填充圆角矩形
  201.      *@param x0 起始顶点横坐标
  202.      *@param y0 起始顶点纵坐标
  203.      *@param w 横向边长
  204.      *@param h 纵向边长
  205.      *@param radius 圆角半径
  206.      *@param color 填充颜色,565结构的RGB色
  207.      */
  208.     screen.fillRoundRect(/*x0=*/x, /*y0=*/y, /*w=*/w, /*h=*/h, /*radius=*/10, /*color=*/color);
  209.     x+=5;
  210.     y+=5;
  211.     w-=10;
  212.     h-=10;
  213.     color+=0x0500;
  214.     delay(50);
  215.   }
  216. }
  217. /*测试画圆*/
  218. void testCircles(uint8_t radius, uint16_t color) {
  219.   screen.fillScreen(COLOR_RGB565_BLACK);
  220.   for (int16_t x=radius; x <=screen.width()-radius; x+=radius*2) {
  221.     for (int16_t y=radius; y <=screen.height()-radius; y+=radius*2) {
  222.       /*
  223.        *@brief 画空心圆
  224.        *@param x0 圆心横坐标
  225.        *@param y0 圆心纵坐标
  226.        *@param r 半径
  227.        *@param color 圆周颜色,565结构的RGB色
  228.        */
  229.       screen.drawCircle(/*x0=*/x, /*y0=*/y, /*r=*/radius, /*color=*/color);
  230.         if(x == y ||x == -y ||x == y + 2*radius)
  231.           /*
  232.            *@brief 画填充圆
  233.            *@param x0 圆心横坐标
  234.            *@param y0 圆心纵坐标
  235.            *@param r 半径
  236.            *@param color 填充颜色,565结构的RGB色
  237.            */
  238.           screen.fillCircle(/*x0=*/x, /*y0=*/y, /*r=*/radius, /*color=*/color);
  239.        color += 800;
  240.        delay(100);
  241.     }
  242.   }
  243. }
  244. /*测试画三角形*/
  245. void testTriangles(uint16_t color){
  246.   screen.fillScreen(COLOR_RGB565_BLACK);
  247.   for (int16_t i=0; i <=screen.width(); i+=24)
  248.     /*
  249.      *@brief 画空心三角形
  250.      *@param x0 起始顶点横坐标
  251.      *@param y0 起始顶点纵坐标
  252.      *@param x1 第二个顶点横坐标
  253.      *@param y1 第二个顶点纵坐标
  254.      *@param x2 第三个顶点横坐标
  255.      *@param y2 第三个顶点纵坐标
  256.      *@param color 边框颜色,565结构的RGB色
  257.      */
  258.     screen.drawTriangle(/*x0=*/i,/*y0=*/0,/*x1=*/0,/*y1=*/screen.height()-i,/*x2=*/screen.width()-i,/*y2=*/screen.height(), /*color=*/color);
  259.   for (int16_t i=0; i <screen.width(); i+=24)
  260.     screen.drawTriangle(screen.width(),i*4/3,0,screen.height()-i*4/3,i,0, color);
  261.   for (int16_t i=0; i <screen.width(); i+=24)
  262.     screen.drawTriangle(screen.width(),i*4/3,i,0,screen.width()-i,screen.height(), color);
  263.   color = COLOR_RGB565_RED;
  264.   for (int16_t i=0; i <=screen.width(); i+=24)
  265.     /*
  266.      *@brief 画填充三角形
  267.      *@param x0 起始顶点横坐标
  268.      *@param y0 起始顶点纵坐标
  269.      *@param x1 第二个顶点横坐标
  270.      *@param y1 第二个顶点纵坐标
  271.      *@param x2 第三个顶点横坐标
  272.      *@param y2 第三个顶点纵坐标
  273.      *@param color 填充颜色,565结构的RGB色
  274.      */
  275.     screen.fillTriangle(/*x0=*/i,/*y0=*/0,/*x1=*/0,/*y1=*/screen.height()-i,/*x2=*/screen.width()-i,/*y2=*/screen.height(), /*color=*/color+=100);
  276.   for (int16_t i=0; i <screen.width(); i+=24)
  277.     screen.fillTriangle(screen.width(),i*4/3,0,screen.height()-i*4/3,i,0, color+=100);
  278.   for (int16_t i=0; i <screen.width(); i+=24)
  279.     screen.fillTriangle(screen.width(),i*4/3,i,0,screen.width()-i,screen.height(), color+=100);
  280. }
  281. void testPrint() {
  282. //0x00FF 是格式为RGB565的颜色数据
  283.   int16_t color = 0x00FF;
  284.   //设置文本自动换行模式
  285.   //true=文本自动换行,false=不自动换行
  286.   screen.setTextWrap(false);
  287.   //填充颜色,565结构的RGB色
  288.   screen.fillScreen(COLOR_RGB565_BLACK);
  289.   //设置坐标位置x=0,y=50
  290.   screen.setCursor(0, 50);
  291.   //设置文本颜色;这是变化的值
  292.   screen.setTextColor(color+=0x3000);
  293.   //设置文本大小为0
  294.   screen.setTextSize(0);
  295.   //输出文本
  296.   screen.println("Hello World!");
  297.   screen.setTextColor(color+=0x3000);
  298.   //设置文本大小为1
  299.   screen.setTextSize(1);
  300.   screen.println("Hello World!");
  301.   screen.setTextColor(color+=0x3000);
  302.   //设置文本大小为2
  303.   screen.setTextSize(2);
  304.   screen.println("Hello World!");
  305.   screen.setTextColor(color+=0x3000);
  306.   //设置文本大小为3
  307.   screen.setTextSize(3);
  308.   screen.println("Hello World!");
  309.   screen.setTextColor(color+=0x3000);
  310.   //设置文本大小为4
  311.   screen.setTextSize(4);
  312.   screen.println("Hello!");
  313.   //设置文本大小为5
  314.   screen.setTextSize(5);
  315.   screen.print("Hello!");
  316.   delay(2000);
  317.   //设置坐标位置x=0,y=0
  318.   screen.setCursor(0, 0);
  319.   //填充颜色,565结构的RGB色
  320.   screen.fillScreen(COLOR_RGB565_BLACK);
  321.   screen.setTextSize(2);
  322.   screen.setTextColor(color+=0x3000);
  323.   screen.print("a = ");
  324.   screen.setTextColor(color+=0x3000);
  325.   int a = 1234;
  326.   screen.println(a, 1);
  327.   screen.setTextColor(color+=0x3000);
  328.   screen.print(8675309, HEX);
  329.   screen.println("this is HEX!");
  330.   screen.println("");
  331.   screen.setTextColor(color+=0x0F00);
  332.   screen.println("running for: ");
  333.   screen.setTextColor(color+=0x0F00);
  334.   //输出毫秒时间
  335.   screen.print(millis());
  336.   screen.setTextColor(color+=0x0F00);
  337.   screen.println("/1000 seconds.");
  338.   char *text = "Hi DFRobot!";
  339.   screen.setTextColor(color+=0x0F00);
  340.   screen.setTextWrap(true);
  341.   screen.setTextSize(3);
  342.   screen.println(text);
  343.   //screen.setFonts((const gdl_Font_t *)SIMKAIFont18ptBitmaps);
  344.   screen.println(text);
  345.   delay(2000);
  346. }
复制代码




程序代码






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

本版积分规则

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

硬件清单

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

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

mail