Nozioni di base sull'interfacciamento di Arduino TFT: 10 passaggi (con immagini)

2024 Autore: John Day | [email protected]. Ultima modifica: 2024-01-30 10:02

I touchscreen TFT sono la straordinaria interfaccia grafica che può essere utilizzata con microcontrollori come Atmel, PIC, STM, poiché ha un'ampia gamma di colori, una buona capacità grafica e una buona mappatura dei pixel.

Oggi andremo a interfacciare lo schermo LCD TFT da 2,4 pollici con Arduino.

Questo shield è per Arduino UNO, ma insegnerò come usarlo con Arduino Mega per un motivo molto logico, la "Memoria di programma".

Utilizzando questo schermo LCD TFT a colori possiamo mostrare caratteri, stringhe, interfaccia di pulsanti, immagini bitmap, ecc. sul display LCD TFT a colori.

Passaggio 1: requisiti hardware e software

Per rendere l'interfaccia shield con Arduino mega, abbiamo bisogno di quanto segue.

HARDWARE:

• Arduino mega

• LCD TFT 2,4/2,8/3,2 pollici

• Cavo USB

SOFTWARE

• Arduino IDE

• Libreria UTFT / Libreria spfd5408

Lo Shield è originariamente realizzato per le schede Arduino UNO, che possono essere utilizzate con Arduino mega.

Ci sono due problemi principali durante l'utilizzo con Arduino UNO: "Memoria di archiviazione" e utilizzo dei pin.

È difficile utilizzare i pin inutilizzati disponibili su UNO, mentre è meglio con Arduino MEGA poiché abbiamo più pin I/O rimasti.

Nel passaggio successivo, mostrerò come modificare la libreria UTFT per utilizzare lo scudo TFT

Passaggio 2: modifica di UTFT Lib

Questa libreria è la continuazione delle mie librerie ITDB02_Graph, ITDB02_Graph16 e RGB_GLCD per Arduino e chipKit. Poiché il numero di moduli display e controller supportati ha iniziato ad aumentare, ho sentito che era giunto il momento di creare un'unica libreria universale poiché sarà molto più facile da mantenere in futuro.

Arduino MEGA ha 256kb di memoria di programma. Inoltre, ci sono 54 pin.

La maggior parte di questi sono gratuiti e l'analogico solo 5 sono presi da 16.

Questa libreria supporta un numero di display grafici a 8 bit, 16 bit e seriali e funzionerà con Arduino, schede chipKit e alcuni LaunchPad TI.

NOTA: A causa delle dimensioni della libreria non consiglio di utilizzarlo su ATmega328 (Arduino Uno) e ATmega32U4 (Arduino Leonardo) in quanto hanno solo 32 KB di memoria flash. Funzionerà, ma sarai fortemente limitato nella memoria flash disponibile per la tua applicazione

Passi

• Scarica la libreria UTFT
• Decomprimi la libreria
• Apri UTFT\hardware\avr in caso di Arduino o in base al microcontrollore utilizzato
• Apri HW_AVR_defines usando Blocco note
• Rimuovi il commento dalla riga 7 per abilitare lo scudo UNO per MEGA
• Salva il file e aggiungi questa libreria all'IDE di Arduino

Ora abbiamo finito con questo passaggio! Nel passaggio successivo, mostrerò di utilizzare la libreria e definire i pin per Arduino Mega.

Passaggio 3: inizializzazione di TFT Shield

Dopo aver modificato la libreria, aggiungila alla directory Arduino.

Successivamente, ti mostrerò come definire il modulo TFT corretto che hai

dovremmo trovare il nome del modulo nella libreria.

• apri il file della libreria
• vai alla documentazione

Puoi vedere questi file nella documentazione

• UTFT:

Questo file mostra tutte le funzioni e i comandi inclusi in questa libreria.

• Requisito_UTFT

Questo file contiene informazioni sui moduli e su come è correlato alla libreria, come le configurazioni dei pin

•UTFT_Supported_display_modules_&_controller

Questo è il nostro obiettivo, questo file ha i nomi dei moduli e degli scudi supportati da questa libreria, puoi vedere in esso un elenco di nomi di moduli e nomi di moduli per l'UTFT che dovresti usare per definire il tuo modulo.

Passaggi per definire il TFT:

Apri il file UTFT_Supported_display_modules_&_controller dalla libreria

• Apri il file UTFT_Supported_display_modules_&_controller dalla libreria
• Trova i modelli per UTFT per i moduli (scudo) che hai.
• Ora per definire una funzione UTFT sull'IDE di Arduino, usiamo il comando:

Nome UTFT (modulo, Rs, Wr, Cs, Rst);

Apri il file UTFT_Requirement dalla libreria

Dal documento sappiamo che i pin si trovano sui pin A5, A4, A3 e A2.

usiamo il comando:

UTFT mioGLCD(ITDB28, 19, 18, 17, 16); # nota che i pin 19, 18, 17, 16 nell'Arduino Mega

UTFT mioGLCD (ITDB28, A5, A4, A3, A2); # nota che i pin A5, A4, A3, A2 nell'Arduino UNO

E fatto! Ora puoi utilizzare gli esempi di libreria sull'IDE Arduino con le seguenti modifiche.

Passaggio 4: Hello World di base

#include // Dichiara quali caratteri utilizzeremo

extern uint8_t BigFont; extern uint8_t SevenSegNumFont; // Ricorda di cambiare il parametro del modello per adattarlo al tuo modulo di visualizzazione! UTFT mioGLCD (ITDB28, A5, A4, A3, A2); void setup() { myGLCD. InitLCD(); mioGLCD.clrScr(); myGLCD.setFont(BigFont); } void loop() { myGLCD.setColor(0, 255, 0); //green myGLCD.print("HELLO WORLD", 45, 100); mentre (vero) {}; }

Passaggio 5: caratteri UTFT

#include // Dichiara quali caratteri utilizzeremo

extern uint8_t SmallFont; extern uint8_t BigFont; extern uint8_t SevenSegNumFont; // Imposta i pin su quelli corretti per il tuo scudo di sviluppo // ----------------------------------- ------------------------- // Arduino Uno / 2009: // ---------------- --- // Scudo Arduino Uno/2009 standard:, A5, A4, A3, A2 // Schermo DisplayModule Arduino Uno TFT shield:, A5, A4, A3, A2 // // Arduino Mega: // ----- -------------- // Standard Arduino Mega/Due shield:, 38, 39, 40, 41 // CTE TFT LCD/SD Shield per Arduino Mega:, 38, 39, 40, 41 // // Ricordati di cambiare il parametro del modello per adattarlo al tuo modulo display! UTFT mioGLCD(ITDB32S, 38, 39, 40, 41); void setup() { myGLCD. InitLCD() myGLCD.clrScr(); } void loop() { myGLCD.setColor(0, 255, 0); myGLCD.setBackColor(0, 0, 0); myGLCD.setFont(BigFont); myGLCD.print(" !\"#$%&'()*+, -./", CENTER, 0); myGLCD.print("0123456789:;?", CENTER, 16); myGLCD.print("@ ABCDEFGHIJKLMNO", CENTER, 32); myGLCD.print("PQRSTUVWXYZ^_", CENTER, 48); myGLCD.print("`abcdefghijklmno", CENTER, 64); myGLCD.print("pqrstuvwxyz{|} ~ ", CENTER, 80); myGLCD.setFont(SmallFont); myGLCD.print(" !\"#$%&'()*+, -./0123456789:;?", CENTER, 120); myGLCD.print("@ABCDEFGHIJKLMNOPQRSTUVWXYZ^_", CENTER, 132); myGLCD.print("`abcdefghijklmnopqrstuvwxyz{|}~ ", CENTER, 144); myGLCD.setFont(SevenSegNumFont); myGLCD.print("0123456789", CENTRO, 190); mentre(1) {}; }

Passaggio 6: forme, linee e motivi UTFT

#include "UTFT.h"// Dichiara quali caratteri utilizzeremoextern uint8_t SmallFont;// Imposta i pin su quelli corretti per il tuo shield di sviluppo // -------------- -------------------------------- // Arduino Uno / 2009: // ------------------- // Scudo Arduino Uno/2009 standard:, A5, A4, A3, A2 // Schermo DisplayModule Arduino Uno TFT:, A5, A4, A3, A2 // // Arduino Mega: // ------------------- // Arduino Mega/Due shield standard:, 38, 39, 40, 41 // CTE TFT LCD/SD Shield per Arduino Mega:, 38, 39, 40, 41 // // Ricorda di cambiare il parametro del modello per adattarlo al tuo modulo display! UTFT myGLCD(ITDB32S, 38, 39, 40, 41); void setup() { randomSeed(analogRead(0)); // Imposta l'LCD myGLCD. InitLCD(); myGLCD.setFont(SmallFont); }

ciclo vuoto()

{ int buf[318]; int x, x2; int y, y2; int r;// Cancella lo schermo e disegna il frame myGLCD.clrScr(); myGLCD.setColor(255, 0, 0); myGLCD.fillRect(0, 0, 319, 13); myGLCD.setColor(64, 64, 64); myGLCD.fillRect(0, 226, 319, 239); myGLCD.setColor(255, 255, 255); myGLCD.setBackColor(255, 0, 0); myGLCD.print("* Libreria display TFT a colori universale *", CENTER, 1); myGLCD.setBackColor(64, 64, 64); myGLCD.setColor(255, 255, 0); myGLCD.print("", CENTRO, 227); myGLCD.setColor(0, 0, 255); myGLCD.drawRect(0, 14, 319, 225);// Disegna mirino myGLCD.setColor(0, 0, 255); myGLCD.setBackColor(0, 0, 0); myGLCD.drawLine(159, 15, 159, 224); myGLCD.drawLine(1, 119, 318, 119); for (int i=9; i<310; i+=10) myGLCD.drawLine(i, 117, i, 121); for (int i=19; i<220; i+=10) myGLCD.drawLine(157, i, 161, i);// Disegna linee sin-, cos- e tan myGLCD.setColor(0, 255, 255); myGLCD.print("Sin", 5, 15); for (int i=1; i<318; i++) { myGLCD.drawPixel(i, 119+(sin(((i*1.13)*3.14)/180)*95)); } myGLCD.setColor(255, 0, 0); myGLCD.print("Cos", 5, 27); for (int i=1; i<318; i++) { myGLCD.drawPixel(i, 119+(cos(((i*1.13)*3.14)/180)*95)); } myGLCD.setColor(255, 255, 0); myGLCD.print("Abbronzatura", 5, 39); for (int i=1; i<318; i++) { myGLCD.drawPixel(i, 119+(tan(((i*1.13)*3.14)/180))); } ritardo (2000); myGLCD.setColor(0, 0, 0); myGLCD.fillRect(1, 15, 318, 224); myGLCD.setColor(0, 0, 255); myGLCD.setBackColor(0, 0, 0); myGLCD.drawLine(159, 15, 159, 224); myGLCD.drawLine(1, 119, 318, 119);// Disegna un'onda sinusoidale in movimento x=1; for (int i=1; i319) { if ((x==159)||(buf[x-1]==119)) myGLCD.setColor(0, 0, 255); else myGLCD.setColor(0, 0, 0); myGLCD.drawPixel(x, buf[x-1]); } myGLCD.setColor(0, 255, 255); y=119+(sin(((i*1.1)*3.14)/180)*(90-(i/100))); myGLCD.drawPixel(x, y); buf[x-1]=y; } ritardo (2000); myGLCD.setColor(0, 0, 0); myGLCD.fillRect(1, 15, 318, 224);// Disegna dei rettangoli pieni per (int i=1; i<6; i++) { switch (i) { case 1: myGLCD.setColor(255, 0, 255); rottura; caso 2: myGLCD.setColor(255, 0, 0); rottura; caso 3: myGLCD.setColor(0, 255, 0); rottura; caso 4: myGLCD.setColor(0, 0, 255); rottura; caso 5: myGLCD.setColor(255, 255, 0); rottura; } myGLCD.fillRect(70+(i*20), 30+(i*20), 130+(i*20), 90+(i*20)); } ritardo (2000); myGLCD.setColor(0, 0, 0); myGLCD.fillRect(1, 15, 318, 224);// Disegna dei rettangoli pieni e arrotondati per (int i=1; i<6; i++) { switch (i) { case 1: myGLCD.setColor(255, 0, 255); rottura; caso 2: myGLCD.setColor(255, 0, 0); rottura; caso 3: myGLCD.setColor(0, 255, 0); rottura; caso 4: myGLCD.setColor(0, 0, 255); rottura; caso 5: myGLCD.setColor(255, 255, 0); rottura; } myGLCD.fillRoundRect(190-(i*20), 30+(i*20), 250-(i*20), 90+(i*20)); } ritardo (2000); myGLCD.setColor(0, 0, 0); myGLCD.fillRect(1, 15, 318, 224);// Disegna dei cerchi pieni per (int i=1; i<6; i++) { switch (i) { case 1: myGLCD.setColor(255, 0, 255); rottura; caso 2: myGLCD.setColor(255, 0, 0); rottura; caso 3: myGLCD.setColor(0, 255, 0); rottura; caso 4: myGLCD.setColor(0, 0, 255); rottura; caso 5: myGLCD.setColor(255, 255, 0); rottura; } myGLCD.fillCircle(100+(i*20), 60+(i*20), 30); } ritardo (2000); myGLCD.setColor(0, 0, 0); myGLCD.fillRect(1, 15, 318, 224);// Disegna alcune linee in un pattern myGLCD.setColor (255, 0, 0); for (int i=15; i<224; i+=5) { myGLCD.drawLine(1, i, (i*1.44)-10, 224); } myGLCD.setColor (255, 0, 0); for (int i=224; i>15; i-=5) { myGLCD.drawLine(318, i, (i*1.44)-11, 15); } myGLCD.setColor (0, 255, 255); for (int i=224; i>15; i-=5) { myGLCD.drawLine(1, i, 331-(i*1.44), 15); } myGLCD.setColor (0, 255, 255); for (int i=15; i<224; i+=5) { myGLCD.drawLine(318, i, 330-(i*1.44), 224); } ritardo (2000); myGLCD.setColor(0, 0, 0); myGLCD.fillRect(1, 15, 318, 224);// Disegna alcuni cerchi casuali per (int i=0; i<100; i++) { myGLCD.setColor(random(255), random(255), random(255))); x=32+casuale(256); y=45+casuale(146); r=casuale(30); myGLCD.drawCircle(x, y, r); } ritardo (2000); myGLCD.setColor(0, 0, 0); myGLCD.fillRect(1, 15, 318, 224);// Disegna alcuni rettangoli casuali per (int i=0; i<100; i++) { myGLCD.setColor(random(255), random(255), random(255))); x=2+casuale(316); y=16+casuale(207); x2=2+casuale(316); y2=16+casuale(207); myGLCD.drawRect(x, y, x2, y2); } ritardo (2000); myGLCD.setColor(0, 0, 0); myGLCD.fillRect(1, 15, 318, 224);// Disegna alcuni rettangoli arrotondati casuali per (int i=0; i<100; i++) { myGLCD.setColor(random(255), random(255), random(255)); x=2+casuale(316); y=16+casuale(207); x2=2+casuale(316); y2=16+casuale(207); myGLCD.drawRoundRect(x, y, x2, y2); } ritardo (2000); myGLCD.setColor(0, 0, 0); myGLCD.fillRect(1, 15, 318, 224); for (int i=0; i<100; i++) { myGLCD.setColor(random(255), random(255), random(255)); x=2+casuale(316); y=16+casuale(209); x2=2+casuale(316); y2=16+casuale(209); myGLCD.drawLine(x, y, x2, y2); } ritardo (2000); myGLCD.setColor(0, 0, 0); myGLCD.fillRect(1, 15, 318, 224); for (int i=0; i<10000; i++) { myGLCD.setColor(random(255), random(255), random(255)); myGLCD.drawPixel(2+random(316), 16+random(209)); } ritardo (2000); myGLCD.fillScr(0, 0, 255); myGLCD.setColor(255, 0, 0); myGLCD.fillRoundRect(80, 70, 239, 169); myGLCD.setColor(255, 255, 255); myGLCD.setBackColor(255, 0, 0); myGLCD.print("Questo è tutto!", CENTRO, 93); myGLCD.print("Riavvio in a", CENTER, 119); myGLCD.print("pochi secondi…", CENTER, 132); myGLCD.setColor(0, 255, 0); myGLCD.setBackColor(0, 0, 255); myGLCD.print("Runtime: (msec)", CENTER, 210); myGLCD.printNumI(millis(), CENTER, 225); ritardo (10000); }

Passaggio 7: bitmap UTFT

#includere

#include // Dichiara quali caratteri utilizzeremo extern uint8_t SmallFont;// Imposta i pin su quelli corretti per il tuo shield di sviluppo // ------------------ ---------------------------- // Arduino Uno / 2009: / / ------------------- // Scudo Arduino Uno/2009 standard:, A5, A4, A3, A2 // Schermo DisplayModule Arduino Uno TFT shield:, A5, A4, A3, A2 // // Arduino Mega: // ------------------- // Arduino Mega/Due shield standard:, 38, 39, 40, 41 // CTE TFT LCD/SD Shield per Arduino Mega:, 38, 39, 40, 41 // // Ricorda di modificare il parametro del modello per adattarlo al tuo modulo display! UTFT myGLCD(ITDB32S, A5, A4, A3, A2);extern unsigned int info[0x400]; extern unsigned int icon[0x400]; extern unsigned int tux[0x400];void setup() { myGLCD. InitLCD(); myGLCD.setFont(SmallFont); }loop vuoto() { myGLCD.fillScr(255, 255, 255); myGLCD.setColor(255, 255, 255); myGLCD.print(" *** Una griglia 10 per 7 di un'icona 32x32 *** ", CENTER, 228); for (int x=0; x<10; x++) for (int y=0; y<7; y++) myGLCD.drawBitmap (x*32, y*32, 32, 32, info); ritardo (5000); myGLCD.fillScr(255, 255, 255); myGLCD.setColor(255, 255, 255); myGLCD.print("Due icone diverse in scala da 1 a 4", CENTRO, 228); intero x=0; for (int s=0; s0; s--) { myGLCD.drawBitmap (x, 224-(s*32), 32, 32, icon, s); x+=(s*32); } ritardo(5000); }

Passaggio 8: interfaccia dei pulsanti

#include #include // Inizializza display// ------------------ // Imposta i pin su quelli corretti per la tua scheda di sviluppo // ------- --------------------------------------------------- -- // Standard Arduino Uno/2009 Shield:, 19, 18, 17, 16 // Standard Arduino Mega/Due shield:, 38, 39, 40, 41 // CTE TFT LCD/SD Shield per Arduino Due:, 25, 26, 27, 28 // Scheda di prova TFT Teensy 3.x:, 23, 22, 3, 4 // ElecHouse TFT LCD/SD Shield per Arduino Due:, 22, 23, 31, 33 // // Ricordarsi di cambia il parametro del modello per adattarlo al tuo modulo di visualizzazione! UTFT myGLCD(ITDB32S, 38, 39, 40, 41);// Inizializza touchscreen // ---------------------- // Imposta i pin sul corretto quelli per la tua scheda di sviluppo // ----------------------------- ---------------- // Scudo Arduino Uno/2009 standard: 15, 10, 14, 9, 8 // Scudo Arduino Mega/Due standard: 6, 5, 4, 3, 2 // CTE TFT LCD/SD Shield per Arduino Due: 6, 5, 4, 3, 2 // Teensy 3.x Test Board TFT: 26, 31, 27, 28, 29 // ElecHouse TFT LCD/SD Shield for Arduino Due: 25, 26, 27, 29, 30 // URTouch myTouch(6, 5, 4, 3, 2);// Dichiara quali caratteri utilizzeremo extern uint8_t BigFont;int x, y; char stCurrent[20]=""; int stCurrentLen=0; char stLast[20]="";/************************* ** Funzioni personalizzate ** ********* ****************/void drawButtons() { // Disegna la riga superiore di pulsanti per (x=0; x<5; x++) { myGLCD.setColor(0, 0, 255); myGLCD.fillRoundRect (10+(x*60), 10, 60+(x*60), 60); myGLCD.setColor(255, 255, 255); myGLCD.drawRoundRect (10+(x*60), 10, 60+(x*60), 60); myGLCD.printNumI(x+1, 27+(x*60), 27); } // Disegna la riga centrale di pulsanti per (x=0; x<5; x++) { myGLCD.setColor(0, 0, 255); myGLCD.fillRoundRect (10+(x*60), 70, 60+(x*60), 120); myGLCD.setColor(255, 255, 255); myGLCD.drawRoundRect (10+(x*60), 70, 60+(x*60), 120); if (x<4) myGLCD.printNumI(x+6, 27+(x*60), 87); } mioGLCD.print("0", 267, 87); // Disegna la riga inferiore di pulsanti myGLCD.setColor(0, 0, 255); myGLCD.fillRoundRect (10, 130, 150, 180); myGLCD.setColor(255, 255, 255); myGLCD.drawRoundRect (10, 130, 150, 180); myGLCD.print("Cancella", 40, 147); myGLCD.setColor(0, 0, 255); myGLCD.fillRoundRect (160, 130, 300, 180); myGLCD.setColor(255, 255, 255); myGLCD.drawRoundRect (160, 130, 300, 180); myGLCD.print("Invio", 190, 147); myGLCD.setBackColor (0, 0, 0); }void updateStr(int val) { if (stCurrentLen=10) && (y=10) && (x=70) && (x=130) && (x=190) && (x=250) && (x=70) && (y=10) && (x=70) && (x=130) && (x=190) && (x=250) && (x=130) && (y=10) && (x=160) && (x0) { per (x=0; x

Passaggio 9: Flappy Bird

#include #include #include //==== Creazione di oggetti UTFT myGLCD(SSD1289, 38, 39, 40, 41); //I parametri dovrebbero essere adattati al tuo modello Display/Schield UTouch myTouch(6, 5, 4, 3, 2);//==== Definizione dei caratteri extern uint8_t SmallFont; extern uint8_t BigFont; extern uint8_t SevenSegNumFont;extern unsigned int bird01[0x41A]; // Bitmapint uccello x, y; // Variabili per le coordinate dove è stato premuto il display// Floppy Bird int xP = 319; int yP = 100; int yB = 50; int MovingRate = 3; int fallRateInt = 0; tasso di caduta float = 0; punteggio int = 0; int lastSpeedUpScore = 0; int punteggio più alto; boolean screenPressed = false; boolean gameStarted = false;void setup() { // Avvia la visualizzazione myGLCD. InitLCD(); mioGLCD.clrScr(); myTouch. InitTouch(); myTouch.setPrecision(PREC_MEDIUM); punteggio più alto = EEPROM.read(0); // Legge il punteggio più alto dalla EEPROM beginGame(); // Avvia il gioco }void loop() { xP=xP-movingRate; // xP - coordinata x dei pilastri; intervallo: 319 - (-51) drawPilars(xP, yP); // Disegna i pilastri // yB - coordinata y dell'uccello che dipende dal valore della variabile fallRate yB+=fallRateInt; fallRate=fallRate+0.4; // Ad ogni intrazione il tasso di caduta aumenta in modo da poter ottenere l'effetto di accelerazione/ gravità fallRateInt= int(fallRate); // Controlla la collisione if(yB>=180 || yB<=0){ // gameOver superiore e inferiore(); } if((xP=5) && (yB<=yP-2)){ // pilastro superiore gameOver(); } if((xP=5) && (yB>=yP+60)){ // pilastro inferiore gameOver(); } // Disegna l'uccello drawBird(yB); // Dopo che il pilastro è passato attraverso lo schermo if (xPRESET=250) && (x=0) && (y=0) && (x=30) && (y=270){ myGLCD.setColor(0, 200, 20); myGLCD.fillRect(318, 0, x, y-1); myGLCD.setColor(0, 0, 0); myGLCD.drawRect(319, 0, x-1, y); myGLCD.setColor(0, 200, 20); myGLCD.fillRect(318, y+81, x, 203); myGLCD.setColor(0, 0, 0); myGLCD.drawRect(319, y+80, x-1, 204); } else if(x punteggio più alto) { punteggio più alto = punteggio; EEPROM.write(0, punteggio più alto); } // Reimposta le variabili per iniziare i valori di posizione xP=319; yB=50; tasso di caduta=0; punteggio = 0; lastSpeedUpScore = 0; MovingRate = 3; gameStarted = falso; // Riavvia il gioco iniziaGame(); }

Fase 10: lavorazione del progetto

Puoi trovare il codice sorgente nel mio repository Github.

Link:

Metti un pollice in su se ti è stato davvero d'aiuto e segui il mio canale per progetti interessanti:)

Condividi questo video se ti va.

Felice di esserti iscritto:

Grazie per aver letto!