Подключение OLED дисплея к Arduino и ESP8266
Использование различных OLED-дисплеев с Arduino и ESP8266. Разбор функций, подключение к Arduino и ESP8266, обзор библиотек для Arduino IDE
Подключение OLED дисплея к Arduino и ESP8266
29.02.2024 в 12:40   2825 0
Версия для печати

Подключение OLED дисплея к Arduino и ESP8266

logo

В этой статье мы рассмотрим, как использовать различные OLED-дисплеи  с Arduino и ESP8266. Разберем  некоторые их  функции, узнаем как подключить к платам Arduino и ESP8266, а также как писать текст, рисовать фигуры и отображать растровые изображения. 

Обзор модулей Oled дисплея

OLED-дисплеи доступны в различных размерах (например, 128 × 64, 128 × 32) и цветах (например, белый, синий и двухцветные OLED-дисплеи). Некоторые OLED-дисплеи имеют интерфейс I2C, в то время как другие имеют интерфейс SPI. Расcмотрим самые популярные и распространенные модули

Oled 0.96' SSD1306

oled 0.96

Самый распространенный и популярный вид OLED дисплеев. Обладает следующими техническими характеристиками:

  • Разрешение экрана: 128x64
  • Угол обзора: 160°
  • Энергопотребление: 0.08 Вт
  • Напряжение питания 3.3В - 5В
  • Диапазон рабочих температур: от -30 до 70 °С 
  • Размеры: 35,4 мм * 33,5 мм * 4,3 мм
  • Чип: SSD1306
  • Количество цветов: 1 или 2
  • Интерфейс I2C или SPI

Для работы в Arduino IDE используется библиотека Adafruit SSD1306. Существует 2 основных модификации данного дисплея. С I2C и SPI интерфейсом. SPI работает быстрее, но требует больше проводов для подключения. Для I2C необходимо 4 провода, для SPI - 7. Данный дисплей является монохромным. Цвет экранных светодиодов можно выбрать при покупке. Вариант с 2 цветами подсветки отличается лишь тем, что на какой-то части экрана установлен ряд светодиодов другого цвета. То есть выбрать произвольный цвет для любой части экрана нельзя.

Oled 0.91' SSD1306 

128x32

Модификация предыдущей версии дисплея. Обладает следующими техническими характеристиками:

  • Разрешение экрана: 128x32
  • Угол обзора: 160°
  • Энергопотребление: 0.08 Вт
  • Напряжение питания 3.3В - 5В
  • Диапазон рабочих температур: от -30 до 70 °С 
  • Размеры: 38 мм * 12 мм * 2,6 мм
  • Чип: SSD1306
  • Количество цветов: 1 или 2
  • Интерфейс I2C

Работает на том же чипе SSD1306 и для работы в Arduino IDE используется та же библиотека Adafruit SSD1306. Имеет меньшие габаритные размеры и разрешение экрана всего 128x32. Интерфейс подключения только I2C. Других отличий оn OLED 0.96 нет.

OLED  1.5' SH1107

sh1107
Очень похож на предыдущие модели, но имеет несколько другой форм-фактор и габариты. Также управляется другим чипом. Иммет следующие технические характеристики.

  • Разрешение экрана: 128x128
  • Угол обзора: 160°
  • Энергопотребление: 0.2 Вт
  • Напряжение питания 3В - 5В
  • Диапазон рабочих температур: от -30 до 70 °С 
  • Размеры: 34 мм * 47 мм * 11,3 мм
  • Чип: SH1107
  • Количество цветов: 1
  • Интерфейс I2C или SPI
Работает на чипе SH1107, также имеется огромное количество модификаций размеров и разрешения экрана. Для работы в Arduino IDE используется библиотека Adafruit SH110x. Особых отличий в использовании и работе с чипом SSD130x не заметил, Но с большими диагоналями экрана модели на чипе SH110x распространены больше.

Распределение памяти OLED дисплея

Для управления дисплеем важно понимать распределение памяти OLED-дисплея.

Независимо от размера диагонали дисплея, драйвер SSD1306 включает в себя оперативную память с данными графического дисплея объемом 1 КБ (GDDRAM), в которой хранится битовый шаблон для отображения на экране. Эта область памяти объемом 1 КБ разделена на 8 страниц (от 0 до 7). Каждая страница содержит 128 столбцов / сегментов (блок от 0 до 127). И каждый столбец может хранить 8 бит данных (от 0 до 7). То есть в итоге мы имеем:

8 страниц x 128 сегментов x 8 бит данных = 8192 бита = 1024 байта = 1 КБ памяти

Ниже выделена вся память объемом 1 КБ, включая страницы, сегменты и данные.

page memory

Каждый бит представляет один OLED-пиксель на экране, который можно включать или выключать программно.
Необходимо уточнить, что независимо от размера OLED-модуля, каждый модуль содержит 1 КБ оперативной памяти. OLED-модуль 128 × 64 отображает все содержимое 1 КБ ОЗУ (все 8 страниц), тогда как OLED-модуль 128 × 32 отображает только половину содержимого ОЗУ (первые 4 страницы).

SH1107 более продвинутый чип в этом отношении. Он уже содержит 2 кб оперативной памяти и максимальное разрешение экрана у него может достигать уже 128x128 пикселей.   В остальном система распределения памяти у него схожа с SSD1306, но страниц памяти уже 16

Подключение OLED дисплея к микроконтроллеру

В данной статье будет рассмотрено подключение Arduino Nano и Wemos D1 Mini к модулю Oled дисплея только по I2C интерфейсу. Для подключения по SPI требуется в 2 раза больше свободных пинов и для данного типа дисплеев его использование нецелесообразно

Подключение достаточно просто. Начните с подключения вывода VCC к выходу 3,3 В Arduino или Wemos D1 Mini, а вывод GND - к выводу GND соответственно

Наконец, подключите контакты SCL и SDA к контактам A5 и A4 Arduino Nano (или контактам D1 и D2 Wemos D1 mini) соответственно.

В итоге у вас должна получиться следующая схема подключения для Arduino Nano

arduino

Для Wemos D1 Mini

wemos

Расположение выводов SDA И SCL других микроконтроллеров семейства Arduino вы можете узнать в этой статье, а семейства ESP8266 в этой.

Библиотеки Adafruit SSD1306 и AdafruitGFX

Контроллер SSD1306 OLED-дисплея имеет гибкие, но сложные драйверы. Для полноценного использования контроллера SSD1306 требуются обширные знания в области адресации памяти. К счастью, существует библиотека Adafruit SSD1306 , которая позволят нам управлять дисплеем с помощью простых команд. Для контроллера SH1107 существует своя библиотека  - Adafruit SH110x. Так как обе библиотеки были созданы одним разработчиком, то и синтаксис команд у них практически не отличается. Поэтому, несмотря на то, что в данной статье все примеры будут  для библиотеки Adafruit SSD1306, они вполне применимы и для библиотеки Adafruit SH110x.
Следует отметить, что это аппаратно-ориентированные библиотеки, которые обрабатывает функции более низкого уровня. Для отображения графических примитивов, таких как точки, линии, круги и прямоугольники, они должны использоваться совместно с библиотекой Adafruit GFX.  Также  Adafruit SSD1306 использует библиотеку ввода-вывода Adafruit Bus так что для нормальном работы необходима и она.

Данные библиотеки можно установить через Менеджер библиотек Arduino IDE и подробно останавливаться на этом мы не будем.

Пример 1. Работа с текстом

Вот простая программа, которая будет выполнять следующее:

  • Отображение простого текста
  • Отображение перевернутого текста
  • Отображаемые цифры
  • Отображение чисел с основанием (шестнадцатеричное, десятичное)
  • Отображение символов ASCII
  • Прокрутка текста по горизонтали и вертикали
  • Прокрутка части дисплея

Эта программа даст вам полное представление о том, как использовать OLED-дисплей, и может послужить основой для более практических экспериментов и проектов. Скопируйте данный код в Arduino IDE, скомпилируйте и загрузите его в микроконтроллер. Чуть позже мы разберем его в деталях


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

#define SCREEN_WIDTH 128 // OLED display width, in pixels
#define SCREEN_HEIGHT 64 // OLED display height, in pixels

// Declaration for SSD1306 display connected using I2C
#define OLED_RESET -1 // Reset pin
#define SCREEN_ADDRESS 0x3C
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);

void setup()
{
 Serial.begin(9600);
 
 // initialize the OLED object
 if(!display.begin(SSD1306_SWITCHCAPVCC, SCREEN_ADDRESS)) {
 Serial.println(F("SSD1306 allocation failed"));
 for(;;); // Don't proceed, loop forever
 }

 // Clear the buffer.
 display.clearDisplay();

 // Display Text
 display.setTextSize(1);
 display.setTextColor(WHITE);
 display.setCursor(0,28);
 display.println("Hello world!");
 display.display();
 delay(2000);
 display.clearDisplay();

 // Display Inverted Text
 display.setTextColor(BLACK, WHITE); // 'inverted' text
 display.setCursor(0,28);
 display.println("Hello world!");
 display.display();
 delay(2000);
 display.clearDisplay();

 // Changing Font Size
 display.setTextColor(WHITE);
 display.setCursor(0,24);
 display.setTextSize(2);
 display.println("Hello!");
 display.display();
 delay(2000);
 display.clearDisplay();

 // Display Numbers
 display.setTextSize(1);
 display.setCursor(0,28);
 display.println(123456789);
 display.display();
 delay(2000);
 display.clearDisplay();

 // Specifying Base For Numbers
 display.setCursor(0,28);
 display.print("0x"); display.print(0xFF, HEX); 
 display.print("(HEX) = ");
 display.print(0xFF, DEC);
 display.println("(DEC)"); 
 display.display();
 delay(2000);
 display.clearDisplay();

 // Display ASCII Characters
 display.setCursor(0,24);
 display.setTextSize(2);
 display.write(3);
 display.display();
 delay(2000);
 display.clearDisplay();

 // Scroll full screen
 display.setCursor(0,0);
 display.setTextSize(1);
 display.println("Full");
 display.println("screen");
 display.println("scrolling!");
 display.display();
 display.startscrollright(0x00, 0x07);
 delay(2000);
 display.stopscroll();
 delay(1000);
 display.startscrollleft(0x00, 0x07);
 delay(2000);
 display.stopscroll();
 delay(1000); 
 display.startscrolldiagright(0x00, 0x07);
 delay(2000);
 display.startscrolldiagleft(0x00, 0x07);
 delay(2000);
 display.stopscroll();
 display.clearDisplay();

 // Scroll part of the screen
 display.setCursor(0,0);
 display.setTextSize(1);
 display.println("Scroll");
 display.println("some part");
 display.println("of the screen.");
 display.display();
 display.startscrollright(0x00, 0x00);
}

void loop() {
}

Вот так будет выглядеть результат

1

Пояснения к коду

Программа начинается с включения четырех библиотек: SPI.h, Wire.h, Adafruit_GFX.h и Adafruit_SSD1306.h. Хотя библиотека SPI.h не требуется для OLED-дисплеев I2C, мы должны включить ее для компиляции нашей программы.
#include <SPI.h>
#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>

Следующим шагом является создание объекта Adafruit_SSD1306.h. Конструктор Adafruit_SSD1306 принимает 3 аргумента: ширину экрана, высоту экрана и номер вывода, к которому подключен пин сброса дисплея. Итак, определена пара констант.

Кроме того, поскольку используемый нами OLED-дисплей не имеет вывода для сброса, мы отправляем -1конструктору сообщение о том, что ни один из выводов ESP8266 не используется для сброса дисплея.

#define SCREEN_WIDTH 128 // OLED display width, in pixels
#define SCREEN_HEIGHT 64 // OLED display height, in pixels

// Declaration for SSD1306 display connected using I2C
#define OLED_RESET -1 // Reset pin
#define SCREEN_ADDRESS 0x3C
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);

В функции настройки мы инициализируем OLED-объект с помощью begin()функции. Эта функция принимает два параметра. Первый параметр, SSD1306_SWITCHCAPVCC, включает внутреннюю схему подкачки заряда, а второй параметр задает адрес I2C OLED-дисплея. Большинство модулей OLED-дисплея этого типа имеют адрес I2C 0x3C, но некоторые имеют 0x3D

После этого мы очищаем буфер перед выводом нашего первого сообщения на экран.

// initialize the OLED object
if(!display.begin(SSD1306_SWITCHCAPVCC, SCREEN_ADDRESS)) {
 Serial.println(F("SSD1306 allocation failed"));
 for(;;); // Don't proceed, loop forever
}

// Clear the buffer.
display.clearDisplay();

Отображение простого текста (Hello, world!)

// Display Text
display.clearDisplay();
display.setTextSize(1);
display.setTextColor(WHITE);
display.setCursor(0,28);
display.println("Hello world!");
display.display();
delay(2000);

Чтобы отобразить текст на экране, мы должны сначала установить размер шрифта. Это может быть достигнуто путем вызова setTextSize() и передачи размера шрифта (начиная с 1) в качестве параметра. Далее мы устанавливаем цвет шрифта, вызывая функцию setTextColor(). Подойдет как WHITE для темного фона, так и BLACK для яркого.

Перед печатью сообщения мы должны сначала установить положение курсора, вызвав setCursor(X,Y) функцию. Пиксели на экране привязаны к их горизонтальным (X) и вертикальным (Y) координатам. Начало координат (0,0) расположено в верхнем левом углу, при этом положительный X увеличивается вправо, а положительный Y увеличивается вниз.

Для печати сообщения на экране мы можем использовать функции print(" ") или println(" "), аналогичные тому, как мы печатаем данные на последовательном мониторе. Имейте в виду, что println() приведет к перемещению курсора на следующую строку.

Последним шагом является использование display() команды для указания библиотеке массово передать экранный буфер во внутреннюю память контроллера SSD1306 и отобразить содержимое на OLED-экране.

Отображение инвертированного текста

inverse

// Display Inverted Text
display.clearDisplay();
display.setTextColor(BLACK, WHITE); // 'inverted' text
display.setCursor(0,28);
display.println("Hello world!");
display.display();
delay(2000);

Для отображения инвертированного текста мы используем setTextColor(FontColor, BackgroundColor) функцию. Если вы обратили внимание, вы заметите, что ранее мы передавали только один параметр этой функции, но теперь мы передаем два. Это возможно из-за так называемой перегруженной функции.

В этом случае использование setTextColor(BLACK, WHITE) приводит к черному тексту на заполненном фоне.

Масштабирование размера шрифта

fonsize

// Changing Font Size
display.clearDisplay();
display.setTextColor(WHITE);
display.setCursor(0,24);
display.setTextSize(2);
display.println("Hello!");
display.display();
delay(2000);

Ранее в этом руководстве мы использовали setTextSize() функцию для изменения размера шрифта, передавая 1 в качестве параметра. Вы можете масштабировать шрифт, передавая в эту функцию любое неотрицательное целое число.

Символы отображаются в соотношении 7: 10. Другими словами, передача размера шрифта 1 отображает текст с разрешением 7 × 10 пикселей на символ, передача размера шрифта 2 отображает текст с разрешением 14 × 20 пикселей на символ и так далее.

Отображение чисел

// Display Numbers
display.clearDisplay();
display.setTextSize(1);
display.setCursor(0,28);
display.println(123456789);
display.display();
delay(2000);

Функции print() или println() могут использоваться для отображения чисел на OLED-дисплее. Поскольку перегруженная реализация этих функций принимает 32-разрядные значения int без знака, вы можете отображать только числа в диапазоне от 0 до 4 294 967 295.

Указание базы для чисел

hex

// Specifying Base For Numbers
display.clearDisplay();
display.setCursor(0,28);
display.print("0x"); display.print(0xFF, HEX); 
display.print("(HEX) = ");
display.print(0xFF, DEC);
display.println("(DEC)"); 
display.display();
delay(2000);

Функции print()и println()имеют необязательный второй параметр, который определяет базу (формат); допустимыми значениями являются BIN (двоичный, или базовый 2), OCT (восьмеричный, или базовый 8), DEC (десятичный, или базовый 10) и HEX (шестнадцатеричный, или базовый 16). Для чисел с плавающей запятой этот параметр определяет количество используемых десятичных знаков. Например:
 

  • print(78, BIN) выводит “1001110”
  • print(78, OCT) выводит “116”
  • print(78, DEC) выводит “78”
  • print(78, HEX) выводит “4E”
  • println(1.23456, 0) выводит “1”
  • println(1.23456, 2) выводит “1.23”
  • println(1.23456, 4) выводит “1.2346”

Отображение символов ASCII

ascii

// Display ASCII Characters
display.clearDisplay();
display.setCursor(0,24);
display.setTextSize(2);
display.write(3);
display.display();
delay(2000);

Функции print() и println() отправляют данные на дисплей в виде удобочитаемого текста ASCII, в то время как функция write() отправляет двоичные данные на дисплей. Таким образом, эта функция может использоваться для отображения символов ASCII. Например, при отправке 3 отображается символ сердца.

Полноэкранная прокрутка

scrolling

// Scroll full screen
display.clearDisplay();
display.setCursor(0,0);
display.setTextSize(1);
display.println("Full");
display.println("screen");
display.println("scrolling!");
display.display();
display.startscrollright(0x00, 0x07);
delay(2000);
display.stopscroll();
delay(1000);
display.startscrollleft(0x00, 0x07);
delay(2000);
display.stopscroll();
delay(1000); 
display.startscrolldiagright(0x00, 0x07);
delay(2000);
display.startscrolldiagleft(0x00, 0x07);
delay(2000);
display.stopscroll();

Вы можете прокручивать дисплей по горизонтали, вызывая функции startscrollright() и startscrollleft(), и по диагонали, вызывая функции startscrolldiagright() и startscrolldiagleft(). Все эти функции принимают два параметра: начальная страница и конечная страница. Обратитесь к разделу распределения памяти OLED для пояснений. Поскольку дисплей содержит восемь страниц от 0 до 7, вы можете прокручивать весь экран, прокручивая все страницы, т.е. передавая параметры 0x00 и 0x07.

stopscroll() может использоваться для остановки прокрутки дисплея.

Прокрутка части экрана

partial scrolling

// Scroll part of the screen
display.setCursor(0,0);
display.setTextSize(1);
display.println("Scroll");
display.println("some part");
display.println("of the screen.");
display.display();
display.startscrollright(0x00, 0x00);

Иногда мы хотим прокручивать не весь дисплей, а только его часть. Вы можете выполнить это, передав соответствующую информацию о начальной и конечной странице в функции прокрутки.

Передача 0x00 для обоих параметров будет прокручивать только первую страницу дисплея.

Пример 2.Рисование базовых фигур

Простая программа, которая демонстрирует, как рисовать основные формы, такие как прямоугольники, круги и треугольники. Загрузите программу в ваш микроконтроллер, а затем мы рассмотрим ее в деталях

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

#define SCREEN_WIDTH 128 // OLED display width, in pixels
#define SCREEN_HEIGHT 64 // OLED display height, in pixels

// Declaration for SSD1306 display connected using I2C
#define OLED_RESET -1 // Reset pin
#define SCREEN_ADDRESS 0x3C
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);

void setup()
{
 Serial.begin(9600);
 
 // initialize the OLED object
 if(!display.begin(SSD1306_SWITCHCAPVCC, SCREEN_ADDRESS)) {
 Serial.println(F("SSD1306 allocation failed"));
 for(;;); // Don't proceed, loop forever
 }

 // Clear the buffer.
 display.clearDisplay();

 // Draw Rectangle
 display.setTextSize(1);
 display.setTextColor(WHITE);
 display.setCursor(0,0);
 display.println("Rectangle");
 display.drawRect(0, 15, 60, 40, WHITE);
 display.display();
 delay(2000);
 display.clearDisplay();

 // Draw Filled Rectangle
 display.setTextSize(1);
 display.setTextColor(WHITE);
 display.setCursor(0,0);
 display.println("Filled Rectangle");
 display.fillRect(0, 15, 60, 40, WHITE);
 display.display();
 delay(2000);
 display.clearDisplay();

 // Draw Round Rectangle
 display.setTextSize(1);
 display.setTextColor(WHITE);
 display.setCursor(0,0);
 display.println("Round Rectangle");
 display.drawRoundRect(0, 15, 60, 40, 8, WHITE);
 display.display();
 delay(2000);
 display.clearDisplay();

 // Draw Filled Round Rectangle
 display.setTextSize(1);
 display.setTextColor(WHITE);
 display.setCursor(0,0);
 display.println("Filled Round Rectangl");
 display.fillRoundRect(0, 15, 60, 40, 8, WHITE);
 display.display();
 delay(2000);
 display.clearDisplay();

 // Draw Circle
 display.setTextSize(1);
 display.setTextColor(WHITE);
 display.setCursor(0,0);
 display.println("Circle");
 display.drawCircle(20, 35, 20, WHITE);
 display.display();
 delay(2000);
 display.clearDisplay();

 // Draw Filled Circle
 display.setTextSize(1);
 display.setTextColor(WHITE);
 display.setCursor(0,0);
 display.println("Filled Circle");
 display.fillCircle(20, 35, 20, WHITE);
 display.display();
 delay(2000);
 display.clearDisplay();

 // Draw Triangle
 display.setTextSize(1);
 display.setTextColor(WHITE);
 display.setCursor(0,0);
 display.println("Triangle");
 display.drawTriangle(30, 15, 0, 60, 60, 60, WHITE);
 display.display();
 delay(2000);
 display.clearDisplay();

 // Draw Filled Triangle
 display.setTextSize(1);
 display.setTextColor(WHITE);
 display.setCursor(0,0);
 display.println("Filled Triangle");
 display.fillTriangle(30, 15, 0, 60, 60, 60, WHITE);
 display.display();
 delay(2000);
 display.clearDisplay();
}

void loop() {
}

Вот так выглядит результат

figures

Большая часть кода (настройка дисплея) такая же, как в приведенном выше примере кода, за исключением следующих фрагментов кода, которые рисуют основные фигуры.

Рисование прямоугольника

rectangle fillrect

display.clearDisplay();
display.setTextSize(1);
display.setTextColor(WHITE);
display.setCursor(0,0);
display.println("Rectangle");
display.drawRect(0, 15, 60, 40, WHITE);
display.display();
delay(2000);

display.clearDisplay(); 
display.setTextSize(1);
display.setTextColor(WHITE);
display.setCursor(0,0);
display.println("Filled Rectangle");
display.fillRect(0, 15, 60, 40, WHITE);
display.display();
delay(2000);

drawRect() может использоваться для рисования прямоугольника на экране. Эта функция принимает пять параметров: координаты X и Y, ширину, высоту и цвет. Эта функция фактически рисует пустой прямоугольник с границей в 1 пиксель. fillRect() может использоваться для рисования заполненного прямоугольника.

Рисование скругленного прямоугольника

roundrect fillroundrect

display.clearDisplay();
display.setTextSize(1);
display.setTextColor(WHITE);
display.setCursor(0,0);
display.println("Round Rectangle");
display.drawRoundRect(0, 15, 60, 40, 8, WHITE);
display.display();
delay(2000);

display.clearDisplay(); 
display.setTextSize(1);
display.setTextColor(WHITE);
display.setCursor(0,0);
display.println("Filled Round Rectangl");
display.fillRoundRect(0, 15, 60, 40, 8, WHITE);
display.display();
delay(2000);

drawRoundRect() может использоваться для рисования скругленного прямоугольника на экране. Эта функция принимает те же параметры, что и drawRect(), за исключением одного дополнительного параметра – радиуса закругления угла. Эта функция фактически рисует полый скругленный прямоугольник с границей в 1 пиксель. fillRoundRect() может использоваться для рисования заполненного скругленного прямоугольника.

Рисование круга

circle fillcircle

display.clearDisplay();
display.setTextSize(1);
display.setTextColor(WHITE);
display.setCursor(0,0);
display.println("Circle");
display.drawCircle(20, 35, 20, WHITE);
display.display();
delay(2000);

display.clearDisplay();
display.setTextSize(1);
display.setTextColor(WHITE);
display.setCursor(0,0);
display.println("Filled Circle");
display.fillCircle(20, 35, 20, WHITE);
display.display();
delay(2000);

drawCircle() может использоваться для рисования круга на экране. Эта функция принимает четыре параметра: координату X центра, координату Y центра, радиус и цвет. Эта функция рисует полый круг с границей в 1 пиксель. fillCircle() может использоваться для рисования заполненного круга.

Рисование треугольника

triangle filltriangle

display.clearDisplay();
display.setTextSize(1);
display.setTextColor(WHITE);
display.setCursor(0,0);
display.println("Triangle");
display.drawTriangle(30, 15, 0, 60, 60, 60, WHITE);
display.display();
delay(2000);

display.clearDisplay();
display.setTextSize(1);
display.setTextColor(WHITE);
display.setCursor(0,0);
display.println("Filled Triangle");
display.fillTriangle(30, 15, 0, 60, 60, 60, WHITE);
display.display();
delay(2000);

drawTriangle() может использоваться для рисования треугольника на экране. Эта функция принимает семь параметров: три координаты X и Y (x0, y0, x1, y1, x2 и y2) вершин треугольника и цвет. (X0, y0) - верхняя вершина, (x1, y1) - левая вершина, а (x2, y2) - правая вершина.

Эта функция рисует полый треугольник с границей в 1 пиксель. fillTriangle() может использоваться для рисования заполненного треугольника..

Пример 3. Отображение растрового изображения

В нашем последнем примере показано, как отображать растровые изображения на OLED-дисплее. Это удобно при отображении таких вещей, как логотипы, спрайты, инфографика или значки.

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

#define SCREEN_WIDTH 128 // OLED display width, in pixels
#define SCREEN_HEIGHT 64 // OLED display height, in pixels

// Declaration for SSD1306 display connected using I2C
#define OLED_RESET -1 // Reset pin
#define SCREEN_ADDRESS 0x3C
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);

// Bitmap of MarilynMonroe Image
const unsigned char MarilynMonroe [] PROGMEM = {
 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x1f, 0xff, 0xff, 0xf0, 0x41, 0xff, 0xff, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x7f, 0xff, 0xff, 0xf8, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xff, 0xf9, 0xff, 0xff, 0xff, 0xe0, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xff, 0x87, 0xff, 0xff, 0xff, 0xf8, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xff, 0x07, 0xff, 0xff, 0xff, 0xf8, 0x01, 0xf1, 0xff, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xff, 0x9f, 0xff, 0xff, 0xff, 0xf8, 0x00, 0xf8, 0xff, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xff, 0xbf, 0xff, 0xff, 0xff, 0xfc, 0x02, 0x78, 0x7f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xff, 0xfc, 0x3f, 0xff, 0xff, 0xfe, 0x03, 0x7c, 0x1f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x07, 0xff, 0xff, 0xfe, 0x01, 0xfe, 0x1f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xfd, 0xe0, 0x03, 0xff, 0xff, 0xfc, 0x00, 0xfe, 0x0f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xfe, 0x87, 0xe0, 0xff, 0xff, 0xfc, 0x00, 0x06, 0x07, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xfc, 0x1f, 0xf9, 0xff, 0xff, 0xfc, 0x00, 0x02, 0x07, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xf8, 0x1f, 0xff, 0xff, 0xff, 0xfc, 0x00, 0xc3, 0xc3, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xf0, 0x3f, 0xff, 0xff, 0xe0, 0x0c, 0x00, 0xe7, 0x81, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xf0, 0x0f, 0xff, 0xff, 0xe0, 0x02, 0x00, 0x02, 0x00, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xf0, 0x0f, 0xff, 0xff, 0xe0, 0x01, 0x00, 0x00, 0x00, 0x3f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x3f, 0xff, 0xff, 0xe0, 0x00, 0x00, 0x1e, 0x3f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xfc, 0x00, 0x00, 0x0f, 0xff, 0x3f, 0xf8, 0x00, 0x18, 0x7f, 0x1f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xf8, 0x01, 0x80, 0x03, 0xfc, 0x3f, 0xfc, 0x00, 0x70, 0xfe, 0x1f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xf0, 0x43, 0xff, 0xff, 0xf8, 0x7f, 0xf8, 0x00, 0x00, 0x7e, 0x1f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xe0, 0x07, 0xff, 0xff, 0xf0, 0xff, 0xfc, 0x00, 0x00, 0x7c, 0x3f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xe0, 0x0f, 0xff, 0xff, 0xf1, 0xef, 0xf8, 0x00, 0x01, 0xfc, 0x3f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xe4, 0xff, 0xff, 0xff, 0xf3, 0x80, 0xa0, 0x00, 0x07, 0xfc, 0xaf, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xec, 0x5f, 0xff, 0xff, 0xe7, 0xf0, 0x00, 0x00, 0x03, 0xfe, 0xdf, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xee, 0x7f, 0xff, 0xff, 0xc7, 0xf8, 0x00, 0x00, 0x03, 0xff, 0xdf, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xfe, 0x7f, 0xff, 0xf7, 0xc7, 0xff, 0x06, 0x00, 0x03, 0xff, 0xbf, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xfe, 0x5f, 0xff, 0xc7, 0x07, 0xff, 0x80, 0x00, 0x07, 0xdb, 0xbf, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xee, 0xff, 0xff, 0x80, 0x03, 0xff, 0xc0, 0x00, 0x03, 0xc3, 0x0f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xfe, 0xff, 0xff, 0x98, 0x03, 0xff, 0xf8, 0x00, 0x07, 0xe0, 0x0f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xef, 0xff, 0xff, 0xf8, 0x01, 0xff, 0xfc, 0x01, 0x07, 0xfc, 0x1f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xcf, 0xef, 0xff, 0xff, 0xe1, 0xff, 0xfc, 0x01, 0x07, 0xf8, 0x1f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x9f, 0xff, 0xff, 0x7f, 0xf1, 0xff, 0xf8, 0x02, 0x07, 0x88, 0x3f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xcf, 0xef, 0xf8, 0x0f, 0xff, 0xff, 0xe0, 0x00, 0x07, 0x84, 0x3f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xe7, 0xef, 0xf0, 0x04, 0x7f, 0xff, 0xc0, 0x00, 0x07, 0x84, 0x7f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x3f, 0xff, 0xe0, 0x00, 0x1f, 0xff, 0x80, 0x00, 0x06, 0x04, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x3f, 0x7f, 0xe1, 0xf0, 0x07, 0xff, 0x80, 0x00, 0x07, 0x06, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0xff, 0xc3, 0xfe, 0x03, 0xff, 0x00, 0x00, 0x03, 0x80, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xf2, 0x3f, 0xc6, 0x7f, 0x81, 0xce, 0x00, 0x00, 0x01, 0xc1, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xe0, 0x3f, 0xc0, 0x07, 0xc1, 0xfe, 0x00, 0x00, 0x0d, 0xc0, 0x7f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xe0, 0x3f, 0xc0, 0x01, 0xe0, 0xfc, 0x00, 0x00, 0x0f, 0xc0, 0x7f, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xc0, 0x3f, 0xc0, 0x00, 0x50, 0xfc, 0x00, 0x00, 0x0e, 0xc0, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xc0, 0x3f, 0xc0, 0x00, 0x18, 0xf8, 0x00, 0x00, 0x0e, 0xc1, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xc0, 0x3f, 0xc0, 0x00, 0x00, 0xf8, 0x00, 0x00, 0x66, 0x81, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xc0, 0x1f, 0xc7, 0x80, 0x00, 0xf8, 0x00, 0x01, 0xe0, 0x00, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xc0, 0x1f, 0xc1, 0xe0, 0x01, 0xf8, 0x00, 0x03, 0xf0, 0x01, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x80, 0x1f, 0xc0, 0x3e, 0x03, 0xf0, 0x00, 0x00, 0xe0, 0x03, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x00, 0x1f, 0xe0, 0xe0, 0x03, 0xf2, 0x00, 0x00, 0xc0, 0x03, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x80, 0x1f, 0xf0, 0x00, 0x07, 0xe6, 0x00, 0x00, 0xc0, 0x03, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x80, 0x1f, 0xff, 0x00, 0x1f, 0xee, 0x00, 0x00, 0x80, 0x07, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xb8, 0x0f, 0xff, 0xf0, 0x3f, 0xdc, 0x00, 0x00, 0x00, 0x0f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xbc, 0x0f, 0xff, 0xff, 0xff, 0xdc, 0x00, 0x00, 0x00, 0x0f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x9e, 0x0f, 0xff, 0xff, 0xff, 0xf8, 0x00, 0x00, 0x00, 0x1f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x08, 0x0f, 0xff, 0xff, 0xff, 0x70, 0x00, 0x00, 0x00, 0x1f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x00, 0x0b, 0xff, 0xff, 0xfe, 0xe0, 0x00, 0x00, 0x00, 0x1f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x00, 0x0b, 0xff, 0xff, 0xf9, 0xc0, 0x00, 0x00, 0x00, 0x3f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x3c, 0x09, 0xff, 0xff, 0xf1, 0x80, 0x00, 0x00, 0x00, 0x7f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x1e, 0x08, 0x3f, 0xff, 0xc0, 0x00, 0x00, 0x00, 0x00, 0x7f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x1f, 0x08, 0x03, 0xff, 0x00, 0x00, 0x00, 0x00, 0x00, 0x7f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x00, 0x08, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x1f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0x80, 0x1c, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x1f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xce, 0x1c, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x1f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xfe, 0x1c, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x3f, 0xff, 0xff, 0xff, 
 0xff, 0xff, 0xff, 0xff, 0x7e, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x7f, 0xff, 0xff, 0xff
};

void setup()
{
 Serial.begin(9600);
 
 // initialize the OLED object
 if(!display.begin(SSD1306_SWITCHCAPVCC, SCREEN_ADDRESS)) {
 Serial.println(F("SSD1306 allocation failed"));
 for(;;); // Don't proceed, loop forever
 }

 // Clear the buffer.
 display.clearDisplay();

 // Display bitmap
 display.drawBitmap(0, 0, MarilynMonroe, 128, 64, WHITE);
 display.display();

 // Invert Display
 //display.invertDisplay(1);
}

void loop() {
}

Вот так выглядит результат

bmp

Объяснение кода.

drawBitmap() используется для отображения растрового изображения на OLED-дисплее. Эта функция принимает шесть параметров: координату X верхнего левого угла, координату Y верхнего левого угла, массив байтов монохромного растрового изображения, ширину растрового изображения в пикселях, высоту растрового изображения в пикселях и цвет.

Размер растрового изображения в нашем примере составляет 128 × 64. Таким образом, координаты X и Y устанавливаются в 0, а ширина и высота устанавливаются в 128 и 64.

// Display bitmap
display.drawBitmap(0, 0, MarilynMonroe, 128, 64, WHITE);
display.display();

Но, прежде чем мы сможем использовать эту функцию drawBitmap(), нам нужно нарисовать изображение. Помните, что разрешение экрана OLED-дисплея составляет 128 × 64 пикселей, поэтому изображения большего размера не будут отображаться должным образом. Чтобы получить изображение нужного размера, откройте свою любимую программу для рисования, такую как Inkscape, Photoshop или MS Paint, и установите размер холста 128 × 64 пикселей.

В качестве примера мы использовали фотографию Мэрилин Монро. Мы изменили его на 128 × 64 пикселей в MS Paint и сохранили в виде файла .bmp.

monro

Получив растровое изображение, необходимо преобразовать его в массив, понятный OLED-контроллеру SSD1306. Это может быть достигнуто двумя способами: с помощью онлайн утилиты доступной на нашем сайте или с помощью LCD Image Converter (офлайн).

После того, как вы создали массив, одним из приведенных выше способов, скопируйте и вставьте его в свой код.

Убедитесь, что дали ему правильное имя. Затем в рамках drawBitmap()функции используйте свой массив.

На этом обзор библтотеки Adafruit SSD1306 закончен. Полную документацию по ней вы сможете найти здесь, а по AdafruitGFX здесь

Материал также доступен на моем канале: Яндекс Дзен и в группе ВК
Категория: Обзоры модулей | Добавил: :, (11.02.2023)
Просмотров: 2825 | Теги: OLED, Arduino, SSD1306, ESP8266 | Рейтинг: 0.0/0
Поделиться:
Всего комментариев: 0
avatar