Nextion editor язык программирования

Элементы платы

Экран с тачскрином

За отображение информации отвечает ЖК-матрица TFT IPS диагональю 10,1 дюйма и разрешением 1024×600 пикселей с глубиной 65536 цветов. В дисплей встроена LED-подсветка, яркость которой регулируется от 0 до 300 кд/м2 с шагом 1%.

Контроллер дисплея AI HMI

Сердцем дисплея является контроллер AI HMI с тактовой частотой до 200 МГц, который является посредником между ЖК-матрицей экрана и управляющей платой. Контролер обладает блоками памяти EEPROM на 1 КБ для хранения пользовательских данных при отключенном питании и SRAM на 512 КБ для хранения переменных во время исполнения программы.

Flash-память W29N01HVXINA

За хранение прошивки, пользовательских картинок, аудио и видео данных отвечает внешняя Flash-память W29N01HVSINA на 128 МБ.

Чип RTC AT8563

Микросхема AT8563 — это часы реального времени, которые подскажут текущее время и дату. А при отключённом питании, чип продолжит отчитывать время и поможет зафиксировать важные события.

Для работы часов реального времени при отключённом питании, установите элемент питания формфактора CR1220 / CR1225 в батарейный отсек на плате дисплея.

Слот для батарейки

На плате модуля расположен батарейный отсек BH500 для элемента питания CR1220 / CR1225, которая обеспечивает питание .

Преобразователь логических уровней SN74HC86

Преобразователь логических уровней на микросхеме 74HC86 необходим для сопряжения экрана с разными напряжениями цифровых сигналов от 3,3 до 5 вольт. Другими словами дисплейный модуль совместим как с 3,3 вольтовыми платами, например Espruino, так и с 5 вольтовыми — например Arduino Uno.

Разъём питания и данных

Дисплей подключается к управляющей электронике через разъём JST XH-3 Male (папа). Для коммуникации используйте кабель с разъёмом JST XH-3 Female с четырьмя проводниками на конце:

  • Земля (G) — чёрный провод. Соедините с землёй микроконтроллера.
  • Сигнальный (RX) — жёлтый провод, цифровой вход дисплейного модуля. Используется для приёма данных из микроконтроллера. Подключите к пину TX микроконтроллера.
  • Сигнальный (TX) — синий провод, цифровой выход дисплейного модуля. Используется для передачи данных в микроконтроллер. Подключите к пину RX микроконтроллера.
  • Питание (V) — красный провод. Соедините с питанием микроконтроллера.

Слот microSD карты

Дисплейный модуль поддерживает прошивку через SD-карту. Скопируйте файл проекта из программы Nextion Editor в корень microSD-шки, вставьте её в картридер и включите дисплей — прошивка начнётся автоматически. Подробности читайте в нашей документации на «Nextion Editor».

Разъём внешних GPIO

Дисплей является самодостаточным устройством и обладает собственными GPIO-пинами. К контактам можно подключать простые модули и датчики: например кнопки, светодиоды или реле.

№ Вывода Имя сигнала Описание
1 GND Земля
2 IO_0 Цифровой пин GPIO0
3 IO_1 Цифровой пин GPIO1
4 IO_2 Цифровой пин GPIO2
5 IO_3 Цифровой пин GPIO3
6 IO_4 Цифровой пин GPIO4
7 IO_5 Цифровой пин GPIO5
8 IO_6 Цифровой пин GPIO6 с поддержкой ШИМ
9 IO_7 Цифровой пин GPIO7 с поддержкой ШИМ
10 +5V Питание дисплея

Для коммуникации используйте дополнительные модули от Nextion.

Аудиовыход

Дисплей позволяет выводить аудиозвук: для этого предусмотрен разъём JST SH-2 Male (папа) для подключения наушников или внешней акустики. Мощность выходного сигнала 0,5 Вт. В качестве ответной части подойдёт коннектор JST SH-2 Female (мама) совместно с динамиком HSP3040A.

Создание интерфейса

Как уже было сказано, дисплей Nextion имеет свой собственный контроллер, который отвечает за отрисовку графики. Чтобы этому контроллеру было что рисовать, мы должны заранее создать графические образы, связать их с командами, и загрузить всё это в память дисплея. Для этих целей мы воспользуемся специальным редактором интерфейсов, который был разработан командой Nextion. Скачать редактор можно на официальном сайте. Для русификации редактора следует заменить файл cs.lang в папке с редактором. Переведенный файл можно взять тут: http://git.robotclass.ru/download/NextionEditor Наша задача будет состоять в том, чтобы сделать графический интерфейс для отображения показаний акселерометра. Соответственно, нам понадобится создать какой-то красивый фон, разместить на нем поля для вывода чисел. Также хотелось бы добавить и какие-нибудь компоненты для визуализации показаний, например шкальные индикаторы. Итак, запускаем редактор. Перед нами появляется главная форма. 1) Первое что мы сделаем — создадим новый проект. Жмем меню «Файл/Новый», выбираем папку где будет храниться файл проекта и его имя, например, test.hmi. Затем выбираем в появившемся окне подходящий формат и ориентацию дисплея. 2) Теперь добавим фон нашего интерфейса. Жмем кнопку «Добав.» (Add) в разделе Изображения. В появившемся окне выбираем файл картинки с разрешением 320×240. Для урока мы нарисовали свой фон, в виде трех оранжевых прямоугольных областей. 3) Добавляем в интерфейс компонент «Изображение». По-умолчанию, компонент размещается в левом верхнем углу. Не будем его никуда двигать, и перейдем к настройкам компонента. 4) Ассоциируем компонент и ранее добавленную картинку. Для этого, в разделе настроек компонента жмем на параметр pic, и выбираем единственную в списке картинку. 5) Аналогичным образом, добавляем компонент «Индикатор выполнения». Обычно этот блок служит для отображения статуса загрузки данных, но мы используем его для визуализации показаний с нашего датчика. Параметры bco и pco задают цвет фона элемента и цвет, которым заполняется индикатор. В нашем случае фон белый, и сам индикатор синий. Параметр val определяет степень наполнения индикатора, и варьируется от 0 до 100. Именно этот параметр мы и будем менять с помощью Arduino. Кстати, можно менять любой параметр, отмеченный зеленым цветом. Остальные параметры отвечают за положение элемента на дисплее: x и y, а также за его размеры: w и h. 6) Добавляем на дисплей еще два таких же индикатора и настраиваем их. Затем добавляем компонент «стрелка» (gauge). Стрелка — это что-то вроде стрелки на спидометре автомобиля. Имеет диапазон значений от 0 до 360. Размещаем её в верхней правой части дисплея. Чтобы у стрелки был красивый круглый фон (можно и циферблат нарисовать), мы переключим параметр sta в режим crop image. Потребуется заполнить параметр picc; укажем там ту же картинку, что и для фона. Crop image означает, что фон компонента станет прозрачным, и через него будет просвечивать указанная в параметре picc картинка. 7) Перед тем, как добавить числовые поля, создадим шрифт. У дисплея нет такого же хранилища шрифтов, как в MS Windows, и он не умеет пользоваться стандартными файлами ttf. Чтобы добавить шрифт, нажмем кнопку «Добав.» (Add) в блоке «Шрифты», который находится в левой части редактора. Задаем высоту шрифта, жирность. Указываем имя шрифта. При изменении каждого параметра, в маленьком черном квадратике будет меняться написание буквы X. Не очень удобная настройка, но что поделать. Наконец, в поле «Имя шрифта» записываем подходящее название латинскими буквами и жмем «Создать шрифт». Генератор пробежится по всем буквам векторного шрифта, и создаст их растровые изображения, который мы потом загрузим в память дисплея вместе с графикой. 8) Добавляем на форму три компонента «Число». В настройках компонента указываем номер шрифта font. У нас создан пока только один шрифт, так что его номер будет — . Параметр val отвечает за содержимое поля, его мы будем задавать через Arduino. В примере мы так же поменяли цвет и фон компонента. 9) Последний компонент, который мы разместим на нашем дисплее — «Текст». Мы не будем менять его содержимое, просто что-нибудь напишем в параметре text. 10) Наконец, скомпилируем все что мы сделали в файл, который затем отправится в память дисплея. Жмем кнопку «Компилировать» (Compile). Файл имеет расширение tft и хранится в папке, которую можно открыть через меню «Файл/Открыть папку с tft файлами». С интерфейсом всё, переходим к самой ответственной части.

Project Resources

We won’t cover step-by-step how to build the GUI in the Nextion display. But we’ll show you how to build the most important parts, so that you can learn how to actually build the user interface. After following the instructions, you should be able to complete the user interface yourself.

Additionally, we provide all the resources you need to complete this project. Here’s all the resources you need (be aware that you may need to change some settings on the user interface to match your display size):

  • .HMI file (this file can be imported into the Nextion Editor to edit the GUI);
  • background image used in the user interface should also be in the project folder;
  • .TFT file (this file should be uploaded to the Nextion display, this is the file that the display runs);
  • .ino file (this is the file you should upload to your Arduino board).

Downloading Nextion Libraries

Before getting started, you also need to install the Nextion libraries for Arduino IDE. Follow the next steps to install the library:

  1. Click here to download the Nextion library for Arduino – ITEADLIB_Arduino_Nextion. You should have a .zip folder in your Downloads folder.
  2. Unzip the .zip folder and you should get ITEADLIB-Arduino-Nextion-master folder.
  3. Rename your folder from ITEADLIB_Arduino_Nextion-master to ITEADLIB_Arduino_Nextion.
  4. Move the ITEADLIB_Arduino_Nextion folder to your Arduino IDE installation libraries folder.
  5. Finally, re-open your Arduino IDE.

Configure Library for Arduino UNO

This library is configured for Arduino MEGA2560 by default. To make it work for Arduino Uno, you need to do the following:

1. Open the ITEADLIB_Arduino_Nextion folder

2. There should be a NexConfig.h file – open that file.

3. Comment line 27, so that it stays as follows:

//#define DEBUG_SERIAL_ENABLE

4. Comment line 32:

//#define dbSerial Serial

5. Change line 37, so that you have the following:

#define nexSerial Serial

6. Save the NexConfig.h file.

7. Here’s the final result:

Now, you are ready to start experimenting with the Nextion display with Arduino UNO.

Какую версию Arduino IDE скачать?

Сейчас прейдем ко второй программе, которая нам необходима для урока — это Arduino IDE.

Скачать программу можно также с сайта разработчика совершенно бесплатно. Для этого по предыдущей схеме ищем в поисковике слово «Arduino». На третьей позиции идем на сайт разработчика «arduino.cc».

На сайте переходим на страницу «SOFTWARE -> DONLOAD».

Тут вы можете скачать последнюю версию Arduino IDE для Windows, Mac OS или Linux. Но я не рекомендую использовать последнюю версию.

Так как с ней есть небольшие проблемы. Конечно, в рамках нашего проекта с данными проблемами скорее всего не столкнемся. Но все же, для того чтобы избежать ненужных проблем, рекомендую использовать версию 1.8.9. Для этого на данной странице нажмите на предыдущую версию. В момент написания урока это была версия 1.8.12.

После чего вы попадете на страницу с различными версиями Arduino IDE. Скачиваем версию 1.8.9 для вашей операционной системы.

Установка и настройка Arduino IDE.

Устанавливаем программу Arduino IDE. Процесс установки простой и проблем возникнуть не должно.

Так как большинство покупает комплектующие в Китае, нам также необходимо установить драйвер ch340 для того, чтобы компьютер распознал нашу плату.

Установка драйвера ch340 для Windows.

  1. Скачайте драйвер в разделе «».
  2. Распакуйте архив
  3. Запустите исполнительный файл CH341SER.EXE
  4. В открывшемся окне нажмите кнопку Install
  5. На этом установка завершена

В других операционных системах такой проблемы нет. Можно подключать и перепрошивать.

Загрузка примера кода в Arduino NANO

Для проверки того, что мы все сделали правильно и у нас все работает, загрузим самый распространенный код, позволяющий мигать встроенным светодиодом на плате. Светодиод подключен к 13 GPIO.

Arduino IDE устанавливается с небольшим набором примеров. В том числе есть пример, который нужен нам для урока. Для того чтобы загрузить пример, необходимо перейти в меню: «Файл -> Примеры -> 01.basics -> Blink». Откроется код примера.

Выбираем нашу плату Arduino NANO, данная плата бывает с разными процессорами. Я использую Китайскую версию с процессором ATmega328p. Выбираю процессор «ATmega328p (Old bootloader)» также нужно выбрать порт, к которому подключена плата, у меня это «COM8»

Для Arduino UNO все еще проще. Выбираем плату и порт подключения.

После чего можно загрузить код в плату.

На плате увидим мигающий светодиод. У меня он синего цвета. Чаще всего он красного цвета. Но может быть и зеленого. Все зависит от производителя платы.

На этом урок заканчиваю. В следующем уроке поговорим о графике для дисплея и посмотрим подробнее как работать с программой Nextion Editor.

Понравился Урок Скачать и установить Arduino IDE, Nextion Editor? Не забудь поделиться с друзьями в соц. сетях.

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

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

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

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

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

Скачивая материал, я соглашаюсь с
Правилами скачивания и использования материалов.

CH341SER.zip 186 Kb 66 Скачать

Урок 1.HMI.zip 2 Kb 41 Скачать

Project Overview

The best way to get familiar with a new software and a new device is to make a project example. Here we’re going to create a user interface in the Nextion display to control the Arduino pins, and display data.

Here’s the features of the application we’re going to build:

  • The user interface has two pages: one controls two LEDs connected to the Arduino pins, and the other shows data gathered from the DHT11 temperature and humidity sensor;
  • The first page has one button to turn an LED on, another button to turn an LED off, a label showing the LED current state;
  • This first page also has a slider to control the brightness of another LED;
  • The second page shows the current temperature in a text label, and the current humidity in a progress bar;
  • This page has an update button to update to the readings.

Подготовка проекта:

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

Загрузим в проект картинки нажав на кнопку «Add» (Добавить) в окне «Picture»

Обратите внимание на то, что в нижней части окна должна быть активна вкладка «Picture», а не «Fonts». Откроется окно выбора файлов

Укажите путь к папке с файлами картинок, выделите все картинки которые требуется добавить в проект и нажмите на кнопку «Открыть». Программа выдаст сообщение «import successfully 5 pieces» информируя Вас об успешной загрузке пяти картинок.Картинки и шрифт используемый в данном проекте можно скачать по этой ссылке.
Теперь в окне «Picture» появился список из 5 картинок которым вместо имён присвоены номера от 0 до 4, после номера указан размер картинок в пикселях. Если Вы захотите использовать картинку в элементах проекта, нужно будет указать её номер из этого списка.
Нажмите на вкладку «Fonts» в нижней части списка загруженных картинок, для перехода от списка загруженных картинок к списку загруженных шрифтов.
Окно «Picture» заменилось на окно «Fonts» список шрифтов которого пуст, так как шрифты еще не загружены в проект. Загрузить можно только шрифты с расширением «*.zi», если у Вас таких шрифтов нет, то их можно создать из любого шрифта установленного на Вашем компьютере.Для создания шрифта откроем генератор шрифтов из пункта меню «Tools > Font Generator»
В окне генератора шрифтов нужно выбрать имя системного шрифта (в поле «Preview Area») который Вы хотите использовать, высоту для создаваемого шрифта (в поле «Height») и придумать имя создаваемого шрифта (в поле «Font Name»). Если требуется, то можно изменить кодировку (в поле «Code») и выбрать полужирное начертание (установив галочку «Bold»). После чего создать шрифт нажав на кнопку «Generate font».
Откроется окно сохранения файла. Укажите путь к папке в которую Вы желаете сохранить файл сгенерированного шрифта и имя файла, после чего нажмите на кнопку «Сохранить».Чтоб не запутаться, лучше использовать папку в которой находится файл проекта, а в качестве имени файла использовать название системного шрифта.
Теперь можно загрузить шрифт (шрифты) в список шрифтов проекта нажав на кнопку «Add» (Добавить) в окне «Fonts», так же как Вы ранее добавляли картинки в окне «Picture».Картинки и шрифт (*.zi) используемый в данном проекте можно скачать по этой ссылке.
После выбора файла шрифта, в окне «Fonts» появится список из 1 шрифта которому будет присвоен номер 0, после номера указано имя шрифта, размер символа, кодировка и размер файла. Если Вы захотите использовать шрифт в элементах проекта, нужно будет указать его номер из этого списка. Если вы загрузите еще один шрифт, он отобразится в списке под номером 1 и т.д.

Differences

@@ -0,0 +1,58 @@
+#!/bin/bash
+# Date : (2016-05-03)
+# Distribution used to test : Duzeru GNU/Linux 2.0 64 bit
+# Author : Lukonin Kirill
+# Based on: Lightroom 5 script
+# Licence : GPLv3
+# PlayOnLinux: 4.2.9
+
+ && exit 0
+source "$PLAYONLINUX/lib/sources"
+
+PREFIX="Nextion"
+WINEVERSION="1.8-staging"
+TITLE="Nextion Editor 0.34"
+EDITOR="ITEAD Studio"
+PROG_URL="http://nextion.itead.cc/"
+AUTHOR="Lukonin Kirill"
+
+#Initialization
+POL_SetupWindow_Init
+      
+POL_Debug_Init
+
+#Presentation
+POL_SetupWindow_presentation "$TITLE" "$EDITOR" "$PROG_URL" "$AUTHOR" "$PREFIX"
+ 
+POL_SetupWindow_message "$(eval_gettext 'IMPORTANT: This program may work not well on Linux. Be careful.')" "$TITLE"
+ 
+# Create Prefix
+POL_SetupWindow_browse "$(eval_gettext 'Please select $TITLE install file.')" "$TITLE"
+POL_Wine_SelectPrefix "$PREFIX"
+POL_Wine_PrefixCreate "$WINEVERSION"
+Set_OS "win7"
+
+# Installation
+POL_Wine_WaitBefore "$TITLE"
+POL_Wine "$APP_ANSWER"
+POL_Wine_WaitExit "$TITLE"
+ 
+
+ 
+#Dependencies
+Set_OS "win7"
+POL_SetupWindow_message "$(eval_gettext 'Installing .NET framework. Please wait.')" "$TITLE"
+POL_Call POL_Install_dotnet45
+POL_SetupWindow_message "$(eval_gettext 'Installing Internet Explorer 8. Please click NEXT and ACCEPT during the installation process.')" "$TITLE"
+Set_OS "winxp"
+POL_Call POL_Install_ie8
+ 
+# Create Shortcuts
+#POL_Shortcut "Nextion" "$TITLE"
+# No now, but may be later ITEAD will provide a ZIP package instead of current installation program
+      
+POL_SetupWindow_Close
+exit 0
+
+#FIXME
+#For this moment ITEAD Studio provides only .exe installation program. It is not possible to run it on Linux. So we need to unpack it before and run through inside the nextion prefix
\ No newline at end of file

Getting a Nextion Display

You can grab a Nextion basic model, or a Nextion enhanced model. The Nextion enhanced has new features when compared with the basic model:

  • has a built-in RTC
  • supports saving data to flash
  • supports GPIOs
  • has larger flash capacity and larger CPU clock

The best model for you, will depend on your needs. If you’re just getting started with Nextion, we recommend getting the 3.2” size which is the one used in the Nextion Editor examples (the examples also work with other sizes, but you need to make some changes). Additionally, this is the most used size, which means more open-source examples and resources for this size.

You can check Maker Advisor website to get your Nextion display at the best price – just click the links below:

  • Nextion 2.8” basic model
  • Nextion 3.2” basic model

Загрузка файла интерфейса

1) Скачиваем python-скрипт из репозитория на github: https://github.com/makeitlab/software_tools/tree/master/TJCUpload 2) Чтобы его запустить, потребуется установить интерпретатор Python 2.7. 3) После установки python, установим библиотеку для работы с последовательным портом —  pyserial. 4) Скрипт имеет несколько важных параметров, которые хранятся в отдельном файле config.py: Последовательный порт, через который будет происходить загрузка. Меняем на актуальный: PORT = ‘COM6’ Загрузка прошивки идет в два этапа, с разной скоростью. Обычно эти параметры менять не следует. BAUDCOMM = 9600 BAUDUPLOAD = 115200 Идентификатор дисплея, который указан либо на самом дисплее, либо на коробке. В уроке мы использовали TJC3224T022. CHECK_MODEL = ‘TJC3224T022’ Наконец, параметр определяющий временную задержку в протоколе обмена. Этот параметр нужно будет изменить только если процедура загрузки не удастся. BAUDRATE_SWITCH_TIMEOUT = 0.5 5) Загружать прошивку будем через USB-UART мост, например такой: Схема соединения моста и дисплея:

Nextion/TJC GND VCC RX TX
USB-UART GND +5V TX0 RX1

6) Скопируем скомпилированный файл интерфейса tft в папку со скриптом, и запустим скрипт через командную строку:

c:путь_к_pythonpython.exe upload.py test.tft

7) После запуска скрипта на дисплее запустится процедура загрузки с индикатором хода выполнения. Если всё пошло как надо, то дисплей напишет об успешном выполнении процедуры и перезагрузится. Python-скрипт тоже отчитается о проделанной работе: Если загрузка зависла на 0%, значит следует изменить тот самый временной параметр в настройках. Рекомендую присвоить ему значение 0.05. Также предстоит починить прошивку дисплея, иначе он не даст повторить процедуру. Для этого понадобится microSD карта. Загружаем на карту подходящую прошивку из папки со скриптом «TJCUpload/Basic Recovery». Эта прошивка минимальная, и служит лишь для ремонта. Вставляем флешку в дисплей, подаем питание. Ждем несколько секунд, пока прошивка не загрузится автоматически. После этой процедуры можно повторить загрузку подготовленной ранее прошивки, не забыв изменить указанный параметр в файле настроек скрипта.

Adding Fonts

To write text on the display, you need to generate a font in the Nextion Editor. Go to Tools > Font Generator. A new window should open.

Here you can select the font height, type, spacing and if you want it to be bold or not. Give it a name and click the Generate font button. After that, save the .zi file and add the generator font by clicking yes.

The font will be added to the Fonts library at the left bottom corner and it will be given an index. As this is your first font, it will have the index 0.

Note: At the time of writing this instructions there is an issue with font types. Whatever font type you chose, it will always look the same. Still, you can edit the font size and if it is bold or not.

Nextion Editor Example Code

The .HMI file is included in the firmware folder.
Relevant data to note when looking at the .hmi example file.

  1. There are only three full screen graphics loaded and they are referenced as Pictures 0, 1 and 2. See the section «The Graphics and Image Cropping«.
  2. There is only one page and it is referenced as 0. Its background has been set to Picture 0.
  3. There are four components created:
    1. m0 (ID:1) is a touch area. The only parameter changed is in the Touch Press Event — Send key value is selected.
    2. b0 (ID:2) is an image crop button. The default image «picc» is 0. The Pressed image «picc2» is 1. In the Touch Release Event tab the Send key value is selected.
    3. b1 (ID:3) is an image crop button. The default image «picc» is 0. The Pressed image «picc2» is 1. In the Touch Release Event tab the Send key value is selected.
    4. t0 (ID:4) is a text area with a solid white background, right aligned.

The Pressed image configured to 1 is why the check boxes show the round grey circle when they are being pressed even though we haven’t configured anything in the Arduino yet.

Nextion и TJC

Nextion HMI — марка дисплея для европейского рынка. В Китае существует версия для внутреннего рынка, которая носит название TJC (по названию чипа). С точки зрения электроники, они полностью идентичны. Как это обычно бывает, версия для Европы стоит значительно дороже. Подвох тут в том, что европейский редактор не позволяет загружать прошивку в китайский дисплей. Делать же интерфейс в китайском редакторе, немного неудобно. Чтобы решить эту проблему, энтузиасты разработали различные варианты программ, которые позволяют загружать любую прошивку в любой дисплей, будь то Nextion или TJC. Одной такой программой, которую мы немного модернизировали, мы и воспользуемся.

Программа

Приступим к написанию программы для управления HMI дисплеем. Каждый компонент имеет свой идентификатор. Индикаторы выполнения, размещенные на форме: j0, j1 и j2. Числовые поля: n0, n1 и n2. Компонент «стрелка» получил идентификатор z0. Чтобы изменить параметр val у компонента, нам нужно передать в последовательный порт команду вида:

j0.val=44

Каждая команда должна завершаться тремя байтами 0xFF. Тестовая программа будет менять значение индикатора j0 в цикле.

void setValueJ(uint32_t number){    char buf = {0};    String cmd;      utoa(number, buf, 10);    cmd += "j0.val=";    cmd += buf;      sendCommand(cmd.c_str());  }    void sendCommand( const char* cmd ){    Serial.print(cmd);    Serial.write(0xff);    Serial.write(0xff);    Serial.write(0xff);  }    void setup() {    Serial.begin(9600);    delay(2000);    sendCommand( "" );    sendCommand( "page 0" );  }    void loop() {    for(int i=0; i i++){      setValueJ(i);      delay(10);    }  }

Загружаем программу на Ардуино, и подключаем дисплей по схеме:

Nextion/TJC GND VCC RX TX
Ардуино Уно GND +5V 1

Подаем питание на Ардуино и наблюдаем движение самого верхнего индикатора. Теперь добавим в скетч управление всеми остальными компонентами.

#include <wireclude><adafruit> t_ADXL345_Unified accel = Adafruit_ADXL345_Unified(12345);  float acc_lpf = {0,0,0};    void setValueJ(uint8_t jn, uint32_t number){    char buf1 = {0};    char buf2 = {0};    String cmd;      utoa(jn, buf1, 3);    utoa(number, buf2, 10);    cmd += "j"; cmd += buf1; cmd += ".val="; cmd += buf2;    sendCommand(cmd.c_str());  }    void setValueN(uint8_t nn, uint32_t number){    char buf1 = {0};    char buf2 = {0};    String cmd;    utoa(nn, buf1, 3);    utoa(number, buf2, 10);    cmd += "n"; cmd += buf1; cmd += ".val="; cmd += buf2;    sendCommand(cmd.c_str());  }    void setValueZ(uint8_t zn, uint32_t number){    char buf1 = {0};    char buf2 = {0};    String cmd;    utoa(zn, buf1, 3);    utoa(number, buf2, 10);    cmd += "z"; cmd += buf1; cmd += ".val="; cmd += buf2;    sendCommand(cmd.c_str());  }    void sendCommand( const char* cmd ){    Serial.print(cmd);    Serial.write(0xff);    Serial.write(0xff);    Serial.write(0xff);  }    void setup() {    Serial.begin(9600);    accel.begin();    accel.setRange(ADXL345_RANGE_8_G);    delay(2000);    sendCommand( "" );    sendCommand( "page 0" );  }    void loop() {    int r;    acc_lpf = acc_lpf*0.7 + accel.getX()*0.3;    acc_lpf = acc_lpf*0.7 + accel.getY()*0.3;    acc_lpf = acc_lpf*0.7 + accel.getZ()*0.3;      r = int((acc_lpf+500+61)/10);    r = int((acc_lpf+500+26)/10);    r = int(((acc_lpf-1500)+73+500)/10);      setValueZ(0, r*3);    setValueJ(0, r); setValueN(0, r);    setValueJ(1, r); setValueN(1, r);    setValueJ(2, r); setValueN(2, r);    delay(1);  }</adafruit></wireclude>

Библиотеки для работы с акселерометром можно скачать отсюда: https://github.com/adafruit/Adafruit_ADXL345 https://github.com/adafruit/Adafruit_Sensor Загружаем скетч на дисплей, и крутим акселерометр вокруг осей. Ну и небольшое видео, если у вас не грузится анимированный gif:

https://youtube.com/watch?v=ZmHhCh5STUk

Replies

fallenalien22
Sunday 22 May 2016 at 7:06

Please help me. Always gets stuck on «Moving files»

klukonin
Sunday 22 May 2016 at 17:00

Hi.

klukonin
Sunday 22 May 2016 at 17:03

Please use newest version.
And for this moment this script only generates the prefix.
You need unpacked archive with nextion editor.
Please, try this one
https://yadi.sk/d/y2nHcjqcrT2tJ

fallenalien22
Sunday 22 May 2016 at 19:54

Where can I find the latest version?

klukonin
Sunday 22 May 2016 at 21:05

Here.
Tuesday 3 May 2016 at 18:24

fallenalien22
Monday 23 May 2016 at 1:19

You mean «Try this update» posted Tuesday 3 May 2016 at 17:26? If so, I have tried it.

klukonin
Monday 23 May 2016 at 20:54

So, please try to run unpacked editor through this prefix.

Introducing the Nextion Display

Nextion is a Human Machine Interface (HMI) solution. Nextion displays are resistive touchscreens that makes it easy to build a Graphical User Interface (GUI). It is a great solution to monitor and control processes, being mainly applied to IoT applications.

There are several Nextion display modules, with sizes ranging from 2.4” to 7”.

The Nextion has a built-in ARM microcontroller that controls the display, for example it takes care of generating the buttons, creating text, store images or change the background. The Nextion communicates with any microcontroller using serial communication at a 9600 baud rate.

So, it works with any board that has serial capabilities like Arduino, Raspberry Pi, ESP8266, ESP32, and so on.

To design the GUI, you use the Nextion Editor, in which you can add buttons, gauges, progress bars, text labels, and more to the user interface in an easy way. We have the 2.8” Nextion display basic model, that is shown in the following figure.

Заключение

На этом уроке мы разобрали работу Nextion/TJC дисплея с разрешением 320×240 без тачскрина — это самый простой вариант из линейки. Разумеется, гораздо интереснее будет поработать с компонентами, отвечающими за реакцию тачскрина. На следующем уроке мы изучим именно такой продвинутый вариант дисплея, и попробуем поработать со слайдбарами и кнопками.  Также построим график с помощью специального компонента, разберемся с таймером и переменными. Успехов!

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

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

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