OLED дисплей SSD1306
Подключите OLED дисплей по протоколу I2C и выводите текст, графику и данные с датчиков прямо на экран.
Подготовка оборудования
ESP32 DevKit
Любая версия (30/38 пинов)
OLED SSD1306
0.96" 128×64 px, I2C интерфейс
Провода Dupont
4 штуки «мама-мама»
Макетная плата
Необязательно при прямом подключении
Что такое I2C и OLED
Протокол I2C
I2C (Inter-Integrated Circuit) — двухпроводной протокол связи. Позволяет подключать множество устройств, используя всего два провода: SDA (данные) и SCL (тактирование).
SDA
GPIO 21 на ESP32
SCL
GPIO 22 на ESP32
На одной шине I2C можно разместить до 127 устройств одновременно — каждое имеет свой уникальный адрес.
Дисплей SSD1306
Дисплей использует технологию OLED — каждый пиксель светится самостоятельно. Глубокий чёрный, высокий контраст, нет подсветки.
Схема подключения
VCC Питание OLED → 3.3V ESP32
GND Земля OLED → GND ESP32
SDA Данные OLED → GPIO 21 ESP32
SCL Тактирование OLED → GPIO 22 ESP32
Адрес I2C дисплея
Большинство SSD1306 имеют адрес 0x3C. Если дисплей не определяется, попробуйте адрес 0x3D. Можно использовать I2C-сканер для определения адреса.
Установка библиотек
Для работы с SSD1306 потребуется библиотека от Adafruit. Установите обе через менеджер библиотек Arduino IDE:
Adafruit SSD1306
Основной драйвер дисплея
ОбязательноAdafruit GFX Library
Графические примитивы (текст, фигуры)
Обязательно// Arduino IDE → Sketch → Include Library → Manage Libraries...
// Поиск: "SSD1306" → установить "Adafruit SSD1306"
// Поиск: "GFX" → установить "Adafruit GFX Library"
Код: I2C сканер
Перед работой с дисплеем рекомендуется запустить I2C сканер — он найдёт адреса всех подключённых I2C устройств:
// I2C Сканер — найдёт адрес вашего дисплея
#include <Wire.h>
void setup() {
Wire.begin();
Serial.begin(115200);
Serial.println("Сканирование I2C...");
for (byte addr = 1; addr < 127; addr++) {
Wire.beginTransmission(addr);
if (Wire.endTransmission() == 0) {
Serial.print("Устройство найдено: 0x");
Serial.println(addr, HEX);
}
}
}
void loop() {}
Код: Вывод текста на дисплей
#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
// Параметры дисплея
#define SCREEN_WIDTH 128
#define SCREEN_HEIGHT 64
#define OLED_RESET -1 // -1 если нет пина Reset
#define OLED_ADDRESS 0x3C
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);
void setup() {
Serial.begin(115200);
// Инициализация дисплея
if (!display.begin(SSD1306_SWITCHCAPVCC, OLED_ADDRESS)) {
Serial.println("Дисплей не найден!");
while (true);
}
display.clearDisplay(); // Очистить буфер
// Заголовок
display.setTextSize(2); // Размер текста x2
display.setTextColor(SSD1306_WHITE);
display.setCursor(10, 0);
display.println("VIBE");
// Подзаголовок
display.setTextSize(1); // Размер текста x1
display.setCursor(0, 24);
display.println("ESP32 + OLED");
display.setCursor(0, 36);
display.println("Hello, World!");
// Разделительная линия
display.drawLine(0, 50, 128, 50, SSD1306_WHITE);
display.display(); // Показать буфер на экране
}
void loop() {}clearDisplay() Очищает буфер. Нужно вызывать перед перерисовкой
display() Отправляет буфер на экран. Без него ничего не появится!
setTextSize(n) Размер шрифта: 1 = 6×8px, 2 = 12×16px, 3 = 18×24px
Код: Динамический счётчик
Выводим на дисплей счётчик, который обновляется каждую секунду — типичный паттерн для отображения данных с датчиков:
#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#define SCREEN_WIDTH 128
#define SCREEN_HEIGHT 64
#define OLED_RESET -1
#define OLED_ADDRESS 0x3C
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);
int counter = 0;
void setup() {
display.begin(SSD1306_SWITCHCAPVCC, OLED_ADDRESS);
display.clearDisplay();
display.setTextColor(SSD1306_WHITE);
}
void loop() {
display.clearDisplay();
// Метка
display.setTextSize(1);
display.setCursor(30, 10);
display.println("Счётчик:");
// Большое число по центру
display.setTextSize(3);
display.setCursor(40, 30);
display.println(counter);
display.display(); // Показать на экране
counter++;
delay(1000); // Обновление раз в секунду
}Графические функции
drawPixel(x, y, color) Рисует отдельный пиксель
drawLine(x0,y0,x1,y1) Линия между двумя точками
drawRect(x,y,w,h) Прямоугольник (контур)
fillRect(x,y,w,h) Прямоугольник (заливка)
drawCircle(x,y,r) Окружность по центру и радиусу
fillCircle(x,y,r) Круг с заливкой
drawTriangle(...) Треугольник по 3 точкам
drawBitmap(...) Вывод изображения 1-bit
invertDisplay(true) Инверсия всех пикселей
Цех Испытаний
Отточите мастерство на реальных кейсах. Каждая карта — это шаг к полному пониманию OLED дисплея.
Hello World
Первый вывод текста. Учимся инициализировать дисплей и выводить одну строку.
Выведите слово 'ПРИВЕТ!' точно по центру экрана 128×64. Используйте setTextSize(2) — высота символа 16px. Установите курсор: setCursor(14, 24) для горизонтального центра. Текст должен отображаться белым на чёрном фоне сразу после включения.
Счётчик
Динамическое обновление данных. Создаём живой счётчик с подписью.
Выводите число от 0 до 30, увеличивая на 1 каждую секунду. Число — шрифт setTextSize(4), выровненное по центру (setCursor(44, 10)). Под числом, шрифтом setTextSize(1), выводите слово 'секунд' (setCursor(44, 50)). После 30 — сброс на 0.
Прогресс-бар
Графический примитив. Рисуем заполняющийся прямоугольник.
Анимируйте прогресс-бар от 0% до 100% за ровно 10 секунд (шаг 1% каждые 100мс). Рамка: drawRect(0, 48, 128, 12, WHITE). Заполнение: fillRect(2, 50, map(pct,0,100,0,124), 8, WHITE). По центру вверху — текущий процент: setTextSize(2), setCursor(44, 20), вывод String(pct)+"%".
Метеостанция
Интеграция датчика DHT22. Читаем реальные данные и красиво отображаем.
Подключите DHT22 к GPIO 4. На дисплее выводите 2 строки шрифтом setTextSize(2): строка 1 (setCursor(0,0)) — 'Т: XX.X C', строка 2 (setCursor(0,32)) — 'В: XX.X %'. Обновление каждые 2 секунды. Если датчик не отвечает — выводите 'Ошибка!' и ждите 3 секунды.
Бегущая строка
Анимация смещения. Текст шире экрана движется справа налево бесконечно.
Реализуйте бегущую строку с текстом 'VIBE BOARDS — ESP32 OLED —' (ширина ~220px при setTextSize(2)). Текст стартует с позиции x=128 и движется влево со скоростью 2px за кадр. Когда правый край строки уходит левее x=0 — сброс на x=128. Задержка между кадрами: 20мс.
Свой Проект
Создайте свою уникальную модель в онлайн-симуляторе. Ограничений нет!
Частые проблемы
❌ Дисплей не инициализируется
✅ Проверьте адрес I2C (0x3C или 0x3D). Запустите I2C сканер. Убедитесь что VCC подключён к 3.3V, а не 5V.
❌ Пустой экран после display()
✅ Вызывайте clearDisplay() перед рисованием, а display() строго после всех draw-функций.
❌ Текст частично обрезается
✅ Проверьте координаты setCursor() — начало текста не должно выходить за 0–127 по X и 0–63 по Y.
❌ Дисплей работает нестабильно
✅ Добавьте подтягивающие резисторы 4.7 кОм на линии SDA и SCL к 3.3V, если ваш модуль их не включает.
🎉 Урок завершён!
Теперь вы умеете работать с I2C и выводить информацию на OLED дисплей
Что вы изучили:
- ✓ Протокол I2C и его преимущества
- ✓ Подключение OLED SSD1306 к ESP32
- ✓ Вывод текста разных размеров
- ✓ Рисование геометрических фигур
- ✓ Динамическое обновление экрана
- ✓ Диагностику I2C устройств
Следующий шаг:
🔌Урок 10: Реле
Управление мощными нагрузками с ESP32