2.5 Панель Компоненты

Панель "Компоненты (Toolbox)" содержит список из 18 базовых компонентов, поддерживаемых всеми дисплеями Nextion. А также набор из 11 дополнительных компонентов, поддерживаемых исключительно серией устройств P - Intelligent. Компоненты второй группы добавляют новые эффекты оформления, включая возможность "пролистывания" страниц с применением касательных жестов. Дополнительные компоненты рассчитаны на самую высокую аппаратную производительность серии Intelligent, поэтому они не поддерживаются устройствами Basic и Enhanced. Серый цвет шрифта вместе с запретом выбора дополнительного компонента указывает на его несовместимость с выбранным устройством Nextion.

В перечне доступных компонентов панели нет компонента "Страница (Page)". Страница создаётся каждым добавлением в проект новой страницы из панели страниц. Компонент Страница — всегда самый нижний слой дизайнерского холста, поверх которого накладывается другой визуальный компонент.

Атрибуты большинства компонентов:

• .type — системный индекс компонента, нередактируемый;
• .id — цифровой идентификатор компонента, в границах одной страницы;
• .objname — произвольное имя компонента (1-14 символов);
• .vscope — глобальная или локальная видимость комопнента;
• .x и .y — горизонтальная и вертикальная координаты расположения на экране верхней левой точки области компонента;
• .w и .h — ширина и высота области компонента, отсчитываемые от координат расположения;
• .font — цифровой идентификатор выбранного текстового шрифта;
• .bco — цвет фона компонента в палитре RGB565 (0-65535);
• .pco — цвет текстового шрифта в палитре RGB565 (0-65535).

Атрибут .sta у компонентов может принимать значения:

• Обрезка изображения (crop image). Фон компонента извлекается из выбранных пользователем изображений (.picc), в одинаковых с местаположением компонента точках координат .х и .у;
• Сплошной цвет (solid color). Устанавливает цвет заднего фона компонента значением палитры RGB565 (0-65535);
• Изображение (image). Отображаемые компонентом текстовые или цифровые значения помещаются поверх изображения.
• Прозрачность (transparency). Задний фон компонента извлекается из нижних слоёв под прозрачными пикселями.

Атрибут визуального стиля .style у компонентов может принимать значения:

• Плоский (flate), без линий по границам компонента;
• Рамка (border), границы компонента обводятся линиями;
• Эффект вдавливания (3D_Down), линии создают визуальную имитацию слегка утопленного в поверхность компонента;
• Эффект возвышения (3D_Up), линии создают визуальную имитацию слегка приподнятого из поверхности компонента;
• Эффект анимации (3D_Auto). В зависимости от статуса, линии имитируют процесс нажатия и отпускания (например, кнопки).

Многие компоненты имеют несколько вариантов выравнивания и размещения текста:

• Горизонтально по оси Х (.xcen), текст выравнивается к левому краю, по центру или к правому краю относительно границ компонентов;
• Вертикально по оси Y (.ycen), текст выравнивается к верхнему краю, по центру или к нижнему краю относительно границ компонентов;
• Горизонтальный интервал (.spax), увеличивает пространственный интервал на указанное количество пустых пикселей справа от каждого символа;
• Вертикальный интервал (.spay), увеличивает пространственный интервал на указанное количество пустых пикселей снизу от каждого символа;
• Перенос символов (.isbr), разрешает (true) или запрещает (false) автоматический перенос непоместившихся символов на новую строку.

Для серии Nextion Intelligent. Многие компоненты имеют новые возможности, такие как:

• Репозиционирование компонентов доступом к значениям .x и .y, или с помощью инструкции перемещения компонентов (move);
• Разрешение (yes) или запрещение (no) перетаскивания компонентов по странице в режиме выполнения программы (атрибут .drag), c возможностью отключения обработки события перетаскивания (атрибут .disup);
• Настройка непрозрачности компонентов, в диапазоне значений от 0 до 127 (атрибут .aph);
• Несколько интересных эффектов появления компонентов (атрибут .effect), с приоритетностью выполнения (.first) и длительностью эффекта (.time);
• Создание эффекта горизонтального или вертикального пролистывания страниц с помощью касательных движений по сенсорной панели. Атрибуты перехода к следующей странице: .up - вверх, .down - вниз, .left - влево, .right - вправо для компонента Страница, принимают порядковый номер (не id, не имя) страницы, соответствующий её очерёдности в списке панели страниц. Значение 255 запрещает переход.

Дополнительные атрибуты не доступны в сериях Basic и Enhanced.

Примечание. Краткое описание и параметры атрибутов находятся в нижней области панели атрибутов редактора Nextion.

Перейти к изучению:

1. Базовые компоненты GUI для всех дисплеев Nextion
2. Дополнительные компоненты GUI для дисплеев серии Intelligent