Cara Menggunakan LCD I2C dengan ESP32 di Arduino IDE (kompatibel dengan ESP8266)

Tutorial ini menunjukkan cara menggunakan LCD I2C (Liquid Crystal Display) dengan ESP32 menggunakan Arduino IDE. Kami akan menunjukkan cara menyambungkan layar, menginstal perpustakaan, dan mencoba kode sampel untuk menulis teks pada LCD: teks statis, dan menggulir pesan panjang. Anda juga dapat menggunakan panduan ini dengan ESP8266.

Layar Kristal Cair I2C 16 × 2

Untuk tutorial ini kita akan menggunakan layar LCD 16×2 I2C, tetapi LCD dengan ukuran lain juga dapat berfungsi.

Keuntungan menggunakan LCD I2C adalah kabelnya sangat sederhana. Anda hanya perlu menghubungkan pin SDA dan SCL.

Selain itu, ia dilengkapi dengan potensiometer internal yang dapat Anda gunakan untuk menyesuaikan kontras antara latar belakang dan karakter pada LCD. Pada LCD “biasa” Anda perlu menambahkan potensiometer ke sirkuit untuk menyesuaikan kontras.

Bagian yang Diperlukan

Untuk mengikuti tutorial ini Anda memerlukan bagian-bagian ini:

Menghubungkan LCD ke ESP32

Tampilan ini menggunakan komunikasi I2C, yang membuat pengkabelan menjadi sangat sederhana.

Hubungkan LCD Anda ke ESP32 dengan mengikuti diagram skema berikut. Kami menggunakan pin I2C default ESP32 ( GPIO 21 dan GPIO 22 ).

Anda juga dapat menggunakan tabel berikut sebagai referensi.

Menghubungkan LCD ke ESP8266

Anda juga dapat menghubungkan LCD Anda ke ESP8266 dengan mengikuti diagram skema berikut. Kami menggunakan pin I2C default ESP8266 ( GPIO 4 dan GPIO 5 ).

Anda juga dapat menggunakan tabel berikut sebagai referensi.

Mempersiapkan Arduino IDE

Sebelum melanjutkan proyek, Anda perlu menginstal add-on ESP32 atau ESP8266 di Arduino IDE.

Arduino IDE dengan ESP32

Ikuti salah satu panduan berikutnya untuk mempersiapkan Arduino IDE Anda agar berfungsi dengan ESP32:

Arduino IDE dengan ESP8266

Untuk menginstal add-on ESP8266 di Arduino IDE Anda, baca tutorial berikut: Cara Memasang Board ESP8266 di Arduino IDE .

Install Library LiquidCrystal_I2C

Ada beberapa perpustakaan yang bekerja dengan LCD I2C. Kami menggunakan library  oleh Marco Schwartz . Ikuti langkah-langkah selanjutnya untuk menginstal perpustakaan:

  1. Klik di sini untuk mengunduh library LiquidCrystal_I2C . Anda harus memiliki folder .zip di Unduhan Anda
  2. Buka zip folder .zip dan Anda akan mendapatkan folder Master LiquidCrystal_I2C
  3. Ganti nama folder Anda dari LiquidCrystal_I2C-masterke LiquidCrystal_I2C
  4. Pindahkan folder LiquidCrystal_I2C ke folder library instalasi Arduino IDE Anda
  5. Terakhir, buka kembali Arduino IDE Anda

Mendapatkan Alamat LCD

Sebelum menampilkan teks pada LCD, Anda perlu menemukan alamat LCD I2C. Dengan LCD yang terhubung dengan benar ke ESP32, unggah sketsa Pemindai I2C berikut.

print 'hello world!'#include <Wire.h>
 
void setup() {
  Wire.begin();
  Serial.begin(115200);
  Serial.println("\nI2C Scanner");
}
 
void loop() {
  byte error, address;
  int nDevices;
  Serial.println("Scanning...");
  nDevices = 0;
  for(address = 1; address < 127; address++ ) {
    Wire.beginTransmission(address);
    error = Wire.endTransmission();
    if (error == 0) {
      Serial.print("I2C device found at address 0x");
      if (address<16) {
        Serial.print("0");
      }
      Serial.println(address,HEX);
      nDevices++;
    }
    else if (error==4) {
      Serial.print("Unknow error at address 0x");
      if (address<16) {
        Serial.print("0");
      }
      Serial.println(address,HEX);
    }    
  }
  if (nDevices == 0) {
    Serial.println("No I2C devices found\n");
  }
  else {
    Serial.println("done\n");
  }
  delay(5000);          
}

Setelah mengupload kode, buka Serial Monitor dengan baud rate 115200. Tekan tombol ESP32 EN. Alamat I2C harus ditampilkan di Serial Monitor.

Dalam hal ini alamatnya adalah 0x27 . Jika Anda menggunakan layar 16×2 yang serupa, Anda mungkin akan mendapatkan alamat yang sama.

Tampilkan Teks Statis pada LCD

Menampilkan teks statis pada LCD sangat sederhana. Yang harus Anda lakukan adalah memilih di mana Anda ingin karakter ditampilkan di layar, lalu mengirim pesan ke layar.

Berikut adalah contoh sketsa yang sangat sederhana yang menampilkan “ Halo, Dunia! “ .

#include <LiquidCrystal_I2C.h>

// set the LCD number of columns and rows
int lcdColumns = 16;
int lcdRows = 2;

// set LCD address, number of columns and rows
// if you don't know your display address, run an I2C scanner sketch
LiquidCrystal_I2C lcd(0x27, lcdColumns, lcdRows);  

void setup(){
  // initialize LCD
  lcd.init();
  // turn on LCD backlight                      
  lcd.backlight();
}

void loop(){
  // set cursor to first column, first row
  lcd.setCursor(0, 0);
  // print message
  lcd.print("Hello, World!");
  delay(1000);
  // clears the display to print new message
  lcd.clear();
  // set cursor to first column, second row
  lcd.setCursor(0,1);
  lcd.print("Hello, World!");
  delay(1000);
  lcd.clear(); 
}

Ini menampilkan pesan di baris pertama, dan kemudian di baris kedua.

Dalam sketsa sederhana ini kami menunjukkan kepada Anda fungsi yang paling berguna dan penting dari perpustakaan LiquidCrystal_I2C . Jadi, mari kita lihat sekilas bagaimana kode tersebut bekerja.

Cara kerja kode

Pertama, Anda perlu menyertakan pustaka LiquidCrystal_I2C .

#include <LiquidCrystal_I2C.h>

Dua baris berikutnya mengatur jumlah kolom dan baris layar LCD Anda. Jika Anda menggunakan tampilan dengan ukuran lain, Anda harus memodifikasi variabel tersebut.

<p>int lcdColumns = 16;</p>

<p>int lcdRows = 2;</p>

Kemudian, Anda perlu mengatur alamat tampilan, jumlah kolom dan jumlah baris. Anda harus menggunakan alamat tampilan yang Anda temukan di langkah sebelumnya.

LiquidCrystal_I2C lcd ( 0x27 , lcdKolom , lcdRows );

Dalam setup( ) pertama-tama inisialisasi tampilan dengan metode init () .

lcd . init ();

Kemudian, nyalakan lampu latar LCD, sehingga Anda dapat membaca karakter di layar.

lcd.backlight();

Untuk menampilkan pesan di layar, pertama-tama Anda perlu mengatur kursor ke tempat Anda ingin pesan Anda ditulis. Baris berikut mengatur kursor ke kolom pertama, baris pertama.

lcd.setCursor(0, 0);

Catatan : 0 sesuai dengan kolom pertama, 1 untuk kolom kedua, dan seterusnya…

Kemudian, Anda akhirnya dapat mencetak pesan Anda di layar menggunakan metode print( ) .

lcd.print("Hello, World!");

Tunggu satu detik, lalu bersihkan tampilan dengan metode clear( ) .

lcd.clear();

Setelah itu, atur kursor ke posisi baru: kolom pertama, baris kedua.

cd.setCursor(0,1);

Kemudian, proses ini diulang.

Jadi, inilah ringkasan fungsi untuk memanipulasi dan menulis di layar:

  • lcd.init () : menginisialisasi tampilan
  • lcd.backlight () : menyalakan lampu latar LCD
  • lcd.setCursor(int column, int row):: mengatur kursor ke kolom dan baris yang ditentukan
  • lcd.print(String message): menampilkan pesan di layar
  • lcd.clear(): menghapus tampilan

Contoh ini berfungsi dengan baik untuk menampilkan teks statis tidak lebih dari 16 karakter.

Tampilkan Teks Bergulir pada LCD

Menggulir teks pada LCD sangat berguna saat Anda ingin menampilkan pesan yang lebih panjang dari 16 karakter. Pustaka dilengkapi dengan fungsi bawaan yang memungkinkan Anda menggulir teks. Namun, banyak orang mengalami masalah dengan fungsi tersebut karena:

  • Fungsi menggulir teks pada kedua baris. Jadi, Anda tidak dapat memiliki baris tetap dan baris bergulir;
  • Ini tidak berfungsi dengan baik jika Anda mencoba menampilkan pesan yang lebih panjang dari 16 karakter.

Jadi, kami telah membuat sketsa sampel dengan fungsi yang dapat Anda gunakan dalam proyek Anda untuk menggulir pesan yang lebih panjang.

Sketsa berikut menampilkan pesan statis di baris pertama dan pesan bergulir lebih dari 16 karakter di baris kedua.

#include <LiquidCrystal_I2C.h>

// set the LCD number of columns and rows
int lcdColumns = 16;
int lcdRows = 2;

// set LCD address, number of columns and rows
// if you don't know your display address, run an I2C scanner sketch
LiquidCrystal_I2C lcd(0x27, lcdColumns, lcdRows);  

String messageStatic = "Static message";
String messageToScroll = "This is a scrolling message with more than 16 characters";

// Function to scroll text
// The function acepts the following arguments:
// row: row number where the text will be displayed
// message: message to scroll
// delayTime: delay between each character shifting
// lcdColumns: number of columns of your LCD
void scrollText(int row, String message, int delayTime, int lcdColumns) {
  for (int i=0; i < lcdColumns; i++) {
    message = " " + message;  
  } 
  message = message + " "; 
  for (int pos = 0; pos < message.length(); pos++) {
    lcd.setCursor(0, row);
    lcd.print(message.substring(pos, pos + lcdColumns));
    delay(delayTime);
  }
}

void setup(){
  // initialize LCD
  lcd.init();
  // turn on LCD backlight                      
  lcd.backlight();
}

void loop(){
  // set cursor to first column, first row
  lcd.setCursor(0, 0);
  // print static message
  lcd.print(messageStatic);
  // print scrolling message
  scrollText(1, messageToScroll, 250, lcdColumns);
}
Setelah membaca bagian sebelumnya, Anda harus terbiasa dengan cara kerja sketsa ini, jadi kita akan melihat fungsi yang baru dibuat: scrollText ( )
void scrollText(int row, String message, int delayTime, int lcdColumns) {
  for (int i=0; i < lcdColumns; i++) {
    message = " " + message; 
  } 
  message = message + " "; 
  for (int pos = 0; pos < message.length(); pos++) {
    lcd.setCursor(0, row);
    lcd.print(message.substring(pos, pos + lcdColumns));
    delay(delayTime);
  }
}

Untuk menggunakan fungsi ini, Anda harus memberikan empat argumen:

  • row: nomor baris tempat teks akan ditampilkan
  • message: pesan untuk menggulir
  • delayTime : penundaan antara setiap perpindahan karakter. Waktu tunda yang lebih tinggi akan menghasilkan perpindahan teks yang lebih lambat, dan waktu tunda yang lebih rendah akan menghasilkan perpindahan teks yang lebih cepat.
  • lcdColumns : jumlah kolom LCD Anda

Dalam kode kami, inilah cara kami menggunakan fungsi scrollText ( ) : scrollText(1, messageToScroll, 250, lcdColumns);

Variabel messageToScroll ditampilkan di baris kedua (1 sesuai dengan baris kedua), dengan waktu tunda 250 ms (gambar GIF dipercepat 1,5x).

Tampilkan Karakter Kustom

Dalam LCD 16x2 terdapat 32 blok tempat Anda dapat menampilkan karakter. Setiap blok terbuat dari 5x8 piksel kecil. Anda dapat menampilkan karakter khusus dengan menentukan status setiap piksel kecil. Untuk itu, Anda dapat membuat variabel byte untuk menampung status setiap piksel.

Untuk membuat karakter khusus Anda, Anda bisa pergi ke sini untuk menghasilkan variabel byte untuk karakter Anda. Misalnya, hati:

Salin variabel byte ke kode Anda (sebelum setup( ) ). Anda bisa menyebutnya heart :

byte heart[8] = {
  0b00000,
  0b01010,
  0b11111,
  0b11111,
  0b11111,
  0b01110,
  0b00100,
  0b00000
};

Kemudian, di setup( ) , buat karakter khusus menggunakan fungsi createChar () . Fungsi ini menerima sebagai argumen lokasi untuk mengalokasikan char dan variabel char sebagai berikut:

lcd.createChar(0, heart);

Kemudian, di loop( ) , atur kursor ke tempat Anda ingin karakter ditampilkan:

lcd.setCursor(0, 0);

Gunakan metode write( ) untuk menampilkan karakter. Lewati lokasi di mana karakter dialokasikan, sebagai berikut:

lcd.write(0);

1 thought on “Cara Menggunakan LCD I2C dengan ESP32 di Arduino IDE (kompatibel dengan ESP8266)”

Leave a Comment

Your email address will not be published. Required fields are marked *

Select the fields to be shown. Others will be hidden. Drag and drop to rearrange the order.
  • Image
  • Description
  • Capacitance
  • Diameter
  • Height
  • Leakage Current
  • Length
  • Max Operating Temperature
  • Min Operating Temperature
  • Operating temp
  • Operating Temperature Range
  • Operation voltage
  • Power Rating
  • Rated current
  • Rated voltage
  • Resistance
  • Resonant freq
  • Sound output
  • Storage temp
  • Tebal
  • Temperature Coefficient
  • Tolerance
  • Tone
  • Voltage Rating
  • Voltage Rating DC
  • Weight
Compare