ESP32 Dengan Display Oled - Bar Kemajuan: 6 Langkah

2024 Pengarang: John Day | [email protected]. Diubah suai terakhir: 2024-01-30 11:11

ESP32 yang akan kita bicarakan hari ini adalah yang sudah dilengkapi dengan Display Oled bawaan. Fungsi ini menjadikan hidup kita lebih mudah, kerana kita dapat memberikan kesan mengenai nilai pemboleh ubah yang muncul. Anda juga tidak perlu melihat tetingkap debug. Anda juga boleh mengumpulkan perwakilan dan melukis carta prestasi, antara lain. Oleh kerana faedah ini, saya menganggap model ini adalah produk yang hebat, dan kami akan memprogramnya hari ini menggunakan Arduino IDE.

Jadi, dalam video ini kita akan memprogram bar kemajuan. Penting untuk diingat bahawa jika ESP32 anda tidak mempunyai paparan, anda boleh membelinya secara berasingan. Juga, jika anda tidak pernah memprogram ESP32, saya sarankan anda menonton video ini: PENGENALAN VIDEO KEPADA ESP32, yang membahas perkara ini dengan lebih terperinci.

Langkah 1: Perpustakaan

Untuk menggunakan paparan oled, kita perlu mengkonfigurasi perpustakaan di Arduino IDE. Untuk melakukan ini, muat turun perpustakaan melalui pautan.

Buka zip fail dan tampalkannya ke folder perpustakaan Arduino IDE.

C: / ProgramFiles (x86) / Arduino / perpustakaan

Langkah 2: Wemos Lolin ESP32 OLED

Wemos Lolin adalah nama ESP ini. Dalam gambar, bahagian hitam adalah paparan dan, di sebelah peranti, kami memaparkan keseluruhan pinout. Seperti yang ditunjukkan, terdapat beberapa IO yang membolehkan kita menghidupkan dan mematikan pelbagai elemen. Di samping itu, model ini mempunyai WiFi dan Bluetooth generasi terkini.

Langkah 3: Contoh

Dalam video tersebut, anda dapat melihat projek siap kami, dan bagaimana menggunakan paparan oled untuk memaparkan bar kemajuan yang dikendalikan oleh potensiometer.

Langkah 4: Perhimpunan

Untuk pemasangan kami, saya menggunakan potensiometer 10k, dan saya menghidupkan GPIO25 kursor. Kami juga mempunyai 3v3 dan GND, seperti yang anda lihat pada gambar di bawah. Kekuatan akan datang dari USB itu sendiri.

Langkah 5: Kod

Pertama, kami menambah perpustakaan "SSD1306.h". Dengan ini, kita akan mengakses paparan oled. Setelah itu, kami membuat objek paparan jenis SSD1306 yang akan bertanggungjawab untuk mengawal kandungan yang ditunjukkan dalam paparan oled.

#include "SSD1306.h" // alias untuk #include "SSD1306Wire.h" // objeto controlador do display de led / * 0x3c: é um identificador único para comunicação do display pino 5 e 4 são os de comunicação (SDA, SDC) * / Skrin SSD1306 (0x3c, 5, 4); // pino que ligamos o potenciometro #define PINO_POTENCIOMETRO 25 // utilizado para fazer o contador de porcentagem int contador;

Persediaan

Dalam fungsi setup (), kita akan menginisialisasi objek paparan kita sehingga kita dapat mengendalikan apa yang akan ditampilkan. Melalui objek ini, kami juga akan mengkonfigurasi sumber penulisan untuk teks yang akan dipaparkan. Dan, akhirnya, kami menetapkan pin (khususnya, pin tempat kami mengubah potensiometer) ke INPUT untuk membaca nilainya.

persediaan tidak sah () {Serial.begin (115200); Bersiri.println (); Bersiri.println (); // Inicializa o objeto que controlará o que será exibido na tela screen.init (); // gira o paparan 180º (deixa de ponta cabeça) // display.flipScreenVertically (); // configura a fonte de escrita "ArialMT_Plain_10" screen.setFont (ArialMT_Plain_10); // configura o pino para fazer a leitura do potenciômetro. pinMode (PINO_POTENCIOMETRO, INPUT); }

Gelung

Dalam fungsi gelung (), kita akan membaca nilai potensiometer semasa. Kami dapat melihat bahawa kami menggunakan fungsi "peta" segera setelah membaca nilainya, kerana nilai baca terlalu tinggi untuk dimasukkan ke dalam bar kemajuan, jadi kami akan memetakan nilainya agar berada dalam lingkungan 0 hingga 100.

gelung void () {// leitura do valor do potenciometro int valor = analogRead (PINO_POTENCIOMETRO); //Serial.println(valor); // mapeando o valor do potenciometro para o valor da barra de progresso // potenciometro faz a leitura do valor no interalo de 0 a 4095 // a barra de progresso espera um valor entre 0 e 100 contador = peta (nilai, 0, 4095, 0, 100); // limpa todo o display, apaga o contúdo da tela screen.clear (); // ++ kaunter; // kaunter> 100? pembilang = 0: pembilang = pembilang; // desenha a progress bar drawProgressBar (); // exibe na tela o que foi configurado até então. skrin.display (); kelewatan (10); }

Dalam fungsi "drawProgress ()", kita akan menggunakan nilai yang dibaca dari potensiometer yang disimpan dalam pemboleh ubah "percProgress" untuk diatur dalam bar kemajuan. Kami juga akan meletakkan teks tepat di atas bar kemajuan, yang menunjukkan peratusan semasa.

// função para desenhar bar kemajuan tiada displayvoid drawProgressBar () {Serial.print (">>"); Serial.println (contador); // desenha bar kemajuan / * * drawProgressBar (x, y, lebar, tinggi, nilai); parametros (p): p1: x coordenada X no plano cartesiano p2: y coordenada Y no plano cartesiano p3: width comprimento da barra de progresso p4: ketinggian altura da barra de progresso p5: nilai valor que a barra de progresso deve suppir * / screen.drawProgressBar (10, 32, 100, 10, contador); // configura o alinhamento do texto que será escrito // nesse caso alinharemos o texto ao centro screen.setTextAlignment (TEXT_ALIGN_CENTER); // escreve o texto de porcentagem / * * drawString (x, y, teks); parametros (p): p1: x coordenada X no plano cartesiano p2: y coordenada Y no plano cartesiano p3: string texto que será exibido * / screen.drawString (64, 15, String (contador) + "%"); // se o contador está em zero, tanda rentetan "valor mínimo" if (contador == 0) {screen.drawString (64, 45, "Valor mínimo"); } // se o contador está em 100, masukkan rentetan "valor máximo" yang lain jika (contador == 100) {screen.drawString (64, 45, "Valor máximo"); }}

Langkah 6: Beberapa Fungsi Menarik Lain

Paparan

// meletakkan paparan terbalik

void flipScreenVertically ();

Melukis

// menarik satu piksel dari skrin

batal setPixel (int16_t x, int16_t y);

// Lukis satu garisan

undian tidak sah (int16_t x0, int16_t y0, int16_t x1, int16_t y1);

// lukis segi empat tepat

void drawRect (int16_t x, int16_t y, int16_t lebar, int16_t tinggi);

// lukis bulatan

undian tidak sahCircle (int16_t x, int16_t y, int16_t radius);

// isi bulatan

kosongkanCircle (int16_t x, int16_t y, int16_t radius);

// lukiskan garis mendatar

undian tidak sahHorizontalLine (int16_t x, int16_t y, int16_t length);

// lukis garis menegak

kekosongan undianVerticalLine (int16_t x, int16_t y, int16_t length);

Teks

// menetapkan penjajaran teks yang akan ditulis

// TEXT_ALIGN_LEFT, TEXT_ALIGN_CENTER, TEXT_ALIGN_RIGHT, TEXT_ALIGN_CENTER_BOTH

batal setTextAlignment (OLEDDISPLAY_TEXT_ALIGNMENT textAlignment);