Cara Memprogram LCD TFT ST7735 Pada ESP32
Posted inESP32 Sensor Tutorial

Cara Memprogram LCD TFT ST7735 Pada ESP32

Posted inESP32, Sensor, Tutorial

LCD TFT ST7735 adalah jenis layar tampilan digital kecil yang sangat populer di kalangan maker dan penggemar elektronika untuk berbagai proyek.Berikut ini adalah code untuk memprogramnya :

#include <Arduino.h>

#include <Adafruit_GFX.h>
#include <Adafruit_ST7735.h>
#include <SPI.h>

#define CS_tft 10
#define RST_tft 9
#define DC_tft 8
Adafruit_ST7735 tft = Adafruit_ST7735(CS_tft, DC_tft, RST_tft);


void set_text_tft(const String& teks, int x, int y) {
tft.setTextSize(1);
tft.setCursor(x, y);
tft.println(teks);
}


void setup()
{
Serial.begin(9600);
tft.initR(INITR_BLACKTAB);
tft.fillScreen(ST7735_BLACK);
tft.setTextColor(ST7735_WHITE);

}
void loop(){
String text = "Halo world");
set_text_tft(text, 10, 50);
delay(2000);
tft.fillRect(10, 50 - 8, text.length() * 6, 10, ST7735_BLACK);


}

Berikut ini adalah penjelasan dari kode di atas :

1. Inklusi Library dan Deklarasi Pin/Objek

C++

#<strong>include</strong> <Arduino.h>

#<strong>include</strong> <Adafruit_GFX.h>    // Library grafis inti dari Adafruit
#<strong>include</strong> <Adafruit_ST7735.h> // Library khusus untuk driver ST7735
#<strong>include</strong> <SPI.h>             // Library untuk komunikasi SPI (Serial Peripheral Interface)

#<strong>define</strong> CS_tft 10   // Pin Chip Select (CS) untuk TFT
#<strong>define</strong> RST_tft 9   // Pin Reset (RST) untuk TFT
#<strong>define</strong> DC_tft 8    // Pin Data/Command (DC) untuk TFT

Adafruit_ST7735 tft = Adafruit_ST7735(CS_tft, DC_tft, RST_tft);
  • #include <Arduino.h>: Ini adalah library standar yang wajib ada di setiap program Arduino.
  • #include <Adafruit_GFX.h>: Ini adalah library grafis inti dari Adafruit. Library ini menyediakan fungsi-fungsi dasar untuk menggambar bentuk geometris (garis, lingkaran, persegi), teks, dan bitmap, yang berlaku untuk berbagai jenis layar yang didukung Adafruit.
  • #include <Adafruit_ST7735.h>: Ini adalah library khusus untuk driver ST7735. Library ini membangun di atas Adafruit_GFX dan menyediakan implementasi spesifik untuk berkomunikasi dan mengendalikan chip ST7735.
  • #include <SPI.h>: ST7735 berkomunikasi melalui SPI. Library ini menyediakan fungsi-fungsi yang diperlukan untuk komunikasi SPI yang efisien antara mikrokontroler dan layar.
  • #define CS_tft 10: Mendefinisikan CS_tft sebagai pin digital 10. Ini adalah pin Chip Select yang digunakan untuk mengaktifkan atau menonaktifkan komunikasi dengan modul TFT.
  • #define RST_tft 9: Mendefinisikan RST_tft sebagai pin digital 9. Ini adalah pin Reset untuk layar TFT.
  • #define DC_tft 8: Mendefinisikan DC_tft sebagai pin digital 8. Ini adalah pin Data/Command yang memberitahu layar apakah data yang dikirim adalah data piksel atau perintah kontrol.
  • Adafruit_ST7735 tft = Adafruit_ST7735(CS_tft, DC_tft, RST_tft);: Ini adalah baris di mana objek layar TFT dibuat.
    • Adafruit_ST7735: Nama kelas dari library.
    • tft: Nama objek yang kita berikan pada layar (ini adalah objek yang akan kita gunakan untuk memanggil semua fungsi layar).
    • Argumen CS_tft, DC_tft, RST_tft adalah pin-pin yang telah kita definisikan sebelumnya untuk mengontrol layar. Pin SPI lainnya (SCK dan MOSI) biasanya sudah default pada pin SPI hardware Arduino (misalnya pin 13 dan 11 pada Uno).

2. Fungsi set_text_tft()

C++

void set_text_tft(const String& teks, int x, int y) {
  tft.setTextSize(1);    // Mengatur ukuran teks menjadi 1 (ukuran default paling kecil)
  tft.setCursor(x, y);   // Mengatur posisi kursor (x, y) tempat teks akan mulai ditulis
  tft.println(teks);     // Menulis teks ke layar dan menambahkan baris baru setelahnya
}
  • Ini adalah fungsi kustom yang Anda buat untuk menyederhanakan proses penulisan teks ke layar.
  • const String& teks: Argumen ini menerima sebuah String yang akan ditampilkan. Penggunaan const String& adalah cara efisien untuk meneruskan string tanpa menyalinnya, menghemat memori.
  • int x, int y: Argumen ini menentukan koordinat piksel (X, Y) di mana teks akan dimulai. Titik (0,0) biasanya adalah sudut kiri atas layar.
  • tft.setTextSize(1);: Mengatur ukuran teks. Ukuran 1 adalah ukuran font paling dasar (sekitar 6×8 piksel per karakter). Jika Anda mengaturnya ke 2, teks akan menjadi dua kali lebih besar, dan seterusnya.
  • tft.setCursor(x, y);: Menentukan posisi piksel awal di mana teks akan mulai ditulis.
  • tft.println(teks);: Menulis string teks ke layar pada posisi kursor yang ditentukan. println berarti setelah teks ditulis, kursor akan pindah ke baris baru, siap untuk teks berikutnya.

3. Fungsi setup()

C++

void setup()
{
  Serial.begin(9600);           // Menginisialisasi komunikasi serial untuk debugging
  tft.initR(INITR_BLACKTAB);    // Menginisialisasi layar ST7735
  tft.fillScreen(ST7735_BLACK); // Mengisi seluruh layar dengan warna hitam
  tft.setTextColor(ST7735_WHITE); // Mengatur warna teks default menjadi putih
}
  • Serial.begin(9600);: Menginisialisasi komunikasi serial untuk debugging pada baud rate 9600.
  • tft.initR(INITR_BLACKTAB);: Ini adalah perintah inisialisasi utama untuk layar ST7735.
    • initR(): Adalah salah satu metode inisialisasi yang disediakan oleh library Adafruit_ST7735.
    • INITR_BLACKTAB: Ini adalah argumen yang spesifik untuk jenis tab (PCB konektor) dan mode warna layar ST7735 tertentu. Ada beberapa varian ST7735 (misalnya, dengan tab merah, hijau, atau hitam), dan setiap varian mungkin memerlukan mode inisialisasi yang sedikit berbeda untuk menampilkan warna dengan benar. INITR_BLACKTAB digunakan untuk modul dengan tab berwarna hitam.
  • tft.fillScreen(ST7735_BLACK);: Mengisi seluruh area layar dengan warna hitam. Ini efektif membersihkan layar. ST7735_BLACK adalah konstanta warna yang didefinisikan dalam library.
  • tft.setTextColor(ST7735_WHITE);: Mengatur warna default untuk teks yang akan ditulis ke layar menjadi putih. ST7735_WHITE juga merupakan konstanta warna.

4. Fungsi loop()

C++

void loop(){
  String text = "Halo world";
  set_text_tft(text, 10, 50); // Menampilkan teks "Halo world" pada koordinat (10, 50)
  delay(2000);               // Menunda eksekusi selama 2 detik (2000 milidetik)
  // Menghapus teks yang baru saja ditampilkan dengan menggambarnya ulang menggunakan warna latar belakang
  tft.fillRect(10, 50 - 8, text.length() * 6, 10, ST7735_BLACK);
}
  • String text = "Halo world";: Mendeklarasikan dan menginisialisasi variabel String bernama text dengan nilai “Halo world”.
  • set_text_tft(text, 10, 50);: Memanggil fungsi kustom set_text_tft untuk menampilkan “Halo world” di layar, dimulai dari koordinat (10, 50).
  • delay(2000);: Program akan berhenti di sini selama 2 detik. Selama penundaan ini, teks “Halo world” akan tetap terlihat di layar.
  • tft.fillRect(10, 50 - 8, text.length() * 6, 10, ST7735_BLACK);: Ini adalah cara untuk menghapus teks yang sebelumnya ditampilkan.
    • tft.fillRect(): Fungsi untuk menggambar persegi panjang yang terisi.
    • 10: Koordinat X awal (sama dengan posisi teks).
    • 50 - 8: Koordinat Y awal. Pengurangan 8 piksel dilakukan karena teks biasanya ditulis dari sudut kiri bawah karakter, sehingga untuk menutupi seluruh teks, Anda perlu memulai sedikit di atas posisi Y teks. (Tinggi font ukuran 1 umumnya 8 piksel).
    • text.length() * 6: Lebar persegi panjang. text.length() memberikan jumlah karakter dalam string. Karena setiap karakter font ukuran 1 memiliki lebar 6 piksel, mengalikannya dengan 6 memberikan lebar total teks.
    • 10: Tinggi persegi panjang. Ini adalah tinggi yang cukup untuk menutupi satu baris teks.
    • ST7735_BLACK: Warna persegi panjang. Dengan menggambar persegi panjang berwarna hitam (sesuai warna latar belakang), teks putih yang ada di area tersebut akan tertutup dan terlihat seperti terhapus.

Cara Kerja Keseluruhan

Secara sederhana, kode ini melakukan hal berikut:

  1. Persiapan (setup): Menginisialisasi layar TFT, membersihkannya menjadi hitam, dan mengatur warna teks default menjadi putih.
  2. Pengulangan (loop):
    • Menampilkan teks “Halo world” di posisi (10, 50).
    • Menunggu selama 2 detik.
    • Menghapus teks tersebut dengan menggambar persegi panjang hitam di atasnya.
    • Loop kemudian berulang, menampilkan teks lagi, menunggu, dan menghapusnya, menciptakan efek “berkedip” atau “muncul-menghilang” untuk teks tersebut.

Penting:

  • Koneksi Pin: Pastikan pin CS, RST, dan DC dari modul ST7735 Anda terhubung ke pin 10, 9, dan 8 Arduino secara berurutan. Pin SCK dan MOSI (atau SDA/SCL tergantung modul) juga harus terhubung ke pin SPI hardware Arduino Anda (biasanya pin 13 dan 11 pada Uno).
  • Tipe Tab: Jika layar Anda tidak menampilkan warna dengan benar atau hanya putih/hitam, coba ganti INITR_BLACKTAB dengan INITR_REDTAB atau INITR_GREENTAB (atau varian lain yang mungkin didukung library) yang sesuai dengan warna tab PCB pada modul ST7735 Anda.

untuk diskusi bisa kontak dibawah ini :

Sosial media :

Apa itu ESP32?