Introduktion ESP32 Lora OLED -skärm: 8 steg

2025 Författare: John Day | [email protected]. Senast ändrad: 2025-01-23 15:11

Detta är en annan video om introduktionen till ESP32 LoRa. Den här gången kommer vi att prata specifikt om en grafisk display (på 128x64 pixlar). Vi kommer att använda SSD1306 -biblioteket för att visa information om denna OLED -skärm och presentera ett exempel på animering med XBM -bilder.

Steg 1: Resurser som används

1 Heltec WiFi LoRa 32

Protoboard

Steg 2: Displayen

Displayen som används på utvecklingskortet är en OLED på 0,96 tum.

Den har 128x64 och är svartvit.

Den har I2C -kommunikation och är ansluten till ESP32 via 3 ledningar:

SDA på GPIO4 (för data)

SCL på GPIO15 (för klocka)

RST på GPIO16 (för återställning och visningsstart)

Steg 3: SSD1306 -biblioteket

Detta kan hittas tillsammans med uppsättningen bibliotek som tillhandahålls av Heltec-Aaron-Lee.

Den har flera funktioner för att skriva strängar, rita linjer, rektanglar, cirklar och visa bilder.

github.com/Heltec-Aaron-Lee/WiFi_Kit_series

Steg 4: Animations- och XBM -filerna

Vi kommer att använda bibliotekets drawXbm -funktion för att visa en animering.

XBM -bildformatet består av en rad tecken där varje element textuellt representerar en uppsättning svartvita pixlar (1 bit vardera), genom ett hexadecimalt värde. Dessa motsvarar en byte.

Eftersom flera tecken används för att representera en enda byte tenderar dessa filer att vara större än de från de för närvarande antagna formaten. Fördelen är att de kan sammanställas direkt utan behov av tidigare behandling.

Förutom matrisen ingår två inställningar som bestämmer bildstorleken.

För att bygga animationen behöver vi de bilder som kommer att bilda ramarna.

Vi kan använda valfri bildredigeringsprogramvara för att fungera. De enda försiktighetsåtgärderna vi bör vidta är att först hålla storleken kompatibel med skärmen och använda svartvita filer.

För att generera filerna kan vi rita dem eller importera bilder. Här bestämde vi oss för att redigera en färgbild med PaintBrush, och vi ritade var och en av ramarna

Originalbild - 960x707 pixlar --p.webp

Nästa steg är att göra det svartvitt genom att spara det som en svartvit bitmapp.

Sedan ändrar vi storlek till en storlek som är kompatibel med skärmen.

Var särskilt uppmärksam på måttenheterna. I det här fallet justerade vi bilden så att den upptar hela skärmens höjd (vertikal = 64 pixlar).

Med bilden i rätt storlek kommer vi att redigera den för att bilda ramarna. Här raderar vi varje signalbågsbåge och sparar dem som motsvarande ramar.

Nu måste vi konvertera BMP -filer till XBM -format.

Det finns flera programvarualternativ som kan göra denna konvertering. Vi valde också GIMP som redigeringsalternativ.

I vårt exempel använde vi PaintBrush för att generera och redigera filerna. Men var och en av dessa processer kunde ha gjorts i Gimp (eller någon annan redaktör).

För att konvertera öppnar vi först filen.

Med bilden öppen kan vi välja Arkiv => Exportera som …

I fönstret Exportera bild måste vi ändra målfilstillägget för XBM. Gimp kommer att ansvara för att identifiera önskat format och presentera fler alternativ …

Vid export kommer Gimp att presentera andra alternativ. Vi kan lämna standardvärdena.

Efter att ha konverterat alla filer kommer vi att ha fyra XBM -filer, en för varje bildruta.

Låt oss nu kopiera dem till källkodmappen och byta namn på dem genom att ändra deras tillägg till.h.

Steg 5: Avsluta XBM -filer

Vi kan öppna XBM -filerna i valfri textredigerare, där vi kommer att se bildmatris och bildstorleksinformation som redan definierats.

Steg 6: Källkod

Källkod: uttalanden

Vi kommer att inkludera nödvändiga bibliotek, liksom bildfiler. Vi definierar bildens positioner och övergångsintervallet. Vi riktar också OLED -stiften som är anslutna till ESP32. Slutligen skapar och justerar vi Display -objektet.

// Incluindo as bibliotecas necessárias #include #include "SSD1306.h" // Incluindo os arquivos de imagem #include "frame1.h" #include "frame2.h" #include "frame3.h" #include "frame4.h" // definições de posição da imagem e intervalo de transição #define posX 21 #define posY 0 #define intervalo 500 // Pinos do OLED estão conctados ao ESP32: I2C // OLED_SDA - GPIO4 // OLED_SCL - GPIO15 // OLED_RST - - GPIO16 #define SDA 4 #define SCL 15 #define RST 16 // O RST deve ser controlado by software SSD1306 display (0x3c, SDA, SCL, RST); // Cria e ajusta o Objeto display

Källkod: Setup ()

Initiera displayen och vänd skärmen vertikalt. Åtgärd är valfri.

void setup () {display.init (); // inicia o display display.flipScreenVertically (); // inverte verticalmente a tela (opcional)}

Källkod: Loop ()

Det första du ska göra i loop är att rensa skärmen. Vi laddar ram 1 i bufferten med hjälp av posX och posY utgångslägen. Vi informerar bildens storlek med frame1_width och frame1_height, och namnet på arrayen som innehåller bildens bitar. Vi visar bufferten på displayen och väntar ett intervall innan nästa bild visas.

void loop () {display.clear (); // limpa tela // carrega para o buffer o frame 1 // usando as posições iniciais posX e posY // informa o tamanho da imagem com frame1_width e frame1_height // informa o nome da matriz que contem os bits da imagem, no caso frame1_bits display.drawXbm (posX, posY, frame1_width, frame1_height, frame1_bits); // mostra o buffer no display display.display (); // aguarda um intervalo antes de mostrar o próximo frame delay (intervalo);

Vi upprepar processen för alla andra ramar.

// repete o processo para todos os outros frames display.clear (); display.drawXbm (posX, posY, frame2_width, frame2_height, frame2_bits); display.display (); fördröjning (intervalo); display.clear (); display.drawXbm (posX, posY, frame3_width, frame3_height, frame3_bits); display.display (); fördröjning (intervalo); display.clear (); display.drawXbm (posX, posY, frame4_width, frame4_height, frame4_bits); display.display (); fördröjning (intervalo); }

Steg 7: Gör UpLoad of Code

Med IDE öppen öppnar du filen med källkoden genom att dubbelklicka på.ino-filen eller genom att gå till Arkiv-menyn.

Med Heltec ansluten till USB, välj menyn Verktyg => Kort: "Heltec_WIFI_LoRa_32"

I menyn Verktyg väljer du fortfarande COM -porten där Heltec är ansluten.

Klicka på UPLOAD -knappen …

… Och vänta på slutsatsen.

Steg 8: Filer

Ladda ner filerna:

PDF

INO