设为首页收藏本站
首页 > 论坛 > Arduino

[项目]【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32

驴友花雕 | 中级技神 | 创造力： | 帖子： | 发消息 | 串个门 | 加好友 | 打招呼
2025-7-24 07:58:35 [显示全部楼层]
36浏览
4回复
0收藏
查看: 36|回复: 4

[项目] 【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32

[复制链接]
今天我收到了几周前订购的两块ILI9341 TFT 屏幕。这些屏幕实际上是为 Arduino Uno 设计的扩展板，但它们在连接到其他开发板时工作得很好，而且价格非常便宜：只需 4 美元。

在这种情况下，我们将屏幕连接到 ESP32 开发板。
引脚的配置方式与您在网络上可以找到的其他示例略有不同：我试图尽量减少错误，因为我们将使用 13 个引脚，所以我认为最好的方法是使用尽可能多的连续引脚。

您也可以仅使用 4 个 IO 引脚（不是此型号）连接ILI9341，但刷新/绘画速度无法比拟。
我们将使用的库是 Bodmer TFT_eSPI库，目前我们唯一的目的是成功执行示例演示脚本。
在测试过程中，您可以将 TFT 3V3 引脚直接连接到 ESP32 3V3 引脚，但只能在短时间内进行，因为屏幕 LED 消耗的电流为 134mA，您会注意到 LED 和开发板电压限制器将如何变热。
两个 22V22 引脚之间有一个 3Ω 电阻（不是 3），足以将电流降低到 23mA，虽然屏幕不是世界上最亮的屏幕，但我认为它足以用于测试目的。
按照上图所述完成引脚连接后，如果您尚未安装TFT_eSPI库，则可以安装它。
打开 Arduino IDE，转到库管理器，然后在搜索框中键入 TFT_eSPI。在结果列表中，查找下一个并安装它。
TFT_eSPI Bodmer Arduino 库
现在您已经安装了库，您必须配置我们连接屏幕的 IO 引脚。其他库使用每个草图顶部的常量定义来执行此作，但TFT_eSPI使用通用文件来定义配置。
在您的 Arduino 安装中找到名为 User_Setup.h 的文件
它应该位于与以下路径相当的路径中：
.  [Arduino 文件夹]/libraries/TFT_eSPI/User_Setup。h

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图1

回复

使用道具 举报

精彩评论(4)

驴友花雕  中级技神
 楼主|

发表于 昨天 08:00

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32

保存文件并返回 Arduino IDE。
打开示例草图UTFT_demo（位于文件/示例/TFT_eSPI/320 x 240/UTFT_demo下）
此时，您可以编译草图并将其上传到您的 ESP32。如果一切正常，您应该会看到一些图形、背景和文本出现在您的 TFT 屏幕上。否则请仔细查看 IO 引脚配置（硬和软）。
如果它有效，您可能会像在镜子中一样看到结果。要解决此问题，请转到草图并编辑设置屏幕方向的线。这是在设置功能中完成的。

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图1

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图2

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图3


【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图4

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图5

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图6

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图7

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图8

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图9

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图10

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图11


回复

使用道具 举报

驴友花雕  中级技神
 楼主|

发表于 昨天 08:01

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32

项目代码

  1. // Demo based on:

  2. // UTFT_Demo_320x240 by Henning Karlsen

  3. // web: http://www.henningkarlsen.com/electronics

  4. //

  5. /*

  6. 

  7.  This sketch uses the GLCD and font 2 only.

  8.  

  9.  Make sure all the display driver and pin connections are correct by

  10.  editing the User_Setup.h file in the TFT_eSPI library folder.

  11. 

  12.  #########################################################################

  13.  ###### DON'T FORGET TO UPDATE THE User_Setup.h FILE IN THE LIBRARY ######

  14.  #########################################################################

  15.  */

  16. 

  17. #include "SPI.h"

  18. 

  19. #include "TFT_eSPI.h"

  20. 

  21. #define TFT_GREY 0x7BEF

  22. 

  23. TFT_eSPI myGLCD = TFT_eSPI();       // Invoke custom library

  24. 

  25. unsigned long runTime = 0;

  26. void setup()

  27. {

  28.   randomSeed(analogRead(A0));

  29. // Setup the LCD

  30.   myGLCD.init();

  31.   myGLCD.setRotation(1);

  32. }

  33. 

  34. void loop()

  35. {

  36.   randomSeed(millis());

  37.   //randomSeed(1234); // This ensure test is repeatable with exact same draws each loop

  38.   int buf[318];

  39.   int x, x2;

  40.   int y, y2;

  41.   int r;

  42.   runTime = millis();

  43. // Clear the screen and draw the frame

  44.   myGLCD.fillScreen(TFT_BLACK);

  45. 

  46. 

  47.   myGLCD.fillRect(0, 0, 319, 14,TFT_RED);

  48. 

  49.   myGLCD.fillRect(0, 226, 319, 14,TFT_GREY);

  50. 

  51.   myGLCD.setTextColor(TFT_BLACK,TFT_RED);

  52.   myGLCD.drawCentreString("* TFT_eSPI *", 160, 4, 1);

  53.   myGLCD.setTextColor(TFT_YELLOW,TFT_GREY);

  54.   myGLCD.drawCentreString("Adapted by Bodmer", 160, 228,1);

  55. 

  56.   myGLCD.drawRect(0, 14, 319, 211, TFT_BLUE);

  57. 

  58. // Draw crosshairs

  59.   myGLCD.drawLine(159, 15, 159, 224,TFT_BLUE);

  60.   myGLCD.drawLine(1, 119, 318, 119,TFT_BLUE);

  61.   for (int i=9; i<310; i+=10)

  62.     myGLCD.drawLine(i, 117, i, 121,TFT_BLUE);

  63.   for (int i=19; i<220; i+=10)

  64.     myGLCD.drawLine(157, i, 161, i,TFT_BLUE);

  65. 

  66. // Draw sin-, cos- and tan-lines  

  67.   myGLCD.setTextColor(TFT_CYAN);

  68.   myGLCD.drawString("Sin", 5, 15,2);

  69.   for (int i=1; i<318; i++)

  70.   {

  71.     myGLCD.drawPixel(i,119+(sin(((i*1.13)*3.14)/180)*95),TFT_CYAN);

  72.   }

  73.   myGLCD.setTextColor(TFT_RED);

  74.   myGLCD.drawString("Cos", 5, 30,2);

  75.   for (int i=1; i<318; i++)

  76.   {

  77.     myGLCD.drawPixel(i,119+(cos(((i*1.13)*3.14)/180)*95),TFT_RED);

  78.   }

  79.   myGLCD.setTextColor(TFT_YELLOW);

  80.   myGLCD.drawString("Tan", 5, 45,2);

  81.   for (int i=1; i<318; i++)

  82.   {

  83.     myGLCD.drawPixel(i,119+(tan(((i*1.13)*3.14)/180)),TFT_YELLOW);

  84.   }

  85. 

  86.   delay(0);

  87. 

  88.   myGLCD.fillRect(1,15,317,209,TFT_BLACK);

  89. 

  90.   myGLCD.drawLine(159, 15, 159, 224,TFT_BLUE);

  91.   myGLCD.drawLine(1, 119, 318, 119,TFT_BLUE);

  92. int col = 0;

  93. // Draw a moving sinewave

  94.   x=1;

  95.   for (int i=1; i<(317*20); i++) 

  96.   {

  97.     x++;

  98.     if (x==318)

  99.       x=1;

  100.     if (i>318)

  101.     {

  102.       if ((x==159)||(buf[x-1]==119))

  103.         col = TFT_BLUE;

  104.       else

  105.       myGLCD.drawPixel(x,buf[x-1],TFT_BLACK);

  106.     }

  107.     y=119+(sin(((i*1.1)*3.14)/180)*(90-(i / 100)));

  108.     myGLCD.drawPixel(x,y,TFT_BLUE);

  109.     buf[x-1]=y;

  110.   }

  111. 

  112.   delay(0);

  113. 

  114.   myGLCD.fillRect(1,15,317,209,TFT_BLACK);

  115. 

  116. // Draw some filled rectangles

  117.   for (int i=1; i<6; i++)

  118.   {

  119.     switch (i)

  120.     {

  121.       case 1:

  122.         col = TFT_MAGENTA;

  123.         break;

  124.       case 2:

  125.         col = TFT_RED;

  126.         break;

  127.       case 3:

  128.         col = TFT_GREEN;

  129.         break;

  130.       case 4:

  131.         col = TFT_BLUE;

  132.         break;

  133.       case 5:

  134.         col = TFT_YELLOW;

  135.         break;

  136.     }

  137.     myGLCD.fillRect(70+(i*20), 30+(i*20), 60, 60,col);

  138.   }

  139. 

  140.   delay(0);

  141. 

  142.   myGLCD.fillRect(1,15,317,209,TFT_BLACK);

  143. 

  144. // Draw some filled, rounded rectangles

  145.   for (int i=1; i<6; i++)

  146.   {

  147.     switch (i)

  148.     {

  149.       case 1:

  150.         col = TFT_MAGENTA;

  151.         break;

  152.       case 2:

  153.         col = TFT_RED;

  154.         break;

  155.       case 3:

  156.         col = TFT_GREEN;

  157.         break;

  158.       case 4:

  159.         col = TFT_BLUE;

  160.         break;

  161.       case 5:

  162.         col = TFT_YELLOW;

  163.         break;

  164.     }

  165.     myGLCD.fillRoundRect(190-(i*20), 30+(i*20), 60,60, 3,col);

  166.   }

  167.   

  168.   delay(0);

  169. 

  170.   myGLCD.fillRect(1,15,317,209,TFT_BLACK);

  171. 

  172. // Draw some filled circles

  173.   for (int i=1; i<6; i++)

  174.   {

  175.     switch (i)

  176.     {

  177.       case 1:

  178.         col = TFT_MAGENTA;

  179.         break;

  180.       case 2:

  181.         col = TFT_RED;

  182.         break;

  183.       case 3:

  184.         col = TFT_GREEN;

  185.         break;

  186.       case 4:

  187.         col = TFT_BLUE;

  188.         break;

  189.       case 5:

  190.         col = TFT_YELLOW;

  191.         break;

  192.     }

  193.     myGLCD.fillCircle(100+(i*20),60+(i*20), 30,col);

  194.   }

  195.   

  196.   delay(0);

  197. 

  198.   myGLCD.fillRect(1,15,317,209,TFT_BLACK);

  199. 

  200. // Draw some lines in a pattern

  201. 

  202.   for (int i=15; i<224; i+=5)

  203.   {

  204.     myGLCD.drawLine(1, i, (i*1.44)-10, 223,TFT_RED);

  205.   }

  206. 

  207.   for (int i=223; i>15; i-=5)

  208.   {

  209.     myGLCD.drawLine(317, i, (i*1.44)-11, 15,TFT_RED);

  210.   }

  211. 

  212.   for (int i=223; i>15; i-=5)

  213.   {

  214.     myGLCD.drawLine(1, i, 331-(i*1.44), 15,TFT_CYAN);

  215.   }

  216. 

  217.   for (int i=15; i<224; i+=5)

  218.   {

  219.     myGLCD.drawLine(317, i, 330-(i*1.44), 223,TFT_CYAN);

  220.   }

  221.   

  222.   delay(0);

  223. 

  224. 

  225.   myGLCD.fillRect(1,15,317,209,TFT_BLACK);

  226. 

  227. // Draw some random circles

  228.   for (int i=0; i<100; i++)

  229.   {

  230.     x=32+random(256);

  231.     y=45+random(146);

  232.     r=random(30);

  233.     myGLCD.drawCircle(x, y, r,random(0xFFFF));

  234.   }

  235. 

  236.   delay(0);

  237. 

  238.   myGLCD.fillRect(1,15,317,209,TFT_BLACK);

  239. 

  240. // Draw some random rectangles

  241.   for (int i=0; i<100; i++)

  242.   {

  243.     x=2+random(316);

  244.     y=16+random(207);

  245.     x2=2+random(316);

  246.     y2=16+random(207);

  247.     if (x2<x) {

  248.       r=x;x=x2;x2=r;

  249.     }

  250.     if (y2<y) {

  251.       r=y;y=y2;y2=r;

  252.     }

  253.     myGLCD.drawRect(x, y, x2-x, y2-y,random(0xFFFF));

  254.   }

  255. 

  256.   delay(0);

  257. 

  258. 

  259.   myGLCD.fillRect(1,15,317,209,TFT_BLACK);

  260. 

  261. // Draw some random rounded rectangles

  262.   for (int i=0; i<100; i++)

  263.   {

  264.     x=2+random(316);

  265.     y=16+random(207);

  266.     x2=2+random(316);

  267.     y2=16+random(207);

  268.     // We need to get the width and height and do some window checking

  269.     if (x2<x) {

  270.       r=x;x=x2;x2=r;

  271.     }

  272.     if (y2<y) {

  273.       r=y;y=y2;y2=r;

  274.     }

  275.     // We need a minimum size of 6

  276.     if((x2-x)<6) x2=x+6;

  277.     if((y2-y)<6) y2=y+6;

  278.     myGLCD.drawRoundRect(x, y, x2-x,y2-y, 3,random(0xFFFF));

  279.   }

  280. 

  281.   delay(0);

  282. 

  283.   myGLCD.fillRect(1,15,317,209,TFT_BLACK);

  284. 

  285.  //randomSeed(1234);

  286.  int colour = 0;

  287.  for (int i=0; i<100; i++)

  288.   {

  289.     x=2+random(316);

  290.     y=16+random(209);

  291.     x2=2+random(316);

  292.     y2=16+random(209);

  293.     colour=random(0xFFFF);

  294.     myGLCD.drawLine(x, y, x2, y2,colour);

  295.   }

  296. 

  297.   delay(0);

  298. 

  299.   myGLCD.fillRect(1,15,317,209,TFT_BLACK);

  300. 

  301.   // This test has been modified as it takes more time to calculate the random numbers

  302.   // than to draw the pixels (3 seconds to produce 30,000 randoms)!

  303.   for (int i=0; i<10000; i++)

  304.   {

  305.     myGLCD.drawPixel(2+random(316), 16+random(209),random(0xFFFF));

  306.   }

  307. 

  308.   // Draw 10,000 pixels to fill a 100x100 pixel box

  309.   // use the coords as the colour to produce the banding

  310.   //byte i = 100;

  311.   //while (i--) {

  312.   //  byte j = 100;

  313.   //  while (j--) myGLCD.drawPixel(i+110,j+70,i+j);

  314.   //  //while (j--) myGLCD.drawPixel(i+110,j+70,0xFFFF);

  315.   //}

  316.   delay(0);

  317. 

  318.   myGLCD.fillScreen(TFT_BLUE);

  319.   myGLCD.fillRoundRect(80, 70, 239-80,169-70, 3,TFT_RED);

  320.   

  321.   myGLCD.setTextColor(TFT_WHITE,TFT_RED);

  322.   myGLCD.drawCentreString("That's it!", 160, 93,2);

  323.   myGLCD.drawCentreString("Restarting in a", 160, 119,2);

  324.   myGLCD.drawCentreString("few seconds...", 160, 132,2);

  325. 

  326.   runTime = millis()-runTime;

  327.   myGLCD.setTextColor(TFT_GREEN,TFT_BLUE);

  328.   myGLCD.drawCentreString("Runtime: (msecs)", 160, 210,2);

  329.   myGLCD.setTextDatum(TC_DATUM);

  330.   myGLCD.drawNumber(runTime, 160, 225,2);

  331.   delay (5000);

  332. }

  333. 

复制代码


回复

使用道具 举报

驴友花雕  中级技神
 楼主|

发表于 昨天 08:06

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32

【Arduino 动手做】ILI9341屏使用TFT_eSPI库以并行模式（8 个数据引脚）连接到 ESP32
项目链接：https://www.pangodream.es/ili9341-esp32-parallel
项目作者：阿尔贝托·伊里贝里·安德烈斯

项目视频 ：https://www.youtube.com/watch?v=dhQjDKtNi58
项目代码：https://github.com/Bodmer/TFT_eS ... _demo/UTFT_demo.ino
Bodmer TFT_eSPI库：https://github.com/Bodmer/TFT_eSPI

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图1

回复

使用道具 举报

驴友花雕  中级技神
 楼主|

发表于 昨天 08:10

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图2

【Arduino 动手做】ILI9341屏使用TFT_eSPI库并行连接 ESP32图1
回复

使用道具 举报

高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

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

硬件清单

  • [[d.name]]
btnicon
我也要做!
点击进入购买页面
撰写新帖
关于楼主
勋章墙
萌萌哒新人 活跃会员 宣传大使 牛X认证 创作达人 ARD DAY 摸鱼团员 志“童”道合 编辑选择奖

楼主的其它帖子

background 创造力兑换 background 心愿单 background 创客导航
上海智位机器人股份有限公司 沪ICP备09038501号-4 备案 沪公网安备31011502402448

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

mail