Цветные графические сенсорные дисплеи Nextion

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

Всё это становится возможным благодаря мощному 32-х разрядному процессору и визуальной среде разработки Nextion Editor. С внешним миром дисплей взаимодействует с помощью резистивного сенсора касаний с собственным контроллером и интерфейса UART. Панель подключается всего по четырём проводам (два из которых — питание). Для обновления прошивки дисплея, помимо UART, предусмотрен разъем для microSD карты.

В зависимости от версии дисплеи оснащаются бОльшим объемом памяти, часами реального времени и даже собственными пинами GPIO, что позволяет использовать дисплей для управления устройствами такими как реле и т.д.

Видеообзор

Подключение и настройка

В комплекте с дисплеями Nextion идёт четырёхпроводной шлейф и плата-модуль USB to 2 pin connector.

  • Четырёхпроводной шлейф служит для подключения дисплея к питанию и управляющим пинам контроллера. Распиновка шлейфа:
    1. красный провод — питание 5 В
    2. чёрный провод — земля
    3. синий провод — пин TX дисплея. Подключается к RX микроконтроллера.
    4. жёлтый провод — пин RX дисплея. Подключается к TX микроконтроллера.
  • USB to 2 pin connector — используется для быстрого подключения питание дисплея с помощью кабеля USB (A — Micro USB) и четырёх-проводного шлейфа.

Демонстрационный режим

Дисплейные модули работают прямо из коробки с демонстрационной прошивкой. Для её старта достаточно подать питание на дисплей с помощью кабеля USB, переходной платы USB to 2 pin и четырёхпроводного шлейфа.

Установка среды Nextion Editor

Для работы с дисплеем необходимо установить и настроить среду разработки «Nextion Editor»

Для этого перейдите на официальный сайт дисплейных модулей «Nextion». Скачайте и установите последнюю версию среды.

Создание нового проекта в Nextion Editor

  1. Запустите среду «Nextion Editor»
  2. Создайте новый проект: File NEW , напишите название будущего проекта и нажмите кнопку Сохранить. Откроется окно Setting, с двумя вкладками: Device и Display.
  3. Во вкладке Device выберите линейку и модель дисплея. В качестве примера выберем дисплей из линейки Basic модели NX3224T024_011R
  4. Во вкладке Display выберите ориентацию дисплея и кодировку.

    Для поддержки кириллицы выбирайте кодировку iso-8859-5

  5. После всех манипуляций нажимайте кнопку OK. Перед вами откроется графическое окно разработки. Рассмотрим его элементы.

  • 1 — Главное меню.
  • 2 — Меню управления выравниванием и порядком элементов.
  • 3 — Библиотека элементов.
  • 4 — Область отображения.
  • 5 — Список страниц проекта
  • 6 — Библиотека изображений /Библиотека шрифтов.
  • 7 — Окно вывода результатов компиляции.
  • 8 — Окно для ввода кода, выполняемого при возникновении события.
  • 9 — Зона редактирования атрибутов выбранного элемента.

Добавление изображений

  1. Нажмите в окне «библиотека изображений» на иконку
  2. Выберите интересующее вас изображение на ПК и нажмите кнопку Открыть.В окне «библиотека изображений» появиться загруженное изображение.
  3. Выделите область отображение дисплея.
  4. В окне «зона редактирование атрибутов» в пункте sta измените поле solid color на image.
  5. В поле pic выберите интересующую вас картинку из «библиотеки изображений» и нажмите кнопку OK Если вы всё сделали правильно, в окне «область отображение дисплея» вы увидите вашу картинку.

Это значит всё получилось и можно смело переходить к прошивки дисплея.

Прошивка дисплейных модулей

Компиляция проекта

Перед прошивкой проект необходимо проверить не наличие ошибок — скомпилировать. Для этого нажмите кнопку Compile. В окне «вывода результатов компиляции» вы должны увидеть сообщение об успешной компиляции. Дисплейные модули Nextion поддерживают два вида прошивки:

  • Через последовательный порт UART
  • С помощью карты microSD.

Рассмотрим их подробнее.

Прошивка через UART

Для прошивки дисплея через UART понадобиться USB-Serial адаптер.

  1. Подключите дисплей к USB-Serial адаптеру следующим образом:
    1. Питание дисплея +5V — к питанию USB-Serial адаптера
    2. Земля дисплея GND — к питанию USB-Serial адаптера
    3. TX дисплея — в RX USB-Serial адаптера
    4. RX дисплея — в TX USB-Serial адаптера
  2. Прошейте ваш дисплей нажав на кнопку . Процесс прошивки будет отображаться в окошке в программы и на дисплейном модуле. После окончания прошивки, загружаемый проект будет выполняться и отображаться на дисплейном модуле.

Прошивка через microSD

Прошивка через UART занимает достаточно долгое время и требует дополнительного UART-преобразователя. В связи с этим существует альтернативный способ прошивки дисплеев Nextion с помощью microSD карты.

  1. Откройте папку с компилированными проектами: File Open builder folder
  2. Скопируйте файл с именем вашего проекта на microSD карту.
  3. Извлеките microSD-карту из вашего ПК и вставьте её в дисплей.
  4. Подключите питание на дисплей.
  5. Дождитесь окончания прошивки.
  6. Извлеките microSD-карту.

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

Пример работы

Мини-игра

Соберите новую версию игры «Убей крота».

  1. Скачайте, распакуйте и откройте проект «мини-игра» для «Nextion Editor».
  2. Подключите дисплей через четырёхпроводной шлейф к Arduino. Чтобы избавиться от лишних проводов можно воспользоваться Troyka Shield .
    1. Питание дисплея +5V — к питанию Arduino
    2. Земля дисплея GND — к земле Arduino
    3. TX дисплея — к 8 пину Arduino
    4. RX дисплея — к 9 пину Arduino
  3. Скачайте и прошейте вашу Arduino скетчем для мини-игры.

    В данном примере воспользуемся библиотекой эмуляции Serial порта — SoftwareSerial.

    mini-game.ino
    // библиотека для эмуляции Serial порта
    #include <SoftwareSerial.h>
    // создаём объект mySerial и передаём номера управляющих пинов RX и TX
    // RX - цифровой вывод 8, необходимо соединить с выводом TX дисплея
    // TX - цифровой вывод 9, необходимо соединить с выводом RX дисплея
    SoftwareSerial mySerial(8, 9);
     
    // переменная для хранения посылки данных
    String data;
     
    void setup() 
    {
      // открываем последовательный порт
      mySerial.begin(9600);
    }
     
    void loop()
    {
      // ждём данные от дисплея
      while (mySerial.available() > 0) {
        data += char(mySerial.read());
        delay(2);
      }
      // если пришёл символ 'g'
      if (data == "g") {
        int c = 99;
        // обнуляем счётчик попаданий
        mySerial.print("n0.val=0");
        // дописываем в посылку служебные символы конца команды
        comandEnd();
        // цикл счётчика таймера
        for (int i = 0; i < 100; i++) {
          for (int j = 0; j < 15; j++) {
            mySerial.print("tsw p");
            mySerial.print(j);
            mySerial.print(",0");
            comandEnd();
            mySerial.print("p");
            mySerial.print(j);
            // все слоты дисплея закрашиваем матрёшками
            mySerial.print(".pic=5");
            comandEnd();
          }
          // функция для генерации случайных чисел
          randomSeed(analogRead(A0));
          // генерируем случайное число
          // одна из 15 области экрана на дисплее
          int b = random(0, 15);
          mySerial.print("tsw p");
          mySerial.print(b);
          mySerial.print(",1");
          comandEnd();
          mySerial.print("p");
          mySerial.print(b);
          // появление картинки, на которую надо быстро нажать
          mySerial.print(".pic=3");
          comandEnd();
          // уменьшаем таймер на единицу и отправляем в дисплей
          c--;
          mySerial.print("j0.val=");
          mySerial.print(c);
          comandEnd();
          data = "";
          delay(500);
        }
        data = "";
        mySerial.print("t0.txt=\"reset\"");
        comandEnd();
        mySerial.print("tsw t0,1");
        comandEnd();
        mySerial.print("tsw m0,1");
        comandEnd();
        delay(2);
      }
      data = "";
    }
     
    // функция отправки конца команды
    // команда поступающая в дисплей должна кончаться символами «0xFF0xFF0xFF»
    void comandEnd() {
      for (int i = 0; i < 3; i++) {
        mySerial.write(0xff);
      }
    }

После успешной прошивки модуля, можете наслаждаться игрой.

Линейки и модели дисплеев

Модель Линейка Размер Разрешение Тач панель Кол-во цветов Flash (MB) RAM (Byte)
NX3224T024_011R Базовая 2.4" 320×240 Резистивная 65536 4 3584
NX4024K032_011R Продвинутая 3.2" 400×240 Резистивная 65536 16 3584
NX8048K050_011R Продвинутая 5.0" 800×480 Резистивная 65536 32 8192

Ресурсы