Интерфейс дисплея Nextion с четырехрелейной платой ESP 32: 7 шагов

2024 Автор: John Day | [email protected]. Последнее изменение: 2024-01-30 11:53

В этой инструкции мы собираемся подключить 5-дюймовый дисплей к плате с четырьмя реле Esp 32. Плата управляется протоколом MQTT. Плата также имеет двухстороннее управление. Управлять им можно как с помощью mqtt, так и с сенсорного экрана. Сенсорный экран подключается к Esp 32 через uart.

Настройка Nextion Display:

Nextion Editor - это программное обеспечение для разработки, используемое для визуального построения графического интерфейса для встроенных устройств с интенсивным графическим интерфейсом и различными типами TFT-дисплеев и сенсорных панелей. Используя этот инструмент, пользователи могут быстрее и проще приступить к созданию устройств на основе TFT.

Редактор Nextion можно скачать по этой ссылке

nextion.itead.cc/resources/download/nextion-editor/

После скачивания установите редактор nextion.

Шаг 1. Редактор Nextion

Откройте редактор nextion ниже, чтобы увидеть окно nextion, в нем есть дополнительные окна. Toolbox в этом окне будет набор функций, таких как отображение текста, добавление кнопки или создание циферблата и т. Д. Мы можем перетащить эти объекты в главное окно. В нижнем левом углу находится окно изображения и шрифта, где пользователь может добавлять изображения с помощью символа «+» и удалять изображения с помощью символа «-». В правом верхнем углу находится окно страницы, где пользователь может добавлять или удалять страницы. В правом нижнем углу находится окно атрибутов, здесь пользователь может изменять параметры объектов. Внизу есть два окна, одно - окно вывода и окно событий. отобразит ошибку компилятора. Пользователь выберет объекты и напишет код в окне событий, чтобы все произошло.

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

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

Шаг 2: добавление изображений и шрифта

На изображении 4 вы можете увидеть, как создать шрифт. Перейдите к инструментам и щелкните Генератор шрифтов, появится окно создания шрифта, в нем выберите высоту и тип шрифта, дайте имя шрифта и щелкните шрифт генератора. После создания шрифта nextion спросит, следует ли добавить шрифт или нет.

На изображении 5 вы можете увидеть, как добавить шрифт, он выделен на снимке. Используя символы + и -, пользователь может добавлять или удалять шрифт.

В image6 вы можете увидеть, как добавлять или удалять изображения, выбрав «+» или «-» соответственно.

Шаг 3: Создание кнопки

Image7 показывает, как добавить объекты в главное окно из панели инструментов. Например, нажмите кнопку двойного состояния объекта, она появится в главном окне, как показано на изображении7: объект кнопки двойного состояния bt0. Пользователь может перемещать кнопку по осям x и y. Мы покажем, как создать кнопку переключения с двойным состоянием.

На изображении 8 мы видим, что изображение кнопки было изменено в зависимости от пользователя. Нам нужно нажать на кнопку bt0, в окне атрибутов появятся параметры кнопки. В этом случае пользователю необходимо изменить параметр sta на изображение, а на вкладке pic0 и pic1 пользователю необходимо назначить изображения, которые он хочет применить.

На изображении 9 показано окончательное расположение всех кнопок, включая наименования. Здесь мы добавили bt0, bt1, bt2 и bt3 для button0, button1, button2 и button3 соответственно.

Шаг 4: Код события для кнопки переключения

Изображение 10 показывает предварительную инициализацию скорости передачи = 115200 в окне событий, его часть кода. Пользователь может инициализировать в этой части, относящейся к отображению.

На изображении 11 показана часть кода кнопки bt0, здесь мы печатаем серийный номер в зависимости от состояния переменной кнопки, т.е. для переменной bt0, равной 0, мы отправляем серийный номер «R10», а для переменной bt0, равной 1, мы отправляем «R11». к особенно Как только Esp получает R10, он выключает 1-е реле, а когда он получает R11, 1-е реле включается. Точно так же нам нужно закодировать для всех кнопок, например, bt1, bt2 и bt3.

Шаг 5: отладка графического интерфейса

После того, как все закодировано, нам нужно скомпилировать, если нет ошибок, мы можем отладить созданный графический интерфейс, работающий в соответствии с нашими требованиями, перед загрузкой на дисплей nextion. На изображении 12 показано окно отладчика, здесь пользователь может выбрать текущий симулятор с помощью раскрывающейся кнопки и проверить, работает ли он в соответствии с пользователем.

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

На изображении 13 показано окно загрузки на устройство Nextion, здесь вам нужно выбрать com-порт и скорость передачи данных. После этого необходимо нажать кнопку «Перейти» для загрузки в код, загрузка может занять некоторое время.

Шаг 6: Работа устройства

На рисунке 14 показана схема подключения платы с четырьмя реле ESP 32 Wi-Fi с дисплеем соединения. От платы J1 и J2 ESP 32 подключите 5 В и заземление (G) к дисплею соединения, как показано ниже. Подключите передатчик соединения к Rx0 ESP32. платы и Rx соединения с Tx0 платы ESP32. Это установит связь UART.

Работает: после того, как все подключено к питанию, устройство настройте устройство с ssid и паролем и брокером mqtt с названием темы публикации и подстрочного индекса. После отправки учетных данных устройство перезагрузится и подключится к mqtt. Устройство уже настроено на openhab (для openhab, пожалуйста, проверьте наш инструкции openhab), как показано на изображении 15.

Устройством можно управлять с помощью http, mqtt, а также через сенсорный экран GUI. Мы можем получить текущее состояние всех каналов реле, независимо от того, включены они или выключены, как на mqtt, так и на сенсорном экране.

Шаг 7: Помощь Nextion

На рисунке 17 показано окно для набора инструкций nextion, в котором пользователь может получить помощь.