Это пятый урок из цикла «Знакомство с Arduino». В этом уроке Вы научитесь основам работы с OLED дисплеем.

Для урока Вам понадобится следующие детали:

  • Arduino Nano;
  • беспаечная макетная плата (она же breadboard);
  • провода типа папа-папа;
  • дисплей OLED 0.96».

Также Вам понадобится скачать и установить библиотеки Adafruit_GFX и Adafruit_SSD1306 и среду Arduino IDE. Если не знаете/забыли как это сделать, то вернитесь к уроку по среде Arduino IDE.

После установки необходимых библиотек, для OLED 128 × 64 нужно отредактировать файл Adafruit_SSD1306.h.  Найдите строки:

И раскомментируйте строчку #define SSD1306_128_64. Должно получиться так:

Если у нужно пользоваться дисплеем 128 × 32 или 96 × 16 тогда раскомментируйте нужную строку, а остальные закомментируйте.

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

Давайте научимся основам работы с OLED дисплеями. Мы изучим их подключение к Arduino и основные команды для работы с ними. В наших примерах рассмотрим принципы вывода информации на OLED.

OLED дисплеи подключаются к Arduino по стандартному интерфейсу I2C (есть модели, которые подключаются по SPI). Подключите OLED к Arduino, воспользовавшись следующими схемами:

Электрическая принципиальная схема:

Схема подключения на макетной плате:

Так, дисплей мы подключили, а как же на него вывести информацию? Давайте начнём с классического примера из программирования: вывести на экран «Hello, world!».

Итак, схема у нас уже собрана. Подключите модуль Arduino к компьютеру. Далее откройте среду разработки Arduino IDE. Вам нужно только записать в Arduino следующую программу:

Текст программы:

Пояснение программы »

При помощи директивы #include мы подключаем необходимые для работы с OLED библиотеки. Функция setup() запускается однократно при запуске программы. В ней мы инициализируем дисплей, а также выставляем все необходимые настройки (цвет текста (display.setTextColor(WHITE)), его размер (display.setTextSize(1)) и устанавливаем местоположение курсора, откуда мы начнём выводить наше сообщение (команда display.setCursor(0, 0)). После того, как мы настроили OLED, можно выводить на экран наше сообщение. Для этого при помощи команды display.print («Hello, world!») мы записываем наше сообщение в буфер, а затем выводим его непосредственно на экран (команда  display.display()). Обратите внимание, весь текстовая информация сначала помещается в буфер, а затем при помощи команды .display() она отображается на экране (т.е. нужные пиксели загораются). Функция loop() вызывается после функции setup(). Функция представляет собой бесконечный цикл, в котором выполняется пользовательская программа. В ней при мы ничего не делаем, т.к. нам просто нужно было вывести сообщение однократно, что мы и сделали в setup().

Когда программа успешно записана в Arduino, на OLED в верхнюю строчку будет выведено наше сообщение «Hello, world!». Мы выполнили поставленную задачу.

Существует большое количество функций, которые позволяют добавить свои краски при выводе информации на OLED. Одной из таких «фишек» является автоматическое прокручивание текста в различные стороны (scrolling).

Давайте попробуем прокручивать наше сообщение поочерёдно слева направо и затем справа налево. Запишите в модуль Arduino Nano следующую программу:

Текст программы:

Пояснение программы »

Данный пример почти аналогичен предыдущему. В функции loop() мы поочередно прокручиваем наше сообщение вправо (display.startscrollright(0x00, 0x0F)) в течение 3-х секунд, останавливаем прокрутку (display.stopscroll()) на 1 секунду и далее прокручиваем сообщение влево (display.startscrollleft(0x00, 0x0F)), тоже в течение 3-х секунд. Таким образом мы организовали своеобразную анимацию.

Есть ещё несколько интересных возможностей при прокрутке текста на OLED: прокрутка по диагонали. Давайте попробуем переделать предыдущий пример так, чтобы сообщение теперь прокручивалось слева направо, а затем справа налево, но уже по диагонали.

Текст программы:

Пояснение программы »

Пример полностью повторяет предыдущий, за исключением направления прокрутки сообщения. Теперь мы используем диагональную прокрутку: команды display.startscrolldiagright(0x00, 0x0F); и display.startscrolldiagleft(0x00, 0x0F).

На OLED можно выводить не только текст, но и числовые значения. Давайте попробуем поочерёдно выводить цифры от 0 до 9 на экран.

Текст программы:

Пояснение программы »

В цикле for мы поочерёдно выводим на экран цифры от 0 до 9 с периодом полсекунды. Здесь все команды аналогичны командам из предыдущих примеров.

С основными особенностями при выводе текста на OLED мы разобрались. Однако на OLED можно выводить не только текстовую, но и графическую информацию (разные картинки и простые графические примитивы).

Давайте создадим небольшую анимацию, используя несколько линий.

Текст программы:

Пояснение программы »

В функции  loop() мы поочерёдно выводим на экран горизонтальные линии, затем их поочерёдно убираем, далее аналогично поступаем и с вертикальными линиями и в конце рисуем сеточку (рисуем и вертикальные и горизонтальные линии). Таким образом, мы сделали простейшую анимацию при помощи линий. Функция display.drawLine(x1, y1, x2, y2, color); позволяет нарисовать  линию: x1 и y1 — координаты начальной точки линии, x2 и y2 — координаты конечной точки линии, color — цвет линии.

Не только линии можно рисовать на OLED дисплее. Давайте попробуем нарисовать несколько вложенных друг в друга прямоугольников.

Текст программы:

Пояснение программы »

В функции  loop() мы поочерёдно рисуем на экране вложенные прямоугольники, а затем их поочерёдно убираем. Таким образом, мы сделали простейшую анимацию при помощи прямоугольников. Функция display.drawRect(x1, y1, width, height, color); позволяет нарисовать  прямоугольник: x1 и y1 — координаты начальной крайней левой точки прямоугольника, width — ширина прямоугольника, а height — высота, color — цвет линии.

Существует ещё несколько функций, которые позволяют нарисовать довольно интересные картинки на OLED (треугольники, круги и т.д.), Однако на них мы не будем останавливаться.

Вместо этого, давайте попробуем вывести какую-нибудь картинку на дисплей. Думаете слишком сложно? Нет, всё достаточно просто.

Для этого нужно создать чёрно-белую картинку в любом графическом редакторе с разрешением вашего OLED дисплея (у нас 128 × 64). Далее картинку нужно сохранить в формате .bmp с 256 цветами и далее сконвертировать полученную картинку в массив байт (онлайн-конвертер). Теперь нужно только скопировать полученный массив в программу и запустить её.

Текст программы:

Пояснение программы »

В примере мы создаём массив logoBmp, в котором содержится наша картинка. При помощи команды display.drawBitmap(0, 0, logoBmp, 128, 64, WHITE) мы отрисовываем её. Функция display.drawBitmap(x, y, bmp_array, width, height, WHITE) позволяет нарисовать  картинку: x и y — координаты начальной крайней левой точки картинки, bmp_array — массив, содержащий картинку (он должен находиться в памяти программ — для этого используем директиву PROGMEM), width — ширина картинки, а height — высота, color — цвет линии.

Для проверки, насколько хорошо Вы усвоили урок, выполните следующие задания.

Чтобы проверить себя, дорогой читатель, воспользуйтесь подсказками после вопросов.

Задания:

  1. Выведите сообщение «Hello, world!», начиная с позиции 28 по оси X и 16 по оси Y;

    Показать ответ »

    Для этого нужно изменить положение курсора. Оно задаётся командой display.setCursor(28, 16).
    Текст программы: 

  2. Увеличьте размер шрифта и выведите текстовое сообщение на OLED;

    Показать ответ »

    Размер шрифта задаётся аргументом в команде display.setTextSize(<размер>). Давайте увеличим его в два раза. Получится так: display.setTextSize(2). Вместо «Hello, world!» выведем на OLED название футбольного клуба Arsenal.
    Текст программы: 

  3. Выведите два тестовых сообщения на разных строках дисплея; 

    Показать ответ »

    Сначала нужно вывести первое сообщение и перевести курсор на следующую строку. Далее в ней вывести второе сообщение. Перенести курсор на следующую строку можно при помощи display.setCursor (нужно тогда вручную указать координаты), а можно и при помощи display.println (координаты вводить вручную не нужно).
    Текст программы: 

  4. Сделайте прокрутку сообщения сначала справа налево, а потом слева направо; 

    Показать ответ »

    Для этого нужно просто поменять очерёдность направления прокрутки сообщения.
    Текст программы: 

  5. Нарисуйте квадрат 20 × 20, координаты левой крайней точкой  (10, 10). Прокручивайте его в бесконечном цикле слева направо.

    Показать ответ »

    Нужно только правильно задать координаты и размеры квадрата в функции display.drawRect. Для прокрутки сообщения нужно воспользоваться командой startscrollright.
    Текст программы: 

 

 

Уважаемый читатель, мы предлагаем Вам обратиться к разделу «Программирование» на нашем сайте. Там Вы найдёте описание и примеры работы с различными функциями программирования модулей Arduino.

Спасибо за то, что учитесь познавать удивительный мир радиоэлектроники вместе с нами.

Верьте в себя, учитесь и у Вас всё обязательно получится!

Удачи в дальнейших проектах!