Small plastic project enclosure with a 0.96 inch OLED display showing home status icons, mounted near an entryway

ผู้เริ่มต้น

สร้างหน้าจอแสดงสถานะบ้าน

จอแสดงผลIoT

หน้าจอขนาดเล็กที่แสดงเฉพาะสิ่งที่คุณสนใจ — สร้างบอร์ดสถานะที่ยืดหยุ่นของคุณเอง และเลือกได้ว่าจะให้ติดตามอะไรบ้าง

รวมชิ้นส่วนจริง 6 รายการ

ราคารวมชุดนี้: 1,569.00 ฿

ยังไม่รวมส่วนลดคำสั่งซื้อที่คุณอาจได้รับตอนชำระเงิน

สิ่งที่คุณต้องใช้

เป้าหมายของโครงการ

โครงการนี้สร้างจอแสดงผลสถานะขนาดเล็กที่ยืดหยุ่นได้: หน้าจอที่แสดงสิ่งที่คุณสนใจในขณะนี้เสมอ ฮาร์ดแวร์นั้นเรียบง่ายโดยเจตนา – ตัวควบคุมและหน้าจอ – เนื่องจากงานออกแบบที่แท้จริงเกิดขึ้นในโค้ดของคุณเอง ในการตัดสินใจของคุณเกี่ยวกับความหมายของ "สถานะ" และวิธีการแสดงผล เมื่อสร้างเสร็จแล้ว การตั้งค่าทางกายภาพเดียวกันนี้สามารถนำไปใช้กับแนวคิดสถานะต่างๆ ได้มากมายเพียงแค่เปลี่ยนตรรกะที่ป้อนเข้า

ตัวควบคุมทำอะไร

ESP32-C3 คือสมองของอุปกรณ์ หน้าที่หลักของมันคือการนำค่า "สถานะ" ใดก็ตามที่มันถืออยู่และตัดสินใจว่าจะแสดงอะไรบนจอแสดงผลเพื่อตอบสนอง – ไอคอน, คำ, ตัวเลข หรือรูปทรงเรขาคณิต ค่าสถานะนั้นสามารถมาจากที่ใดก็ได้ที่คุณเลือก: การอ่านค่าเซ็นเซอร์ที่เหลือจากโครงการอื่น, ค่าที่คุณสลับด้วยตนเองขณะทดสอบ หรือเมื่อคุณคุ้นเคยกับบอร์ดแล้ว ค่าที่ดึงผ่าน Wi-Fi จากคำขอเว็บง่ายๆ ที่คุณเขียนเอง ตัวควบคุมไม่สนใจว่าค่ามาจากที่ใด – มันสนใจแค่การจับคู่ระหว่างค่านั้นกับสิ่งที่ปรากฏบนหน้าจอ

จอแสดงผลทำอะไร

OLED ขนาด 0.96 นิ้วไม่มีตรรกะของตัวเอง – เป็นอุปกรณ์เอาต์พุตแบบ "โง่" ที่แสดงผลตามที่ได้รับคำสั่งและไม่มีอะไรมากไปกว่านั้น นี่คือสิ่งสำคัญที่ต้องทำความเข้าใจตั้งแต่แรก: "ความฉลาด" ทั้งหมดของโครงการนี้อยู่ในโค้ดของตัวควบคุม ไม่ได้อยู่ในหน้าจอ งานออกแบบที่แท้จริงในโครงการเช่นนี้คือการตัดสินใจจับคู่ระหว่างสถานะอินพุตกับสิ่งที่แสดงจริง เนื่องจากจอแสดงผลจะแสดงผลตามที่การจับคู่นั้นผลิตออกมา ไม่ว่าจะถูกต้องหรือไม่

การเชื่อมต่อ OLED ผ่าน I2C

OLED นี้สื่อสารผ่าน I2C ซึ่งเป็นบัสสองสาย (SDA สำหรับข้อมูล, SCL สำหรับนาฬิกา) ที่ช่วยให้อุปกรณ์หลายตัวใช้สองพินเดียวกันได้โดยแต่ละตัวตอบสนองต่อที่อยู่ของตัวเอง บนเบรดบอร์ด นั่นหมายความว่าต้องการเพียงสี่การเชื่อมต่อ: พลังงาน, กราวด์, SDA และ SCL เนื่องจาก I2C เป็นบัสที่ใช้ร่วมกัน เซ็นเซอร์ใดๆ ที่คุณเพิ่มเข้ามาในอนาคตจะต้องใช้ที่อยู่ I2C ที่แตกต่างจากจอแสดงผล ไม่เช่นนั้นอุปกรณ์ทั้งสองจะขัดแย้งกันเมื่อตัวควบคุมพยายามสื่อสารกับพวกมัน รักษาการเดินสายไฟและกราวด์ให้มั่นคงบนรางเบรดบอร์ด – การเชื่อมต่อกราวด์ที่หลวมเป็นหนึ่งในสาเหตุที่พบบ่อยที่สุดที่ทำให้จอแสดงผลกะพริบหรือหยุดตอบสนองเป็นระยะๆ

แนวคิดซอฟต์แวร์และไลบรารี

โครงสร้างทั่วไปสำหรับการสร้างนี้คือลูปง่ายๆ: อ่านค่าสถานะปัจจุบัน, ตัดสินใจว่าจะแสดงอะไรสำหรับค่านั้น, ล้างบัฟเฟอร์หน้าจอ, วาดเนื้อหาใหม่ และส่งไปยังหน้าจอ – จากนั้นทำซ้ำ ไลบรารีจอแสดงผล OLED มาตรฐาน (เช่น ไลบรารีที่สร้างขึ้นรอบๆ ไดรเวอร์ SSD1306 ที่จอแสดงผลประเภทนี้มักใช้) จะจัดการการวาดพิกเซลและข้อความระดับต่ำเพื่อให้โค้ดของคุณเพียงแค่ตัดสินใจว่าจะวาดอะไร ไม่ใช่ว่าจะวาดอย่างไร การจับคู่ระหว่างค่าสถานะและเนื้อหาหน้าจอควรเก็บไว้เป็นรายการค้นหาเดียวที่จัดระเบียบอย่างชัดเจน แทนที่จะกระจัดกระจายไปทั่วโค้ด เนื่องจากส่วนนั้นเป็นส่วนที่คุณมักจะต้องการเปลี่ยนแปลงหรือขยาย Wi-Fi ในตัวของ ESP32-C3 ไม่ได้ใช้ในการสร้างพื้นฐานนี้ แต่เป็นจุดเริ่มต้นที่ดีสำหรับอัปเกรดในอนาคตที่ค่าสถานะมาจากเครือข่ายแทนที่จะเป็นค่าคงที่หรือค่าที่ตั้งด้วยตนเอง

การทดสอบและแก้ไขปัญหา

  • หน้าจอว่างเปล่า – ตรวจสอบพื้นฐานการเดินสาย I2C เช่นเดียวกับการสร้างที่ใช้ OLED อื่นๆ: ตรวจสอบว่าไฟและกราวด์ถึงหน้าจอ, ที่อยู่ I2C ในโค้ดตรงกับที่อยู่จริงของหน้าจอ และไม่มีความขัดแย้งกับอุปกรณ์อื่นที่ใช้บัส I2C เดียวกัน
  • สถานะที่แสดงไม่เคยเปลี่ยน – ยืนยันว่าลูปโค้ดตรวจสอบค่าสถานะอีกครั้งและวาดใหม่ทุกครั้ง แทนที่จะวาดเพียงครั้งเดียวเมื่อบอร์ดบูตแล้วหยุด
  • ไอคอนหรือข้อความผิดปรากฏขึ้นสำหรับสถานะที่กำหนด – ตรวจสอบตรรกะการจับคู่ระหว่างค่าอินพุตของคุณกับสิ่งที่แสดง; เงื่อนไขที่เรียงลำดับผิดเพียงรายการเดียวเป็นสาเหตุที่พบบ่อยที่สุด
  • หน้าจอแสดงกราฟิกที่ผิดเพี้ยนหรือทับซ้อนกัน – ตรวจสอบให้แน่ใจว่าโค้ดล้างบัฟเฟอร์หน้าจอก่อนที่จะวาดเนื้อหาใหม่ในแต่ละรอบ แทนที่จะวาดเนื้อหาใหม่ทับเนื้อหาเก่า

การอัปเกรดเสริมในอนาคต: สถานะที่เชื่อมต่อ Wi-Fi

วิทยุ Wi-Fi ในตัวของ ESP32-C3 ไม่ได้ถูกใช้ในการสร้างพื้นฐาน แต่มันเป็นขั้นตอนต่อไปตามธรรมชาติเมื่อหน้าจอและตรรกะการจับคู่ทำงานได้อย่างน่าเชื่อถือ เวอร์ชันในอนาคตสามารถเชื่อมต่อกับเครือข่าย Wi-Fi ของคุณและดึงค่าเป็นระยะจากคำขอเว็บง่ายๆ ที่คุณเขียนและโฮสต์เอง แทนที่ค่าสถานะที่ตั้งด้วยตนเองหรือที่ได้จากเซ็นเซอร์ด้วยค่าแบบสด สิ่งนี้ทำให้ฮาร์ดแวร์และตรรกะการแสดงผลไม่เปลี่ยนแปลงอย่างสมบูรณ์ – มีเพียงแหล่งที่มาของค่าสถานะเท่านั้นที่เปลี่ยนแปลง

การเดินสายไฟ

  • OLED VCC → ESP32-C3 SuperMini 3.3V
  • OLED GND → ESP32-C3 SuperMini GND
  • OLED SDA → ESP32-C3 SuperMini GPIO8 — ข้อมูล I2C (ค่าเริ่มต้น)
  • OLED SCL → ESP32-C3 SuperMini GPIO9 — นาฬิกา I2C (ค่าเริ่มต้น)

ไม่มีเซ็นเซอร์ในรายการส่วนประกอบของการสร้างนี้ ดังนั้นโค้ดด้านล่างจึงเป็นเทมเพลตที่แท้จริงและสามารถรันได้: มันเชื่อมต่อกับ Wi-Fi โดยใช้วิทยุในตัวของ ESP32-C3 และแสดงสถานะการเชื่อมต่อจริง (`WiFi.status()`, SSID, ที่อยู่ IP) แทนที่จะเป็นการรวมระบบคลาวด์ที่สร้างขึ้น จากนั้นวนรอบอาร์เรย์ตัวอย่างของบรรทัด "สถานะ" ที่คุณตั้งใจจะแทนที่ด้วยสิ่งที่คุณต้องการแสดงจริง (สถานะเปิด/ปิด, การแจ้งเตือน, ตัวนับ ฯลฯ) เชื่อมต่อข้อมูลในอนาคตของคุณเอง (เซ็นเซอร์อื่น, ปุ่ม, ค่าที่ดึงมาจากเซิร์ฟเวอร์ของคุณเอง) เข้ากับตรรกะ `statusLines` เมื่อคุณตัดสินใจว่า "สถานะบ้าน" มีความหมายอย่างไรสำหรับการตั้งค่าของคุณ

แผนภาพการต่อสาย

VCC → 3.3V GND SDA → GPIO8 SCL → GPIO9 ESP32-C3 SuperMini OLED

โค้ดเริ่มต้น

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

#define SDA_PIN 8
#define SCL_PIN 9

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

// Replace with your own network credentials
const char* WIFI_SSID = "YOUR_WIFI_SSID";
const char* WIFI_PASSWORD = "YOUR_WIFI_PASSWORD";

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

// Example status lines — swap these for whatever you actually want to show
const char* statusLines[] = {
  "All Systems Normal",
  "Front Door: Closed",
  "Last Check: OK"
};
const int NUM_STATUS_LINES = 3;
int currentLine = 0;
unsigned long lastSwitch = 0;
const unsigned long SWITCH_INTERVAL_MS = 3000;

void showConnecting() {
  display.clearDisplay();
  display.setTextSize(1);
  display.setTextColor(SSD1306_WHITE);
  display.setCursor(0, 0);
  display.println("Connecting to WiFi...");
  display.display();
}

void showStatusScreen() {
  display.clearDisplay();
  display.setTextSize(1);
  display.setTextColor(SSD1306_WHITE);
  display.setCursor(0, 0);

  if (WiFi.status() == WL_CONNECTED) {
    display.println(WiFi.SSID());
    display.println(WiFi.localIP());
  } else {
    display.println("WiFi: disconnected");
  }

  display.drawLine(0, 18, SCREEN_WIDTH, 18, SSD1306_WHITE);

  display.setTextSize(1);
  display.setCursor(0, 28);
  display.println(statusLines[currentLine]);

  display.display();
}

void setup() {
  Serial.begin(115200);
  Wire.begin(SDA_PIN, SCL_PIN);

  if (!display.begin(SSD1306_SWITCHCAPVCC, OLED_ADDR)) {
    Serial.println("OLED not found — check wiring.");
    while (1) delay(1000);
  }

  showConnecting();
  WiFi.begin(WIFI_SSID, WIFI_PASSWORD);

  unsigned long startAttempt = millis();
  while (WiFi.status() != WL_CONNECTED && millis() - startAttempt < 15000) {
    delay(500);
  }

  showStatusScreen();
}

void loop() {
  if (millis() - lastSwitch > SWITCH_INTERVAL_MS) {
    lastSwitch = millis();
    currentLine = (currentLine + 1) % NUM_STATUS_LINES;
    showStatusScreen();
  }
}

ไม่แน่ใจขั้นตอนไหน? ถามเรา