Дисплей Nextion: азы. Arduino, ESP8266.

Если вы еще боитесь ESP-8266 - вам сюда.

===============================================

ИМХО, Nextion в домашнем хозяйстве будет вещью необходимой. Особенно, если есть желание заставить дом поумнеть.
В паре заметок хочу поделиться опытом изысканий на тему этой железки и некоторыми вещами, о которых почему-то не говорится.

Тема эта, похоже, необъятная и осветить ее удастся только частично.

Nextion - есть дисплей, который управляется собственным процессором.
Nextion создает внутри себя шаблоны разных элементов, которые по UART принимают команды и меняют свое состояние. Или наоборот - отправляют команды по UART.
Кнопка, нарисованная в графическом редакторе, будет существовать не в памяти МК, а в памяти дисплея.
Нажатие на эту кнопку (касание дисплея) вызовет передачу в UART некоторого кода, который вы сами можете определить.
Вот как в моем домашнем хозяйстве это выглядит:





Общий смысл понятен. Для Ардуино под Nextion написана специальная библиотека, и члены секты Arduino IDE - велкам изучать что там есть, или после прочтения данного поста можно перейти сюда.

Мы же будем прикручивать к дисплею ESP8266 на NodeMCU - это, полагаю, лучшее решение для умного дома.

Задача: Nextion + ESP8266 + MQTT = решение для любой системы, на которой ни сделан сообразительный дом.

Первое, что нужно сделать - скачать Netion Editor.
Это скачивание полезно всем - и тем кто купил дисплей и тем, кто не решился или не уверен - нужно оно ему или нет.

1. Nextion Editor имеет встроенный эмулятор дисплея. Поэтому, вы можете поиграть с дисплеем и применить его на практике до покупки. Понравилось - покупаем, нет - сносим программу и забываем о ней.
2. Nextion Editor обеспечивает программную связь между эмулируемым дисплеем и вашим железом, плодключенным по USB. Таким образом, вы можете не только эмулировать дисплей, но и присоединять его к железу и программировать и то и другое, каждый раз наблюдая за результатом работы. ESP8266 или Ардуино - все сгодися.

Итак, разработка и настройка вашего устройства будет приятной и удобной.
==============================================================

Что подразумевает управление умным домом через дисплей? Полагаю, решение трех задачек:

• индикация некоторых данных;
• выключение\выключение чего либо;
• изменение каких-то параметров.

Вот на этих трех вопросах и сосредоточимся.

1. Индикация данных

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

Кстати, фонарик на втором фото не для красоты, это кнопка - нажатие на нее включает или выключает уличное освещение, при этом фонарик меняет свое изображение: светится или нет. Сравните с первым фото.

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


В открывшемся окне все первоначально достаточно понятно. Слева шаблоны элементов, которые прыгают на окно лисплея, если по ним щелкнуть мышью и получают дефолтные названия.

Но начинать следует не с этого, а со снабжения вашего проекта шрифтами.


Сгенерированнфй фонт появится в окошке слева внизу. Он также будет сохранен в виде файла и его можно будет импортировать вновь.


Добавляем текстовое поле в центр экрана.


Это поле имеет сгенерированное название t0. Следующее будет иметь t1. Схема ясна.

Изменим некоторые параметры текстового поля, а именно:


Зеленым подсвечиваются параметры, которые можно менять командами UART. Жирный зеленый - меняется сразу по команде. Тонкий - не меняется сразу, надо подать команду на refresh этого поля.

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

Чтобы изменить состояние нашего текстового поля, по UART ему должна прийти следующая команда:
t0.txt="12.34"0xff0xff0xff Вот и добивайтесь, чтобы ESP-8266 выгнал в порт именно эту конструкцию.
0xff0xff0xff - должно завершать любую команду, которая поступает на дисплей.

Вот кусочек кода, который передаст на Nextion то, что мы отправим ему через MQTT:

Код (Lua):

m:on("message", function(conn, topic, data)
    topic = topic..'.txt='..'\"'..data..'\"'..'\255\255\255'
    uart.write(0,topic)
end)
 

Здесь topic должен иметь значение t0 для нашего примера, data - то что отразится в элементе t0.

Наше дальнейшее руководство к действию находится здесь: https://www.itead.cc/wiki/Nextion_Instruction_Set

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

Для OpenHAB итем, который отправит температуру на Nextion, будет выглядеть так:

Код (Java):

Number next01t0 "Температура Дача [%.2f °C]" (Nextion01) { mqtt=">[mosquitto:t0:command:*:default]" }

Правило, которое будет его обслуживать, принимая информацию от датчика и отправляя ее на Nextion, будет выглядеть так:

Код (Java):

rule "Dacha Temperature To Nextion01"
when
      Item Temperature_D_out01 received update
then
    sendCommand(next01t0, Temperature_D_out01.state.toString)
end

Как это все соединить с ESP8266?
Находим и нажимаем кнопку Debag и видим такую картину:


Что следует заметить. Nextion по умолчанию работает на скорости 9600. Ее можно изменить.

Новые прошивки ESP8266 стартуют на скорости 115200. Казалось бы, совсем неплохо подтянуть и Nextion к этой скорости, но делать этого категорически не следует и вот почему.
Когда стартует ESP8266, он выдает в UART кучу информации. Эта информация, естественно попадает в Nextion. Не признав ее командой, Nextion отвечает в UART на своем наречии: "Не понял".
Этот ответ получает ESP8266 и отвечает тоже: "И я не понял". Получив это сообщение, Nextion огрызается обратно.
Короче, система входит в ступор: две железки начинают гавкать друг на друга.
Вот чтобы этого избежать, они должны стартовать на разных скоростях, а после старта скорость ESP8266 снижается до 9600 следующим образом:

Код (Javascript):

uart.setup(0,9600,8,uart.PARITY_NONE,uart.STOPBITS_1,1)

UPD 15.11.2016. Ещё вариант не допустить пустых споров модулей - запретить дисплею лаяться в ответ командой

Код (C++):

bkcmd=0

Как это сделать при старте, надеюсь, вы легко сообразите сами.
Здесь пример того, как опытный товарищ работает ESP8266+Nextion:

Но его код... Это что-то. http://tech.scargill.net/nextion-wifi-touch-display/ Но мы сделаем проще и не хуже

А это наши устройства:

Вот теперь точно все.
Дополнительное чтение: https://geektimes.ru/company/flprog/blog/273868/

 

2. Кнопка
Сначала видео.

Пошагово.
Создаем новую страницу.
На первой странице создаем область "Hotspot". Это тоже кнопка, но "бестелесная". Она "висит" над страницей и нажатие на нее приводит к тем результатам, которые запланированы. Запланирован page 1 - переход на страницу 1.
Добавляем две заранее сохраненные картинки.
Добавляем Dual-state button.
Выбираем ее состояние как глобальное и две картинки для положения. Удаляем текст надписи.
Добавляем код, который прост и понятен.

Код (C++):

if(bt0.val==1)
{
  get "bt0:ON"
}else
{
  get "bt0:OFF"
}
 

Нажимаем кнопку Debag и наблюдаем за тем, как дисплей выдает в порт информацию.
Еще больше сюсек-пусек можете посмотреть у этого автора:

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

Редактор дисплея находится в бета состоянии, поэтому в нем присутствуют баги.

1. Главный баг, который может поставить в тупик - это обновление версии. Вчера вы сделали что-то, сегодня обновились (а редактор не дает вам возможности отказаться), и нынешняя попытка дебажить выкидывает ворох красных строк, понять в чем дело не возможно.

А дело в том, что редактор НЕ МОЖЕТ правильно разобраться с кнопками, и придется их переделывать заново. Точно так же, как в прошлой версии - но заново.

2. Тупой баг, который не устраняют. Вы решили нарисовать линию, пришли туда, где объясняют как это делать. Скопировали код примера:

Код (Bash):

line 0, 0, 100, 100, RED

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

А все потому, что в документации ПРИМЕРЫ НАПИСАНЫ НЕ В СООТВЕТСТВИИ С ПРАВИЛАМИ, которые установили они сами, а именно, надо так:

Код (C++):

line 0,0,100,100,RED

Команда, и аргументы без пробелов. Так все работает.
Но, скажите мне, вам придет в голову это, когда вы в первый раз открылди мануал?
Так вот, 3/4 примеров не работают, если попытаться их скопировать и воспроизвести самостоятиельно.
Понимаю, что секта ардуинщиков пользуется библиотекой. А ступор свободных землепашцев?

3. Идиотский баг. Вы видели как создавать кнопку? А теперь попробуйте сделать то же самое в новом проекте, в который не установлен фонт - вам, предположим, нужна только кнопка. Результат будет интересен.

4. Просто фигня какая-то. На странице загрузки версии 0.37 указано, что в новой версии появилось: 2, Add "click" instruction. И где концы найти этого?
----------------------------------------------------------

У дисплея есть три основные команды на отправку информации в порт, а именно

• get
• print
• printh

get выдает информацию в виде:

• 0X70+ASCII code+0xff 0xff 0xff - когда посылаются текстовые данные, или
• 0X71+4 byte binary data+0xff 0xff 0xff - когда посылаются числовые данные

Нужны ли нам числовые данные? ИМХО, но очень большое, - нет. Дело в том, что MQTT все равно отправляет стринги, и если мы "выжмем" из дисплея число, то все равно придется его превращать в стринг в МК. Оно нам надо?

Так вот, подходу "без цифр" помогут следующие вещи:
print выдает в UART все как есть, без оконечных 0xff 0xff 0xff

Код (C++):

print t0.txt

- выдаст голый текст - значение текстового поля.

Код (C++):

print "Uraaaa!"

- напечатает Uraaaa!

printh загонит в UART один в один то, что будет стоять в аргументах в hex формате через пробел с маленькой буквы:

Код (C++):

printh a0 fe 11

Собственно, у нас теперь есть все, чтобы понять что же передаст в UART наш код кнопки.

Код (Lua):

\112bt0:ON\255\55\255
-- или
\112bt0:OFF\255\55\255
 

Принимаем:

Код (Lua):

lt = false -- прием сообщения
str = ""
count = 0

uart.on("data",1, -- работаем с каждым пришедшим байтом
    function(dt) -- dt - это  есть каждый новый байт
    if lt then  -- прием разрешен
        if dt == "\255" then -- сравниваем с 0xff и считаем их до трех
            count = count + 1
            if count == 3 then -- досчитали
                count = 0 -- сбросили счетчик
                pub(str) -- публикуем          
                str = "" -- очистили глобальную
                lt = false -- конец приема
            end
        else
            str = str..dt -- идет прием - формируем стринг
            -- если что-то идет криво и набралось много буков
            -- убиваем все и начинаем заново
            if #str > 20 then str = ""; count = 0 end
        end
    end

    -- вначале у нас пустой стринг и \112 на входе:
    -- начинаем прием
    if str == "" and dt == "\112" then
        lt = true
    end
end, 0)

Отправляем куда надо:

Код (Lua):

function pub(pu) -- этим публикуем
    local topic
    local info
    -- делим пришедшее на до и после ":"
    topic, info = string.match(pu, "(%w+):(%w+)")
    -- проверяем на неотсутствие отсутствия
    if topic ~= nil and info ~= nil then
    -- и отправляем в ОпенХаб
        m:publish(mClnt.."/"..topic.."/state",info,0,0)
    end
    collectgarbage()
end
 

 

3. Отправка данных
И, наконец, пора отправлять переменные...

Что делаем здесь?
Добавляем цифровое поле (n0), вертикальный слайдер с глобальным доступом (h0) установив пределы изменения 0-10, и текствовую переменную (va0).
Добавляем код

Код (C++):

n0.val=h0.val

в два места:

• преинициализация страницы 0 - чтобы при открытии совпадали значения цифрового поля и слайдера
• во вкладку движения слайдера: слайдер двигаем - циферки бегают.

А во вкладку отпускания слайдера вставляем такой код:

Код (C++):

cov h0.val,va0.txt,0 // конвертируем значение слайдера в стринг переменной
// Отправляем данные в UART
printh 70 // начало передачи
print "n0:" // будущий топик
print va0.txt // будущая дата
printh ff ff ff // завершение отправки
 

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

Дык... А как же отрицательные и дробные числа?
На такой вопрос на форуме одного из юзеров программист из Nextion ответил прямо: "Учитесь программировать" и приложил проект, который я для вас переприкладываю.

 

Конечно разойдутся, первый вопрос - зачем примитивный дисплей с примитивным разрешением ?
Почему не дешевый планшет с виндой или андроидом, с нормальным дисплеем за 40-50 долларов в отличии от 3,5 Нехтиона за 35 долларов. Нормальное приложение в аппинверторе для андроида или у повелителя теплиц для виндоуса ?
Фотка как из бани в Суздале, только без дисплейчика и свежевыловленных осетров.

я просто ваш поклоник и критик.
Ждем продолжения

 

B заключение - мой вариант отправки положительных и отрицательных чисел с плавающей точкой:

 

Делаю сейчас один проект на nextion enhanced+esp8266. Хотел сделать чтоб числовое поле двигалось вместе с ползунком слайдера. Пробовал так n0.x=h0.val, и так cov n0.x,h0.val,0. В обоих случаях программа заругалась. Может есть какие-то другие возможности?

 

Это не будет работать, потому что конвертация не нужна - оба значения цифровые.

А это не будет работать, потому что значения координат не подлежат динамическому изменению таким образом. Обратите внимание - они в таблице свойств окрашены черным, а не зеленым цветом.

Как можно решить вопрос перемещения? Только путем, условно, мультипликации: показывать и прятать что-то в зависимости от положения движка слайдера.

 

Жаль. Тогда другой вопрос. Авот как передать числовой параметр?

Код (C++):

printh 70
print "n0:"
print n0.val
printh ff ff ff

Вот такой код выдает "n0:d". n0.val=100

 

Не выдаёт.

 

ИгорьК .Затер до дыр эту тему ,потому ,что купил этот дисплей .Решил применить его в своем "хозяйстве" . На мой взгляд этого гениальное изобретение !
Трудности возникли в мелочах:
Как и все ,что попадает мне в руки сначала кручу-верчу понять хочу )) Когда мозг уже немного устал ,начинаю искать доп. информацию описание, перевод , видео и т.д.
В дополнение к твоим коментам:
Что бы стало еще более понятно для тех кто приобрел
1. прошивку для этого дисплея (по моему скромному мнению) надо начинать писать не задумываясь о связи с микроконтроллером .Просто пишешь ,что бы нажимались кнопки ,открывались страницы и т.д.
2.Загрузить ее на дисплей проще с SD карты (копируешь на карту файл с расширением tft , который можно найти, сохранив свое творение и открыв вкладку file/Open build folder/...
Теперь все что мы видели на компе видно на дисплее
3 Библиотека выше представленная ,для меня показалась не очень удобная для ардуино,
нашел другую не помню как и где

 

В папке библиотеки для ардуино ,не должно быть других библиотек для этого девайса иначе будут ошибки, также библиотека не должна содержать дефис(-) ,его надо заменить на нижний прочерк (_)

 

вот мой небольшой пример . Для начала видео

 

вот файл для дисплея (в редакторе)

 

вот для ардуино

 

Да и еще одно, в прошивке для ардуино в строках например таких как if (message == "65 0 3 1 ffff ffff ffff") должно быть ваше значение ,которое выдает дисплей в редакторе ,возможно и нумерация кнопок и т д

 

Пока не забыл ! земля у ардуины и дисплея должна быть общая !

 

Благодаря Вашим сообщениям изменил заголовок темы
Не изучал библиотеку для ардуино по понятным причинам, но все равно убежден что и на Ардуино с дисплеем лучше работать без неё, "в лоб" через софтверный сериал.
Как пример, посмотрите как замечательно работает с дисплеем товарищ DIYMan. В его проекте теплицы есть такой раздел.
Я, основательно изучив его решение, пошёл слегка иным путем, но его подходы для ардуино стоит знать.

 

Я тоже чую ,что там не нужна библиотека )

 

Еще пример (пока заготовка):

UPD01.12.2016: И файл Nextion впридачу.