前期準(zhǔn)備：
1.TFT_eSPI庫(kù)的安裝
首先在Libraries里面搜索安裝TFT_eSPI庫(kù)到你的工程文件里面。
2.TFT_eSPI庫(kù)的配置
文件配置
??該庫(kù)有User_Setup.h和 User_Setup_Select.h兩個(gè)配置文件，支持 ①自定義參數(shù)或 ②使用已有配置 驅(qū)動(dòng)TFT屏幕。
User_Setup.h — 由自己定義設(shè)備使用的引腳，若使用此文件配置，則User_Setup_Select.h文件內(nèi)容不要做修改，主要修改有以下幾處：
、
① 用戶設(shè)置文件User_Setup.h
② 設(shè)置屏幕分辨率
③ 設(shè)置屏幕引腳
這里的MOSI連接SDA。
常用API
一、初始化相關(guān)API
1.初始化
tft.init(); //初始化初始化屏幕, 如果是ST7735,可以往里面?zhèn)饕粋€(gè)參數(shù), 具體用到時(shí)再看。
2. 填充全屏幕
tft.fillScreen(uint32_t color); //填充全屏幕填充全屏幕, 后面是顏色值,
3. 屏幕旋轉(zhuǎn)
//反轉(zhuǎn)顯示顏色i = 1反轉(zhuǎn)，i = 0正常
tft.invertDisplay(bool i);二、文字相關(guān)API
1. 設(shè)置打字起始坐標(biāo)位置和字號(hào)
// 設(shè)置文本顯示坐標(biāo)，默認(rèn)以文本左上角為參考點(diǎn)，可以改變參考點(diǎn)
void setCursor(int16_t x, int16_t y);
// 設(shè)置文本顯示坐標(biāo)，和文本的字體
void setCursor(int16_t x, int16_t y, uint8_t font); 2. 設(shè)置字體顏色
// 設(shè)置文本顏色
void setTextColor(uint16_t color);
// 設(shè)置文本顏色與背景色
void setTextColor(uint16_t fgcolor, uint16_t bgcolor);
3. 設(shè)置字體大小
// 設(shè)置文本大小，文本大小范圍為 1~7 的整數(shù)
void setTextSize(uint8_t size);4. 顯示字體
tft.print("Hello World!");
tft.println("Hello World!");特別注意: 字庫(kù)7是仿7段數(shù)碼屏的樣式
三、繪制文字相關(guān)API
1. 繪制字符串(居左)
int16_t drawString(const String &string, int32_t x, int32_t y)
int16_t drawString(const char *string, int32_t x, int32_t y)
int16_t drawString(const String &string, int32_t x, int32_t y, uint8_t font)
int16_t drawString(const char *string, int32_t x, int32_t y, uint8_t font)2. 繪制字符串(居中)
int16_t drawCentreString(const char *string, int32_t x, int32_t y, uint8_t font)
int16_t drawCentreString(const String &string, int32_t x, int32_t y, uint8_t font)3. 繪制字符串(居右)
int16_t drawRightString(const char *string, int32_t x, int32_t y, uint8_t font)
int16_t drawRightString(const String &string, int32_t x, int32_t y, uint8_t font)4. 繪制字符
int16_t drawChar(uint16_t uniCode, int32_t x, int32_t y)
int16_t drawChar(uint16_t uniCode, int32_t x, int32_t y, uint8_t font)
void drawChar(int32_t x, int32_t y, uint16_t c, uint32_t color, uint32_t bg, uint8_t size)5. 繪制浮點(diǎn)數(shù)
int16_t TFT_eSPI::drawFloat(float floatNumber, uint8_t decimal, int32_t x, int32_t y)
int16_t TFT_eSPI::drawFloat(float floatNumber, uint8_t decimal, int32_t x, int32_t y, uint8_t font) tft.drawFloat(3.124, 4, 0,0,4);6. 繪制數(shù)字
int16_t drawNumber(long intNumber, int32_t x, int32_t y)
int16_t drawNumber(long intNumber, int32_t x, int32_t y, uint8_t font)四、 繪制幾何圖形
1. 畫(huà)點(diǎn)
void drawPixel(int32_t x, int32_t y, uint32_t color)2.畫(huà)線
void drawLine(int32_t xs, int32_t ys, int32_t xe, int32_t ye, uint32_t color)3.畫(huà)橫線(快速)
void drawFastHLine(int32_t x, int32_t y, int32_t w, uint32_t color)4.畫(huà)豎線(快速)
void drawFastVLine(int32_t x, int32_t y, int32_t h, uint32_t color)5. 畫(huà)空心圓
tft.drawCircle(100,100,50,TFT_RED);6. 畫(huà)實(shí)心圓
void fillCircle(int32_t x, int32_t y, int32_t r, uint32_t color)voidfillRect(int32_t x,int32_t y,int32_t w,int32_t h,uint32_t color)7. 畫(huà)空心橢圓
tft.drawEllipse(100,100,100,60,TFT_GREENYELLOW);8. 畫(huà)實(shí)心橢圓
void drawRect(int32_t x, int32_t y, int32_t w, int32_t h, uint32_t color)9. 畫(huà)空心矩形
void drawRect(int32_t x, int32_t y, int32_t w, int32_t h, uint32_t color)10. 畫(huà)實(shí)心矩形
void fillRect(int32_t x, int32_t y, int32_t w, int32_t h, uint32_t color)11. 畫(huà)空心圓角矩形
void drawRoundRect(int32_t x, int32_t y, int32_t w, int32_t h, int32_t radius, uint32_t color)12. 畫(huà)實(shí)心圓角矩形
void fillRoundRect(int32_t x, int32_t y, int32_t w, int32_t h, int32_t radius, uint32_t color)13. 畫(huà)空心三角形
void drawTriangle(int32_t x1, int32_t y1, int32_t x2, int32_t y2, int32_t x3, int32_t y3, uint32_t color)14. 畫(huà)實(shí)心三角形
void fillTriangle(int32_t x1, int32_t y1, int32_t x2, int32_t y2, int32_t x3, int32_t y3, uint32_t color)五、圖片顯示相關(guān)
1. 顯示BMP圖片
void drawBitmap(int16_t x, int16_t y, const uint8_t *bitmap, int16_t w, int16_t h, uint16_t fgcolor)
void drawBitmap(int16_t x, int16_t y, const uint8_t *bitmap, int16_t w, int16_t h, uint16_t fgcolor, uint16_t bgcolor)2. XBM
void drawXBitmap(int16_t x, int16_t y, const uint8_t *bitmap, int16_t w, int16_t h, uint16_t fgcolor)
void drawXBitmap(int16_t x, int16_t y, const uint8_t *bitmap, int16_t w, int16_t h, uint16_t fgcolor, uint16_t bgcolor)3. 顯示圖片
void pushImage(int32_t x, int32_t y, int32_t w, int32_t h, const uint16_t *data)
void pushImage(int32_t x, int32_t y, int32_t w, int32_t h, uint16_t *data)
void pushImage(int32_t x, int32_t y, int32_t w, int32_t h, const uint16_t *data, uint16_t transparent)
void pushImage(int32_t x, int32_t y, int32_t w, int32_t h, uint16_t *data, uint16_t transparent)
void pushImage(int32_t x, int32_t y, int32_t w, int32_t h, uint8_t *data, bool bpp8 = true, uint16_t *cmap = (uint16_t *)nullptr)
void pushImage(int32_t x, int32_t y, int32_t w, int32_t h, uint8_t *data, uint8_t transparent, bool bpp8 = true, uint16_t *cmap = (uint16_t *)nullptr)TFT_eSPI庫(kù)的動(dòng)畫(huà)顯示
繪制幾何圖形再擦除的方式繪制動(dòng)畫(huà)是非常好的方式, 它的:
優(yōu)點(diǎn)是: 1. 占用空間非常小 2. 動(dòng)畫(huà)清晰,充分利用每個(gè)像素點(diǎn) 3. 可以非常靈動(dòng). 4. 方便進(jìn)行微調(diào)
缺點(diǎn)是: 1. 容易閃屏 2. 一般不會(huì)太復(fù)雜 3.需要大量的計(jì)算文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-405582.html
1. 讓一個(gè)正方形動(dòng)起來(lái)
思路: 繪制一個(gè)正方形, 然后每30ms 就擦除一部分正方形頂部的線,
#include <Arduino.h>
#include <TFT_eSPI.h> // Hardware-specific library
#include <SPI.h>
TFT_eSPI tft = TFT_eSPI(); // Invoke custom library
uint32_t updateTime = 0; // time for next update
int oldi = 0;
int i = 0;
void setup(void)
{
tft.init();
tft.setRotation(0);
tft.fillScreen(TFT_BLACK);
updateTime = millis(); // Next update time
tft.fillRect(0, 0, 50, 50, TFT_RED);
}
void loop()
{
if (updateTime <= millis())
{
updateTime = millis() + 30; //每30ms更新一次
if (i < 350)
i += 5;
else
oldi=i=-50;
while (i != oldi)
{
tft.drawFastHLine(0, oldi, 50, TFT_BLACK);
oldi++;
tft.drawFastHLine(0, oldi + 50, 50, TFT_RED);
}
}
}
2. 畫(huà)一個(gè)帶動(dòng)畫(huà)的扇形
TFT_eSPI是沒(méi)有畫(huà)扇形的函數(shù)的, 畫(huà)扇形的思路是: 將扇形分解為1個(gè)個(gè)小三角形,每個(gè)三角形表示一弧度
#include <Arduino.h>
#include <TFT_eSPI.h> // Hardware-specific library
#include <SPI.h>
TFT_eSPI tft = TFT_eSPI(); // Invoke custom library
#define DEG2RAD 0.0174532925 //當(dāng)半徑為1時(shí), 1弧度對(duì)應(yīng)長(zhǎng)度, 我們可以理解為1個(gè)標(biāo)準(zhǔn)單位
byte inc = 0;
unsigned int col = 0;
void fillSegment(int x, int y, int start_angle, int sub_angle, int r, unsigned int colour);
void setup(void)
{
Serial.begin(115200);
tft.begin();
tft.fillScreen(TFT_BLACK);
}
void loop()
{
fillSegment(65, 120, 0, 60, 50, TFT_RED);
tft.fillScreen(TFT_BLACK);
}
void fillSegment(int x, int y, int start_angle, int sub_angle, int r, unsigned int colour)
{
// 計(jì)算初始的x1, y1
float sx = cos((start_angle - 90) * DEG2RAD);
float sy = sin((start_angle - 90) * DEG2RAD);
uint16_t x1 = sx * r + x;
uint16_t y1 = sy * r + y;
for (int i = start_angle; i < start_angle + sub_angle; i++)
{
int x2 = cos((i + 1 - 90) * DEG2RAD) * r + x;
int y2 = sin((i + 1 - 90) * DEG2RAD) * r + y;
tft.fillTriangle(x1, y1, x2, y2, x, y, colour);
x1 = x2;
y1 = y2;
//如果在這里加個(gè)delay會(huì)出現(xiàn)扇形動(dòng)畫(huà)
delay(20);
}
}
3. 畫(huà)一個(gè)帶動(dòng)畫(huà)的矩形進(jìn)度條文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-405582.html
#include <Arduino.h>
#include <TFT_eSPI.h> // Hardware-specific library
#include <SPI.h>
TFT_eSPI tft = TFT_eSPI(); // Invoke custom library
void fillSegment(int x,int y,unsigned int colour);
void setup(void)
{
tft.init();
tft.setRotation(0);
tft.fillScreen(TFT_BLACK);
}
void loop()
{
fillSegment(65, 120, TFT_RED);
tft.fillScreen(TFT_BLACK);
}
void fillSegment(int x,int y,unsigned int colour)
{
int y2 = 10;
for (int i = 0; i < +100; i++)
{
tft.fillRect(x, y, i, y2, colour);
//如果在這里加個(gè)delay會(huì)出現(xiàn)扇形動(dòng)畫(huà)
delay(20);
}
}到了這里，關(guān)于ESP32 Arduino 學(xué)習(xí)篇（五）TFT_eSPI庫(kù)的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
