Урок 4. Выводим кнопку на дисплей DWIN. Среда разработки DGUS.

Продолжаем изучать среду разработки DGUS (DWIN Graphic Utilized Software). Данное программное обеспечение позволяет создавать красивые интерфейсы для HMI дисплеев компании DWIN. Сегодня на уроке научимся создавать кнопки. В этом нам поможет инструмент «Return Key code». Информацию о других инструментах среды разработки DGUS вы можете прочитать в разделе сайта «DWIN».

Создаём кнопку на дисплее DWIN.

Так же, как и в дисплее Nextion, для создания кнопки достаточно использовать всего один инструмент - «Return Key code». Как вывести кнопку на дисплей Nextion, я рассказывал в одном из своих уроках. Для дисплея Nextion можно сделать кнопку без картинки или с помощью иконки или двух фоновых изображений. Для дисплеев DWIN создание кнопки происходит с использованием двух фоновых изображений. Т.е. на одном изображении располагаются кнопки, которые находятся в пассивном состоянии (кнопка не нажата).

На втором изображении располагаются кнопки в активном состоянии (кнопка нажата).

Как происходит подмена изображений, рассмотрим подробнее ниже при рассмотрении работы с инструментом «Return Key code».

Инструмент Return Key code.

В инструкции по работе со средой DGUS есть подробное описание «Return Key code» на английском языке. Скачать инструкцию на английском языке вы можете внизу статьи в разделе «файлы для скачивания». Давайте подробнее рассмотрим инструмент «Return Key code» и постараемся понять, как с помощью данного инструмента сделать кнопку.

Как создать кнопку с фиксацией, я уже рассказывал в проекте «Управление реле с помощью сенсорного дисплея DWIN и Arduino, ESP32». В данном проекте используются 2 кнопки, которые помогают включить и выключить все реле.

На картинке ниже приведено описание «Return Key code» с переводом на русский язык.

Для того чтобы при нажатии на кнопку данные предавались по UART, необходимо поставить галочку «Data auto-uploading».

Эффект нажатия на кнопку создаётся сменой изображения, в этом помогает параметр «Button effect». Тут нужно выбрать изображение, на котором располагается кнопка в активном состоянии. Работает это следующим образом: при нажатии на область, которая выделана элементом «Return Key code», она [область] меняется на фрагмент, изображение которое выбрано в поле «Button effect».

Следующий параметр «Page switching» использовать в данном уроке не будем, так как он нужен для создания кнопки перехода на другую страницу. Это может быть страница настроек или дополнительные инструменты управления. Для этого в данном параметре нужно выбрать изображение, на которое требуется сделать переход. И данное изображение будет новой страницей, на которой можно расположить различные инструменты управления. Как видим, среда разработки DGUS работает в основном с изображениями.

В проекте «Управление реле с помощью сенсорного дисплея DWIN и Arduino, ESP32» необходимо при нажатии на кнопку включать или выключать все реле. Также менять состояние всех кнопок - переключателей. Про переключатели (кнопки с фиксацией) вы можете почитать в предыдущем уроке.

Поэтому для включения всех реле отправляем значение «0xFFFF», а для выключения реле - значение «0x0000».

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

Также можно отправить байтовые значения.

Код Arduino для работы с кнопками на дисплее DWIN.

На примере проекта «Управление реле с помощью сенсорного дисплея DWIN и Arduino, ESP32» рассмотрим работу кнопки и разберём код, позволяющий понять, что кнопка была нажата и выполнить необходимые действия. В данном проекте это включение всех реле при нажатии на одну кнопку и выключение всех реле при нажатии на вторую кнопку.

Схема подключения Arduino, модуля 8 реле и дисплея DWIN.

Для проверки, как это всё работает, можно подключить светодиоды к соответствующим pins Arduino или реле, как показано на картинке ниже.

Также можно использовать данный код с ESP32. Посмотреть схемы подключения и код вы можете на странице проекта «Управление реле с помощью сенсорного дисплея DWIN и Arduino, ESP32».

Описание кода обработки нажатия на кнопку.

Данный проект является не очень хорошим примером для разбора работы кнопки. Так как мы получаем значения 0xFFFF и 0x0000, что соответствует «1111111111111111» или «0» в двоичной системе счисления, тем самым мы отправляем команду на включение 16 реле. А одни нули выключают все реле. Код из прошлого урока будет обрабатывать нажатия кнопки включения и выключения всех реле. При этом дописывать ничего не нужно.

Для того чтобы выполнять определённое действие, можно отправлять 1 байт информации на микроконтроллер, как показано на картинке ниже. Это позволит сделать обычную кнопку, например, для включения 1 реле или другого устройства. С данным примером мы ещё встретимся в следующих проектах и уроках.

И полезная информация для тех, кто дочитал до конца статьи. У вас есть уникальная возможность заказать тестовый образец дисплея компании DWIN Technology. Подробнее тут.

Приобрести дисплей DWIN можно в официальном магазине DWIN Technology на AliExpress. Воспользуйтесь промокодом ARDUINOTEX или ARDUINOTEX1 и получите хорошую скидку. А также гарантированную техническую поддержку.

Понравился урок Выводим кнопку на дисплей DWIN? Не забудь поделиться с друзьями в соц. сетях.

А также подписаться на наш канал на YouTube, вступить в группу Вконтакте.

Спасибо за внимание!

Технологии начинаются с простого!

Фотографии к статье

 

 

 

 

 

Файлы для скачивания

	Прошивка для дисплея DWIN.zip	690 Kb	957	Скачать Вы можете скачать файл.
	Кода для обработки нажатия на кнопку с фиксацией (lite).zip	2 Kb	669	Скачать Вы можете скачать файл.
	Кода для обработки нажатия на кнопку.zip	2 Kb	712	Скачать Вы можете скачать файл.
	T5L_DGUSII - на английское языке.pdf	11380 Kb	652	Скачать Вы можете скачать файл.