Menampilkan Text dan Animasi Mata di OLED 0.91"

Selamat datang di website Cosmo!

di artikel ini, kita akan belajar menampilkan text dan animasi mata di OLED 0.91".

Skema Rangkaian

Penjelasan Rangkaian

1. 5V ⮕ Kaki (+) OLED

2. GND ⮕ Kaki (-) OLED

3. D2 ⮕ SDA OLED

4. D1 ⮕ SCK OLED

   
   

Kode Display Text

#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>

#define SCREEN_WIDTH 128
#define SCREEN_HEIGHT 32
#define OLED_RESET -1
#define OLED_ADDR 0x3C

Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);

void setup() {
  Serial.begin(115200);
  if (!display.begin(SSD1306_SWITCHCAPVCC, OLED_ADDR)) {
    Serial.println("Gagal inisialisasi OLED!");
    while (true);
  }

  display.clearDisplay();

  // Baris 1: "Cosmo x IQ+"
  display.setTextSize(1);
  display.setTextColor(WHITE);
  display.setCursor(40, 5);
  display.print("Cosmo x IQ+");

  // Baris 2: "IoT Projects"
  display.setCursor(30, 20);
  display.print("IoT Projects");

  display.display();  // Menampilkan teks ke OLED
}

void loop() {
  // Tidak ada loop karena tampilan statis
}

Penjelasan Kode Display Text

Kode ini menampilkan teks statis di layar OLED 128x32 menggunakan library Adafruit SSD1306. Awalnya, setup() menginisialisasi komunikasi serial dan mengecek apakah layar OLED berhasil diinisialisasi; jika gagal, program akan berhenti dengan pesan error di Serial Monitor. Setelah layar dibersihkan, dua baris teks ditampilkan: "Cosmo x IQ+" pada koordinat (40,5) dan "IoT Projects" pada (30,20), menggunakan ukuran teks 1 dan warna WHITE. Fungsi display.display() memastikan teks ditampilkan, sementara loop() kosong karena tampilan bersifat statis tanpa perubahan.

Kode Display Text

#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>

#define SCREEN_WIDTH 128
#define SCREEN_HEIGHT 32
#define OLED_RESET -1
#define OLED_ADDR 0x3C

Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);

// Posisi dan ukuran mata
int eyeLeftX = 20;
int eyeRightX = 80;
const int eyeY = 10;
const int eyeWidth = 25;
const int eyeHeight = 15;

void drawEyes(bool closed) {
  display.clearDisplay();

  if (closed) {
    // Mata tertutup (garis horizontal pendek)
    display.fillRect(eyeLeftX, eyeY + 4, eyeWidth, 4, WHITE);
    display.fillRect(eyeRightX, eyeY + 4, eyeWidth, 4, WHITE);
  } else {
    // Mata terbuka (kotak penuh)
    display.fillRect(eyeLeftX, eyeY, eyeWidth, eyeHeight, WHITE);
    display.fillRect(eyeRightX, eyeY, eyeWidth, eyeHeight, WHITE);
  }

  display.display();
}

void setup() {
  Serial.begin(115200);
  if (!display.begin(SSD1306_SWITCHCAPVCC, OLED_ADDR)) {
    Serial.println("Gagal inisialisasi OLED!");
    while (true);
  }

  display.clearDisplay();
}

void loop() {
  // Mata terbuka
  drawEyes(false);
  delay(1000); // Tahan terbuka selama 2 detik

  // Mata tertutup (kedipan)
  drawEyes(true);
  delay(300); // Kedipan cepat selama 300ms

  // Mata terbuka lagi
  drawEyes(false);
  delay(1000); // Jeda sebelum loop ulang
}

Penjelasan Kode Animasi Mata

Kode ini membuat animasi mata yang berkedip pada layar OLED 128x32 menggunakan library Adafruit SSD1306. Awalnya, setup() menginisialisasi komunikasi serial dan mengecek apakah layar OLED berhasil diinisialisasi; jika gagal, program akan berhenti dengan pesan error di Serial Monitor. Dalam loop(), fungsi drawEyes() digunakan untuk menggambar dua mata pada koordinat yang telah ditentukan. Jika parameter closed bernilai true, mata ditampilkan sebagai garis horizontal pendek (tertutup); jika false, mata berbentuk kotak penuh (terbuka). Mata akan tetap terbuka selama 1 detik, kemudian berkedip selama 300 ms, lalu kembali terbuka, menciptakan efek kedipan yang berulang.

Video Tutorial

Untuk penjelasan lebih mendalam, tonton tutorial video berikut.

enutup

Kalau ingin belajar lebih banyak tentang IoT, langsung kunjungi YouTube IQ+ dan temukan berbagai tutorial menarik lainnya.