XIAO ESP32-C6 ile Mini OLED Karakter Nasıl Yapılır?

Bu rehberde, yüz ifadeleri değiştiren sevimli bir mini OLED karakteri sıfırdan yapacağız. Daha önce elektronik devre kurmamış olsanız bile her kablonun nereye bağlanacağını, hangi programı yükleyeceğinizi ve kodu karta nasıl göndereceğinizi adım adım göreceksiniz.

1. Gerekli malzemeler

• XIAO ESP32-C6 Geliştirme Kartı — Projenin beynidir.
• 1.3″ 128×64 I2C OLED ekran — Karakterin yüzünü gösterir.
• 3.7 V 180 mAh LiPo pil — Taşınabilir güç kaynağıdır.
• 2 konumlu, 3 bacaklı sürgülü switch — Açma ve kapatma anahtarıdır.
• İnce bağlantı kablosu, havya, lehim teli, USB-C veri kablosu ve isteğe bağlı 3D baskı kutu.

2. Sistem nasıl çalışıyor?

XIAO ESP32-C6, çizilecek yüzü hesaplar ve I2C adlı iki kablolu haberleşme yöntemiyle OLED ekrana gönderir. SDA veri kablosudur; çizim bilgisini taşır. SCL saat kablosudur; verinin hangi ritimde gönderileceğini belirler. VCC ve GND ise ekranın elektrik bağlantılarıdır.

3. Bağlantı şeması

Kırmızı güç, siyah eksi/toprak, yeşil veri ve mavi saat bağlantısını gösterir.

Üç bacaklı switch bağlantısı

Bu anahtarın üç bacağı vardır fakat yalnızca ikisini kullanacağız: orta bacak ve dış bacaklardan biri. Diğer dış bacak boş kalır. Anahtarın açık yönü ters olursa kullandığınız dış bacağı diğer dış bacakla değiştirin.

Lehimleme sırası

1. USB kablosunu ve pili devreden ayırın.
2. Önce OLED’in VCC, GND, SDA ve SCL kablolarını hazırlayın.
3. Bu dört kabloyu tabloya göre XIAO’ya lehimleyin.
4. Pilin artı kablosunu switch’in orta bacağına lehimleyin.
5. Switch’in dış bacaklarından birini XIAO üzerindeki BAT+ pedine bağlayın.
6. Pilin eksi kablosunu XIAO BAT− pedine bağlayın.
7. Açıkta metal kalmaması için ısı ile daralan makaron veya yalıtım kullanın.
8. Kısa devre olmadığını kontrol ettikten sonra pili bağlayın.

4. Kullanacağımız program: Arduino IDE

Arduino IDE, yazdığımız kodu XIAO kartına gönderen ücretsiz programdır. Arduino IDE indirme sayfasından işletim sisteminize uygun sürümü indirip kurun.

ESP32 kart desteğini yükleme

1. Arduino IDE’yi açın.
2. File > Preferences menüsüne girin.
3. Additional Boards Manager URLs alanına şu adresi ekleyin:
   https://espressif.github.io/arduino-esp32/package_esp32_index.json
4. Sol taraftan Boards Manager bölümünü açın.
5. esp32 aratın ve Espressif Systems paketinin 3.0.0 veya daha yeni sürümünü yükleyin.
6. Tools > Board > ESP32 Arduino > XIAO_ESP32C6 seçimini yapın.
7. Kartı USB-C veri kablosuyla bilgisayara bağlayın ve Tools > Port menüsünden görünen bağlantı noktasını seçin.

U8g2 ekran kütüphanesini yükleme

1. Arduino IDE’nin sol tarafındaki Library Manager simgesine tıklayın.
2. Arama kutusuna U8g2 yazın.
3. Oliver Kraus tarafından hazırlanan U8g2 kütüphanesini yükleyin.

5. Önce küçük bir ekran testi yapalım

Büyük animasyon koduna geçmeden önce ekran ve kabloların çalıştığını kontrol etmek işleri kolaylaştırır. Arduino IDE’de File > New Sketch seçin, gelen kodu silin ve aşağıdaki kodu yapıştırın:

#include <Wire.h>
#include <U8g2lib.h>

// Motorobit ekranı için önce SH1106 sürücüsünü deniyoruz.
U8G2_SH1106_128X64_NONAME_F_HW_I2C ekran(U8G2_R0, U8X8_PIN_NONE);

void setup() {
  Wire.begin(D4, D5);       // D4 = SDA, D5 = SCL
  ekran.begin();
  ekran.clearBuffer();
  ekran.setFont(u8g2_font_ncenB14_tr);
  ekran.drawStr(16, 38, "Merhaba!");
  ekran.sendBuffer();
}

void loop() {
  // Yazı ekranda kalacağı için burada işlem yapmıyoruz.
}

Sol üstteki onay işaretine basarak kodu kontrol edin, sonra sağ ok şeklindeki Upload düğmesine basın. Ekranda “Merhaba!” yazıyorsa bağlantılar doğru demektir.

6. Tam animasyon kodu

Aşağıdaki kod ekranın 0x3C ve 0x3D adreslerini kendi bulur; karakteri çizip göz kırpmasını, sağa sola bakmasını ve farklı duygular göstermesini sağlar.

#include <Wire.h>
#include <U8g2lib.h>

// Ekranınız SH1106 ise bu satırı kullanın.
U8G2_SH1106_128X64_NONAME_F_HW_I2C ekran(U8G2_R0, U8X8_PIN_NONE);

// SH1106 ile görüntü gelmezse üstteki satırı yorum yapıp bunu açın:
// U8G2_SSD1306_128X64_NONAME_F_HW_I2C ekran(U8G2_R0, U8X8_PIN_NONE);

enum Duygu {
  NORMAL,
  MUTLU,
  UZGUN,
  SASKIN,
  UYKULU,
  KIZGIN
};

Duygu duygu = NORMAL;
int bakisX = 0;
int hedefBakisX = 0;
bool gozKapali = false;

unsigned long sonrakiGozKirma = 0;
unsigned long gozuAcmaZamani = 0;
unsigned long sonrakiHareket = 0;

// I2C hattında 0x3C veya 0x3D adresini arar.
byte oledAdresiBul() {
  byte olasiAdresler[] = {0x3C, 0x3D};

  for (byte i = 0; i < 2; i++) {
    Wire.beginTransmission(olasiAdresler[i]);
    if (Wire.endTransmission() == 0) {
      return olasiAdresler[i];
    }
  }
  return 0;
}

void gozCiz(int merkezX, int merkezY, bool solGoz) {
  if (gozKapali || duygu == UYKULU) {
    ekran.drawLine(merkezX - 9, merkezY, merkezX + 9, merkezY);
    ekran.drawLine(merkezX - 7, merkezY + 1, merkezX + 7, merkezY + 1);
    return;
  }

  int genislik = 18;
  int yukseklik = 25;

  if (duygu == SASKIN) {
    genislik = 22;
    yukseklik = 30;
  }

  int x = merkezX - genislik / 2 + bakisX;
  int y = merkezY - yukseklik / 2;
  ekran.drawRBox(x, y, genislik, yukseklik, 6);

  // Kızgın yüzde gözlerin üstüne eğik siyah çizgi çizeriz.
  if (duygu == KIZGIN) {
    ekran.setDrawColor(0);
    if (solGoz) ekran.drawTriangle(x - 2, y - 1, x + genislik + 2, y - 1, x + genislik + 2, y + 8);
    else         ekran.drawTriangle(x - 2, y - 1, x + genislik + 2, y - 1, x - 2, y + 8);
    ekran.setDrawColor(1);
  }
}

void agizCiz() {
  switch (duygu) {
    case MUTLU:
      ekran.drawLine(51, 46, 58, 52);
      ekran.drawLine(58, 52, 64, 54);
      ekran.drawLine(64, 54, 70, 52);
      ekran.drawLine(70, 52, 77, 46);
      break;

    case UZGUN:
      ekran.drawLine(51, 55, 58, 49);
      ekran.drawLine(58, 49, 64, 47);
      ekran.drawLine(64, 47, 70, 49);
      ekran.drawLine(70, 49, 77, 55);
      break;

    case SASKIN:
      ekran.drawCircle(64, 51, 7);
      break;

    case UYKULU:
      ekran.drawLine(58, 52, 70, 52);
      break;

    case KIZGIN:
      ekran.drawLine(54, 55, 64, 50);
      ekran.drawLine(64, 50, 74, 55);
      break;

    default:
      ekran.drawLine(58, 52, 70, 52);
      break;
  }
}

void yuzuCiz() {
  ekran.clearBuffer();
  gozCiz(38, 29, true);
  gozCiz(90, 29, false);
  agizCiz();
  ekran.sendBuffer();
}

void setup() {
  Serial.begin(115200);
  delay(300);

  Wire.begin(D4, D5);  // XIAO ESP32-C6: D4 SDA, D5 SCL
  byte adres = oledAdresiBul();

  if (adres == 0) {
    Serial.println("OLED bulunamadi. Kablolari kontrol edin.");
    while (true) delay(1000);
  }

  // U8g2 adresi 8 bit biçiminde istediği için 1 bit sola kaydırıyoruz.
  ekran.setI2CAddress(adres << 1);
  ekran.begin();

  randomSeed(micros());
  sonrakiGozKirma = millis() + random(2000, 6000);
  sonrakiHareket = millis() + random(1500, 4000);

  Serial.print("OLED bulundu. Adres: 0x");
  Serial.println(adres, HEX);
}

void loop() {
  unsigned long simdi = millis();

  // Göz kırpmayı başlat.
  if (!gozKapali && simdi >= sonrakiGozKirma) {
    gozKapali = true;
    gozuAcmaZamani = simdi + 150;
  }

  // 150 milisaniye sonra gözleri yeniden aç.
  if (gozKapali && simdi >= gozuAcmaZamani) {
    gozKapali = false;
    sonrakiGozKirma = simdi + random(2000, 6000);
  }

  // Belirli aralıklarla yeni bir bakış veya duygu seç.
  if (simdi >= sonrakiHareket) {
    if (random(100) < 40) {
      hedefBakisX = random(-5, 6);
    } else {
      duygu = (Duygu)random(0, 6);
      hedefBakisX = 0;
    }
    sonrakiHareket = simdi + random(1500, 4000);
  }

  // Bakışın bir anda sıçramaması için hedefe yavaşça yaklaş.
  if (bakisX < hedefBakisX) bakisX++;
  if (bakisX > hedefBakisX) bakisX--;

  yuzuCiz();
  delay(33);  // Yaklaşık saniyede 30 çizim
}

7. Kodun kolay açıklaması

8. Kodu karta yükleme

1. Arduino IDE’de yeni bir taslak açıp tam kodu yapıştırın.
2. Tools > Board bölümünde XIAO_ESP32C6 seçili olsun.
3. Tools > Port bölümünden kartın bağlantı noktasını seçin.
4. Onay işaretiyle kodu derleyin.
5. Sağ ok düğmesiyle kodu karta yükleyin.
6. Yükleme tamamlandığında ekran birkaç saniye içinde canlanır.

Kart görünmüyorsa USB-C kablonuz yalnızca şarj kablosu olabilir. Veri taşıyan başka bir kablo deneyin. Yükleme başlamıyorsa XIAO üzerindeki BOOT düğmesini basılı tutarken RESET düğmesine bir kez basıp BOOT’u bırakın ve yeniden yükleyin.

9. Sorun giderme

10. 3D baskı kutu kullanacaksanız

İlham aldığımız projenin 3D model dosyaları GitHub’da bulunuyor. Ancak doğrudan baskıya geçmeden önce parçaları ölçün. Bu projedeki OLED kart yaklaşık 35.5 × 33.5 mm, pil yaklaşık 24 × 15.5 × 6.7 mm ve seçilen switch gövdesi yaklaşık 10.5 × 5.5 mm’dir. Orijinal kutunun switch açıklığı daha küçük olabileceği için modeli büyütmeniz gerekebilir.

Sonuç

Artık XIAO ESP32-C6, I2C OLED ekran, küçük LiPo pil ve sürgülü anahtarla çalışan taşınabilir bir mini karakteriniz var. Önce basit “Merhaba!” testi yapmak, ardından tam animasyon koduna geçmek olası bağlantı hatalarını kolayca bulmanızı sağlar.

Projenin kaynak videosu: Building a Tiny OLED Keychain
Örnek kaynak kod: TechTalkies / 123_Keychain
XIAO ESP32-C6 resmi başlangıç rehberi: Seeed Studio Wiki