Создание пользовательских анимаций на LCD 16x2 с Arduino

Компоненты и материалы

Arduino UNO (или любая совместимая плата)	×1
LCD-дисплей 16x2 (совместимый с HD44780), белый на синем	×1
Резистор 220 Ом (можно 220–1к Ом, большее значение — тусклее подсветка)	×1

Программное обеспечение и сервисы

• Arduino IDE
• Генератор пользовательских символов (Custom Glyph Generator) — веб-инструмент

О проекте

Библиотека LiquidCrystal упрощает работу с LCD на Arduino. Особенно интересна функция createChar(): можно создавать до 8 пользовательских символов (глифов), каждый задается массивом из 8 байт (по одному на строку). 5 младших бит каждого байта определяют пиксели в строке. Рисовать байты вручную утомительно, поэтому я сделал веб-инструмент, где можно нарисовать глифы мышкой, а код генерируется автоматически.

В этой статье показано, как создавать анимации, используя только Arduino и LCD. Это открывает возможности для игр, историй, 뮤직-клипов, декоративных панелей и многого другого.

Подключение LCD к Arduino

Подключение зависит от модели дисплея. Для одного из моих экранов работала схема ниже, для другого потребовался потенциометр для регулировки контраста (как в стандартном туториале).

Симуляция на TinkerCad: ссылка.

Создание графики

Перейдите на инструмент и рисуйте. Одновременно можно использовать до 8 секций (глифов). Если не выбирается новый квадрат — проверьте, не заняты ли уже все 8 слотов.

Генерация кода

Когда первый кадр готов, снимите галочку «just the function». Скопируйте код в буфер обмена и загрузите в Arduino. На дисплее появится ваш кадр.

Создание дополнительных кадров

Сохраните текущий код. Нарисуйте второй кадр. Теперь поставьте галочку «just the function». Скопируйте функцию и вставьте в конец скетча. Переименуйте, например, в image01(). Перенесите вызов image() из setup() в loop(), добавьте задержку, вызов image01() и еще задержку. Для единообразия переименуйте первую функцию в image00(). Функция loop() должна выглядеть примерно так:

void loop() {
  image00(); delay(250);
  image01(); delay(250);
}

Загрузите скетч. Добавьте кадры или измените задержки.

Код

Анимация метаморфозы бабочки (пример)

/* butterfly metamorphosis animation 2021 ~ by tusindfryd, public domain */
#include <LiquidCrystal.h>
LiquidCrystal lcd(12, 11, 5, 4, 3, 2); // RS, E, D4, D5, D6, D7

void setup() { lcd.begin(16, 2); }

void loop() {
  image00(); delay(250);
  image01(); delay(250);
  image02(); delay(250);
  image03(); delay(700);
  image04(); delay(250);
  image05(); delay(250);
  image06(); delay(700);
  image07(); delay(1250);
}

// Функции image00()...image07() определяют 8 пользовательских символов
// и выводят их на заданные позиции lcd.setCursor()/lcd.write().
// Полный код см. в исходнике проекта.

Полный код всех 8 кадров доступен в репозитории проекта.

Схемы