SISTEMAS DIGITALES II

Nextion Instruction Set

Sayan Mora
[Link]@[Link]

Abstract—Nextion is probably one of the best options A. Conexión de la pantalla

to create our DIY projects. Not only are they compatible La pantalla puede ser dispone solamente de 4 pines.
with Arduino, but we can also use them independently Dos de ellos son de alimentación ( Cable rojo y negro ) y
of the plate. los otros dos son de recepción ( RX ) y transmisión ( TX
The Nextion Editor is the best solution, almost the ) de datos a través de su puerto serie. Puede realizarse
only one, to start creating our first projects with Nextion la conexión a través de un puerto serial UART como
screens. There is only version for Windows that we can conectarse a una placa Arduino desde sus conectores
download through the official link of Nextion. RX y TX.
To run our first project with the Nextion editor you
have to consider a number of things initially, which we II. N ORMAS Y PR ÁCTICAS GENERALES
will explain. But the most important thing about this 1 Todas las instrucciones en serie: terminan con tres
platform is that it is very well documented not only bytes de 0xFF 0xFF 0xFF es decir: decimal: 255 o
from the official website, but there are also a lot of hexadecimal: 0xFF o ansichar: ÿ o binario: 11111111
tutorials in which you can see step by step on Youtube. es decir, byte ndt [3] = 255,255,255; escribir (ndt, 3); o
imprimir (” xFF xFF xFF”); o imprimir (”ÿÿÿ”)
I. INTRODUCCION 2 Todas las instrucciones y parámetros están en ASCII.
3 Todas las instrucciones están en minúsculas.
Nextion es probablemente una de las mejores op- 4 Los bloques de código y encerrados entre llaves no
ciones para crear nuestros proyectos DIY. No solamente se pueden enviar en serie, esto significa que si, para y
son compatibles con Arduino, sino que además podemos mientras, los comandos no se pueden usar en serie
utilizarlos de forma independiente a la placa. 5 Se utiliza un espacio char 0x20 para separar el comando
Existen tres modalidades para hacer funcionar estas de los parámetros.
pantallas. 6 No hay espacios en los parámetros a menos que se
Crear una interfaz en una pantalla TFT Nextion de forma indique especı́ficamente
independiente a través de su editor Nextion. 7 Nextion usa matemáticas enteras y no tiene soporte real
Crear una interfaz en una pantalla TFT con comunicación o flotante.
Arduino 8 Las asignaciones no son complejas y se evalúan com-
Programar la pantalla mediante cualquier comunicación pletamente cuando se alcanza un valor después del
UART operador.
Intentar programar desde con las librerı́as oficiales Ar- 9 La evaluación de comparación no es compleja, pero se
duino – Nextion puede unir (ver y ——).
El Editor de Nextion es la mejor solución, casi 10 Las instrucciones en serie se procesan al recibir la
la única, para empezar a crear nuestros primeros terminación (ver 1.1 )
proyectos con las pantallas Nextion. Existe solo versión 11 El escape de caracteres se realiza utilizando dos
para Windows que podremos descargar a través del caracteres de texto: r crea 2 bytes 0x0D 0x0A, ”0x22
enlace oficial de Nextion. y
Para ejecutar nuestro primer proyecto con el editor para 0x5C
de Nextion hay que tener en cuenta una serie de 12 Nextion no admite el orden de operaciones. sys0 = 3 +
cosas inicialmente, que vamos a explicar. Pero lo más (8 * 4) no es válido.
importante de esta plataforma es que está muy bien 13 565 de 16 bits Los colores están en decimal de 0 a
documentada no solo desde la web oficial, sino que 65535 (consulte la nota 5 ).
además existen una gran cantidad de tutoriales en los 14 Los valores de texto deben estar encapsulados con
que se pueden ver paso a paso en Youtube. comillas dobles: es decir, ”Hola”.
Nosotros vamos a centrarnos en realizar proyectos 15 Los elementos que son especı́ficos de los modelos
muy concretos, pero vamos a hacer hincapie en los as- mejorados se indican con dieciséis Modo de datos
pectos más importantes para poner a funcionar nuestra transparente (utilizado por los comandos addt y wept )
pantalla. el dinamismo de nuestras pantallas dependerá de
cómo de bien podamos programarlas asociados a re-
Conexión de la pantalla
spuesta a diferentes eventos.
Editor Nextion
Texto
Compilación y simulación Scrolling Text
Carga del proyecyo TFT Numeros ( asociado a un formato de variable )
Desde el puerto serie Botones ( Asociados a eventos táctiles )
Desde la tarjeta SD Barra de progreso
Imagen
Crop
Hotspot ( Puntero, Asociados a eventos táctiles )
 [Link] + = 4 es equivalente a [Link] = [Link] + 4 [Link]
+ = [Link]
Resta numérica. Resta el lado derecho del lado izquierdo
con el resultado colocado en el lado izquierdo. [Link]-
= 4 es equivalente a [Link] = [Link]-4 [Link]- = 60 //
disminuye el valor de [Link] en 60
Multiplicación numérica. Multiplica el lado izquierdo por
el lado derecho con el resultado del producto colocado
en el lado izquierdo. [Link] * = 2 es equivalente a [Link]
= [Link] * 2 [Link] * = 2
División numérica. Iguala la división del numerador (lado
izquierdo) y el divisor (lado derecho) y coloca el cociente
entero en el lado izquierdo. 60000/20001 = 2 [Link] / =
60
Módulo numérico. Iguala la división del numerador (lado
Figure 1. pantalla NEXTION
izquierdo) y el divisor (lado derecho) y coloca el resto
entero en el lado izquierdo. El divisor DEBE ser una
constante. 60000/20001 = 19998 [Link]
Gauge – Modelo de marcador giratorio Desplazamiento de bits aritmético a la izquierda. Mueve
Ondas ( Asociado a lectura de señal eléctrica ) todos los bits especificados a la izquierda. Usando
Slider – Deslizador ( Asociados a eventos táctiles ) el ejemplo de 16 bits que sigue, (32 bits usa reglas
Temporizador – Elemento no visible asociado a la medición similares) Todos los bits desplazados por encima de 15
de tiempos se pierden y los bits indefinidos se vuelven 0 [Link] =
Variables – Creación de variables internas para opera- [Link] ¡¡ 4 0 0 0 0 . 0 0 1 1.1 1 0 0.0 0 0 1 0 0 1 1.1 1
ciones programadas 0 0.0 0 0 1. 0 0 1 1.1 1 0 0.0 0 0 1 . 0 0 0 0
Botón de dos estados ( Asociados a eventos táctiles ) Desplazamiento de bits aritmético a la derecha. Mueve
Checkbox ( Asociados a eventos táctiles ) todos los bits especificados a la derecha. Usando el
Radio – Checbox circular ( Asociados a eventos táctiles ) ejemplo de 16 bits que sigue, (32 bits usa reglas
QRCode – Como cargar una imagen QR similares) Todos los bits desplazados por debajo de 0
se pierden y los bits no definidos se convierten en el
A. Declaraciones de asignación tipo texto bit con signo. Cuando el bit con signo es 1 (el valor es
Asignación. Se evaluará el lado derecho con el resultado negativo), la izquierda se llena con unos Cuando el bit
colocado en el lado izquierdo. El componente .txt-maxl con signo es 0 (el valor es positivo), la izquierda se llena
debe ser lo suficientemente grande para contener el con 0. [Link] = [Link] ¿¿ 4 0 0 0 0.0 0 1 1.1 1 0 0 . 0 0
resultado. [Link] = ”Hola” 0 1 0 0 0 0.0 0 1 1.1 1 0 0 0 0 0 0 . 0 0 0 0,0 0 1 1,1 1
Adición de texto. Concatenará el lado izquierdo con el lado 0 0
derecho con el resultado colocado en el lado izquierdo. AND lógico bit a bit. Compara todos los bits del lado
es decir, [Link] + = ”Hola” es equivalente a [Link] = [Link] izquierdo con todos los bits del lado derecho (máscara)
+ ”Hola”. [Link] = ”-“ + [Link] se convierte en [Link] = Usando el ejemplo de 16 bits que sigue, (32 bits usa
[Link] + ”-“. Utilice la variable temporal para anteponer. reglas similares) El resultado es un bit de 1 donde los
[Link] = [Link] [Link] = ”-“ + [Link] [Link] + = ”Mundo” bits izquierdo y derecho eran 1 [Link] = [Link] y 35381
// anexa ”Mundo” a [Link] 0 1 0 1 . 1 0 1 1 .0 0 1 0.0 1 0 1 [Link] de 23333 1 0 0
Resta de texto. Eliminará el lado derecho (una cantidad 0. 1 0 1 0.0 0 1 1 .0 1 0 1 máscara de 35381 0 0 0 0. 1
numérica especificada de caracteres para eliminar) del 0 1 0.0 0 1 0.0 1 0 1 el resultado es 2597
extremo del lado izquierdo y el resultado se colocará en OR lógico bit a bit. Compara todos los bits del lado
el lado izquierdo. [Link]- = 4 o [Link] = [Link]-4 // elimina izquierdo con todos los bits del lado derecho Usando
los últimos 4 caracteres de [Link] el ejemplo de 16 bits que sigue, (32 bits usa reglas
Personaje de escape. (ver 1.11 ) Se admite r hex 0x0D similares) El resultado es un bit de 1 donde los bits
0x0A, ”hex 0x22, de la izquierda o la derecha eran 1 [Link] = [Link] —
hex 0x5C, [Link] = ” r” 35381 0 1 0 1 . 1 0 1 1 .0 0 1 0.0 1 0 1 [Link] de 23333
Igualdad booleana. Evalúe el lado izquierdo al derecho. 1 0 0 0. 1 0 1 0.0 0 1 1 .0 1 0 1 constante 35381 1 1 0
Si ambos lados izquierdo y derecho son iguales, se crea 1 . 1 0 1 1 .0 0 1 1 .0 1 0 1 el resultado es 56117
una condición verdadera si ([Link] == [Link]) XOR lógico bit a bit. Aplica inversión de bits a todos los
Desigualdad booleana. Evalúe el lado izquierdo al derecho. bits de la máscara de bits Utilizando el ejemplo de 16
Si ambos lados izquierdo y derecho son diferentes, se bits que sigue, (32 bits usa reglas similares) El resultado
crea una verdadera condición. si ([Link]! = [Link]) es un bit invertido donde maskbit era 1, sin cambios
donde maskbit era 0 [Link] = [Link] elevado 35381 0 1
B. Declaraciones de asignación tipo numerico 0 1. 1 0 1 1.0 0 1 0 .0 1 0 1 [Link] de 23333 1 0 0 0. 1
Asignación. Se evaluará el lado derecho de la ecuación y el 0 1 0.0 0 1 1 .0 1 0 1 máscara de bits de 35381 1 1 0
resultado se colocará en el lado izquierdo. Si hay más 1. 0 0 0 1.0 0 0 1 .0 0 0 0 el resultado es 53520
de un operador en el lado derecho, se realizará una Igualdad booleana. Evalúe el lado izquierdo al derecho.
evaluación y asignación completas en cada operador. Si ambos lados izquierdo y derecho son iguales, se crea
[Link] = baudios // coloca el valor en baudios en el una condición verdadera si ([Link] == [Link])
componente [Link] Desigualdad booleana. Evalúe el lado izquierdo al derecho.
Suma numérica. Agrega valor del lado izquierdo y del lado Si ambos lados izquierdo y derecho son diferentes, se
derecho con el resultado colocado en el lado izquierdo. crea una verdadera condición. si ([Link]! = [Link])
Booleano Menor que. Evalúe el lado izquierdo al derecho. Activar los componentes especificados Evento de pulsación
Si el lado izquierdo es menor que el lado derecho crea / liberación táctil Como el código de evento es siempre
una condición verdadera while ([Link] ¡[Link]) local, no se puede utilizar el prefijo de página del objeto
Booleano Mayor que. Evalúe el lado izquierdo al derecho. : haga clic en ¡cid¿, ¡event¿ ¡cid¿ es el atributo .id o
Si el lado izquierdo es mayor que el lado derecho crea .objname del componente para actualizar ¡event¿ es 1
una condición verdadera while ([Link]¿ [Link]) para activar el evento de prensa, 0 para activar los
Booleano Mayor o igual que. Evalúe el lado izquierdo al eventos de lanzamiento click b0,1 // Trigger Touch Press
derecho. Si el lado izquierdo es mayor o igual que el lado Evento del componente con .objname b0 click 4,0 //
derecho crea una condición verdadera while ([Link]¿ = Trigger Touch Release Event del componente con .id 4
[Link]) Detiene la actualización de la forma de onda predeter-
minada (no se actualizará cuando se agregue el punto
C. Declaraciones de asignación tipo codigo de datos) - la actualización de la forma de onda se
El bloque de código comienza con llave abierta en lı́nea reanudará con ref star (ver 3.5 ) uso: ref stop ref stop
por sı́ mismo El bloque de código termina con llave de // deja de actualizar la forma de onda en cada punto
cierre comenzando una nueva lı́nea ver si (ver 3.25 ) de datos agregado
mientras (ver 3.26 ) y para (ver 3.27 ) Reanudar la actualización de la forma de onda predeter-
minada (actualización al agregar el punto de datos) : se
Condition Joiner AND Las condiciones se pueden unir sin
usa para reanudar la actualización de la forma de onda
espacios entre las condiciones, evaluación de izquierda
detenida por ref stop (ver 3.4 ) uso: ref start ref star
a derecha ver si (ver 3.25 ) mientras (ver 3.26 ) y para
// reanudar la actualización predeterminada, actualizar
(ver 3.27 )
en cada punto de datos agregado
Condition Joiner O Las condiciones se pueden unir sin
Enviar atributo / constante sobre serial (0x70 / 0x71
espacios entre las condiciones, evaluación de izquierda
Devolver datos) uso: obtener ¡attribute¿ ¡attribute¿ es
a derecha ver si (ver 3.25 ) mientras (ver 3.26 ) y para
un valor numérico, contenido .txt o constante get [Link] //
(ver 3.27 )
envı́a el contenido de texto de [Link] en 0x70 Formato de
El recinto de condiciones comienza con un paréntesis
datos de retorno get ”123” // envı́a la constante de texto
abierto ( y termina con un paréntesis de cierre) al
”123” en 0x70 Formato de datos de retorno get [Link]
final de la lı́nea. Los paréntesis no pueden crear
// envı́a el valor numérico de [Link] en 0x71 Formato de
declaraciones complejas. ver si (ver 3.25 ) mientras (ver
datos de retorno get 123 // envı́a la constante numérica
3.26 ) y para (ver 3.27 )
123 en formato de datos de retorno 0x71
Separador de perı́odos. Separa la página, el componente y Envı́a el número de la página cargada actualmente sobre
los atributos También se utiliza con el ı́ndice de página el serial (0x66 Return Data) - el número de la página
y la matriz de componentes. (ver 2.29 ) [Link] o cargada actualmente se almacena en la variable del
[Link] sistema dp - usado en el evento de inicialización de una
Matriz [ı́ndice]. Hay 3 matrices. La fuente del teclado página se enviará automáticamente cuando la página
muestra 2 matrices. La matriz de componentes b [.id] cargue uso: sendme sendme // envı́a el valor de dp en
que toma el componente .id como ı́ndice La matriz formato de datos de retorno 0x66
de páginas p [index] que toma el ı́ndice de la página Convierta la variable de tipo numérico a texto, o de texto
como ı́ndice Estos (p []. B []) deben usarse con pre- a tipo numérico : el texto debe ser una representación
caución y con un propósito consciente. La referencia ASCII de texto de un valor entero. - los tipos de origen
a un componente sin un atributo especificado puede y destino no deben ser del mismo tipo - cuando el origen
generar sesiones de depuración largas y potencialmente es numérico, el formato hexadecimal y la longitud no es
frustrantes. La tercera matriz es la matriz Serial Buffer 0 ni ¡4. es decir: (len 2) significativo positivo (byte 0 a
Data u [ı́ndice]. Esto es válido en el modo de análisis 3), 123 = 0000007B = 007B es decir: (len 2) significativo
de protocolo activo. Protocol Reparse es una técnica negativo (byte 3 a 0), -123 = FFFFFF85 = FF85 - el valor
avanzada que debe omitirse si no se comprende com- es mayor que el espacio permitido da como resultado un
pletamente. p [pageindex] .b [[Link]] .attribute truncamiento - se recomienda para asegurar el manejo
// alcance global b [[Link]] .attribute // alcance de la longitud de la fuente en el código de usuario antes
local en la página actual de covx - en v0.53, covx se considera indefinido si la
fuente es mayor que la longitud o dest txt maxl es menor
D. Comandos operativos que la longitud solicitada. (algunas de estas indefinidas
Cambiar página a página especificada. Descarga la página pueden explotarse) es decir: valor numérico src de 123
antigua para cargar la página especificada. Nextion con longitud 0, el resultado es texto dest ”123” - cuando
carga la página 0 de forma predeterminada al encender. la longitud es fija y el valor es menor, se agregarán ceros
uso: página ¡pid¿ ¡pid¿ es el número de ı́ndice de la a la izquierda, es decir: valor numérico src de 123 con
página o el nombre de la página página 0 // Cambiar longitud 4, el resultado es texto destino ”0123 ” - cuando
página a página indexada 0 página principal // Cambiar el valor es mayor que la longitud, .txt truncado a los
página a la página denominada principal dı́gitos menos significativos, es decir: valor numérico src
Actualizar componente (actualización automática cuando de 23425 con longitud 4 el resultado es texto dest. Uso de
el atributo cambia desde v0.38) : si el componente está “ 3425 ” : covx ¡src¿, ¡dest¿, ¡length¿, ¡format ¿ ¡src¿ es
obstruido (apilamiento), ref trae el componente a la un atributo de texto (o atributo numérico cuando ¡dest¿
parte superior. uso: ref ¡cid¿ ¡cid¿ es el atributo .id o es texto) ¡dest¿ es un atributo numérico (o atributo de
.objname del componente del componente a actualizar texto cuando ¡src¿ es numérico) ¡length¿ determinará si
, cuando ¡cid¿ es 0 (componente de la página) actu- se agregan ceros a la izquierda a la conversión a texto
aliza todo en la página actual. ref t0 // Actualiza el ¡format¿ 0: entero, 1: 1000 separados por comas, 2:
componente con .objname de t0 ref 3 // Actualiza el hexadecimal covx [Link], [Link], 0,0 // convierte el valor
componente con .id de 3 ref 0 // Actualiza todos los de h0 en [Link] sin ceros a la izquierda covx [Link], [Link],
componentes en la página actual (igual que ref 255) 0,0 // convierte [Link] en entero en [Link] ¡ longitud¿
 ignorada. covx [Link], [Link], 4,0 // convierte el valor vis 1,1 // mostrar componente con .id 1, actualizar en
de h0 en [Link] con exactamente 4 dı́gitos covx [Link], la capa frontal vis 255,0 // oculta todos los componentes
[Link], 4,1 // convierte el valor de h0 en [Link] con comas en la página actual
covx [Link], [Link], 4,2 // convertir el valor de h0 en Habilite o deshabilite los eventos táctiles para el compo-
[Link] en 2 bytes de dı́gitos hexadecimales No válido: nente en la página actual ; de manera predeterminada,
covx [Link], [Link], 0,0 o covx [Link], va0. txt, 0,0 // src todos los componentes están habilitados a menos que
dest del mismo tipo. tsw los deshabilite ; use con precaución y con un
Depreciado . Convertir de tipo numérico a texto, o de texto propósito consciente, puede conducir a un uso difı́cil
a tipo numérico : el texto debe ser una representación de la sesión de depuración : tsw ¡comp¿ ¡state¿ ¡comp¿
ASCII de texto de un valor entero. - los tipos de origen es .objname o .id del componente en la página actual,
y destino no deben ser del mismo tipo - cuando la - .id válido es 0 - página, 1 a 250 si el componente
longitud es fija y el valor es menor, se agregarán ceros existe, y 255 para todos ¡state¿ es 0 para deshabilitar
a la izquierda, es decir: src valor numérico de 123 con o 1 para habilitar. tsw b0,0 // deshabilitar los eventos
longitud 4, el resultado es texto dest ”0123” - dest txt Touch Press / Release para el componente b0 tsw b0,1
maxl y longitud debe ser lo suficientemente grande para // habilitar los eventos Touch Press / Release para el
adaptarse a la conversión. es decir: src valor numérico componente b0 tsw 1,0 // deshabilitar los eventos Touch
de 123 con longitud 0, el resultado es texto de destino Press / Release para el componente con id 1 tsw 1, 1
”123” - cuando el valor es mayor que la longitud, .txt // habilita los eventos Touch Press / Release para el
da como resultado un truncamiento - se recomienda componente con id 1 tsw 255,0 // deshabilita todos los
manejar la longitud de la fuente en el código de usuario eventos Touch Press / Release en la página actual
antes de cov Nota: v0.53 comportamiento cambiado Detener la ejecución de las instrucciones recibidas de
respecto a comportamientos anteriores / posteriores a la Serial : Serial continuará recibiendo y almacenando en
versión 0.53. cov se considera indefinido si la fuente es el búfer. - la ejecución de instrucciones desde Serial
mayor que la longitud o si dest txt maxl es menor que la se reanudará con com star (ver 3.14 ) - el uso de
longitud solicitada. Algunas indefinidas son explotables. com stop y com star puede causar una condición de
uso: cov ¡src¿, ¡dest¿, ¡length¿ ¡src¿ es un atributo de desbordamiento del búfer. - Consulte la hoja de datos
texto (o atributo numérico cuando ¡dest¿ es texto) ¡dest¿ del dispositivo para conocer el tamaño del búfer y el
es un atributo numérico (o atributo de texto cuando uso del tamaño de la cola de comandos : com stop com
¡src¿ es numérico) ¡length¿ determinará si los ceros stop // detiene la ejecución de instrucciones desde Serial
iniciales se agregan a la conversión a texto cov [Link], Reanudar la ejecución de instrucciones recibidas de Serial
[Link], 0 // convierte el valor de h0 en [Link] sin ceros a usado para reanudar una parada de ejecución causada
la izquierda cov [Link], [Link], 0 // convierte el entero en por com stop (ver 3.13 ) cuando com star recibido, se
[Link] desde [Link] ¡length¿ ignorado. cov [Link], [Link], ejecutarán todas las instrucciones en el búfer el uso
4 // convierte el valor de h0 en [Link] con exactamente de com stop y com star puede causar una condición de
4 dı́gitos No válido: cov [Link], [Link], 0 o cov [Link], desbordamiento del búfer. Consulte la hoja de datos del
[Link], 0 // src dest del mismo tipo. dispositivo para conocer el tamaño del búfer y el uso
Vuelva a calibrar el sensor táctil del dispositivo Resistive del tamaño de la cola de comandos : com star com star
Nextion : presenta 4 puntos en la pantalla para que // reanuda la ejecución de la instrucción desde Serial
el usuario los toque, guarde y luego reinicie. - nor-
malmente no es necesario ya que el dispositivo está E. Comandos de diseño de GUI
calibrado en fábrica - el sensor puede verse afectado por
cambios de condiciones en el entorno - Los dispositivos Limpiar la pantalla y llenar toda la pantalla con el uso
de conexión capacitiva no pueden ser calibrados por el de color especificado : cls ¡color¿ ¡color¿ es el valor de
usuario. uso: touch j touch j // activa la recalibración color decimal 565 o la constante de color cls AZUL //
del sensor táctil Limpia la pantalla y llénala de color AZUL cls 1024 //
Extraer carácter o caracteres del contenido de un uso de Limpia la pantalla y llénala de color 1024
atributo de texto : substr ¡src¿, ¡dest¿, ¡start¿, ¡count¿ Mostrar una imagen de recurso en el uso de coordenadas
¡src¿ es un atributo de texto donde el texto se extraerá especificado : pic ¡x¿, ¡y¿, ¡picid¿ ¡x¿ es la coordenada x
de ¡dest¿ es un atributo de texto donde se colocará el de la esquina superior izquierda donde se debe dibujar
texto extraı́do ¡start¿ es la posición de inicio para la la imagen ¡y¿ es la coordenada y de la esquina superior
extracción (0 es el primer carácter, 1 segundo) ¡count¿ izquierda donde se debe dibujar la imagen ¡picid¿ es
es el número de caracteres extraer substr [Link], [Link], el número de la imagen de recursos en el diseño de la
0,5 extrae los primeros 5 caracteres de [Link], póngalos HMI pic 10,20,0 // Mostrar la imagen de recurso n. °
en [Link] 0 con la esquina superior izquierda en (10,20) imagen
Ocultar o mostrar el componente en la página actual : 40,50,1 // Mostrar la imagen de recurso n. ° 1 con la
mostrar actualizará el componente y lo traerá a la esquina superior izquierda en (40,50)
capa de primer plano ; ocultar eliminará el compo- Recortar el área de la imagen de la imagen de recurso
nente visualmente, los eventos táctiles se desactivarán usando el área definida : reemplaza el área definida con
; use capas con un propósito consciente, puede causar contenido de la misma área de la imagen de recurso:
rasgaduras y parpadeos. - usar con precaución y con un la imagen de recurso debe tener el tamaño de pantalla
propósito consciente, puede conducir a un uso difı́cil de completo o el área puede ser un uso indefinido : picq
la sesión de depuración : vis ¡comp¿ ¡state¿ ¡comp¿ es ¡x¿, ¡y¿, ¡w¿ , ¡h¿, ¡picid¿ ¡x¿ es la coordenada x
.objname o .id del componente en la página actual, - .id de la esquina superior izquierda del área de recorte
válido es 0 - página, 1 a 250 si el componente existe y definida ¡y¿ es la coordenada y de la esquina superior
255 para todo ¡state¿ es 0 para ocultar o 1 para mostrar. izquierda del área de recorte definida ¡w¿ es el ancho
vis b0,0 // ocultar componente con .objname b0 vis b0,1 del área de recorte definida ¡h¿ es la altura del área
// mostrar componente con .objname b0, actualizar en de recorte definida área de recorte ¡picid¿ es el número
la capa frontal vis 1,0 // ocultar componente con .id 1 de la imagen de recursos en el diseño de la HMI picq
 20,50,30,20,0 // área de cultivos 30 × 20, de (20,50) a
(49,69), de la Imagen de recurso 0
Imagen de recorte avanzada Área de recorte de la im-
agen de recurso de origen renderizado en el uso de
coordenadas de destino : xpic ¡destx¿, ¡desty¿, ¡w¿,
¡h¿, ¡srcx¿, ¡srcy¿, ¡picid¿ ¡destx¿ es la coordenada x
de la esquina superior izquierda de destino ¡desty¿ es
la coordenada y de la esquina superior izquierda de
destino ¡w¿ es el ancho del área de recorte definida
¡h¿ es la altura del área de recorte definida ¡srcx¿
es la coordenada x de la esquina superior izquierda
del área de cultivo definida ¡srcy¿ es la coordenada y
de la esquina superior izquierda del área de cultivo
definida ¡picid¿ es el número de la imagen de recursos
en el diseño de HMI xpic 20,50,30,20,15,15,0 // área
de cultivos 30 × 20, de (15,15) a (44,34), // de Imagen Figure 2. constantes de codigo de color
de recurso 0 y la renderiza con la esquina superior
izquierda en ( 20,50)
Imprime texto en el dispositivo Nextion usando un área esquina inferior derecha del área del rectángulo ¡y2¿
definida para el uso de renderizado de texto : xstr ¡x¿, es la La coordenada y de la esquina inferior derecha
¡y¿, ¡w¿, ¡h¿, ¡font¿, ¡pco¿, ¡bco¿, ¡xcen¿, ¡ycen¿ , ¡sta¿, del área del rectángulo ¡color¿ es el color de la lı́nea,
¡texto¿ ¡x¿ es la coordenada x de la esquina superior ya sea valor de color decimal 565 o constante de color
izquierda del área de texto definida ¡y¿ es la coordenada dibujar 10,10,70,70, VERDE // dibujar un rectángulo
y de la esquina superior izquierda del área de texto verde alrededor de (10,10) a (79,79) // efectivamente
definida ¡w¿ es el ancho del área de texto definida ¡h¿ cuatro lı́neas de (x1, y1) a (x2, y1) a (x2, y2 ) a (x1, y2)
es la altura del área de texto definida área de texto a (x1, y1)
¡font¿ es el número de la fuente de recursos ¡pco¿ es
el color de primer plano del texto (Color constante o III. REFERENCIAS
valor de color 565) ¡bco¿ es a) color de fondo del texto,
[Link]
ob) picid si ¡sta¿ está configurado a 0 o 2 ¡xcen¿ es la
nextion -introduccion-a-nextion-editor/
alineación horizontal (0 - izquierda, 1 - centrado, 2 -
[Link]
derecha) ¡ycen¿ es la alineación vertical (0 - superior
pdf/view /201596/ STMICROELECTRON-
/ superior, 1 - centro, 3 - inferior / inferior) ¡sta ¿ es
ICS/[Link]
Relleno de fondo (0 - imagen de recorte, 1 - color sólido,
[Link]
2 - imagen, 3 - ninguno) ¡text¿ es el contenido de la
[Link]
cadena (constante o atributo .txt), es decir, ”China”
de-linea-qtr- [Link]
o [Link] xstr 10,10,100,30,1, WHITE, GREEN, 1,1,1,
[Link]
[Link] // use son 100 × 30 de (10,10) a (109,39) para
velocista/753- [Link]
imprimir el contenido de [Link] usando / / Recurso de
[Link]
fuente 1 renderizado Letras verdes sobre fondo blanco
php?route=product/ productproducti d = 398
con centrado horizontal y vertical y sta en color sólido.
Rellene un área definida con el uso de color especificado :
relleno ¡x¿, ¡y¿, ¡w¿, ¡h¿, ¡color¿ ¡x¿ es la coordenada
x de la esquina superior izquierda del área de relleno
definida ¡y¿ es la coordenada y de la esquina superior
izquierda del área de relleno definida ¡w¿ es el ancho
del área de relleno definida ¡h¿ es la altura del área de
relleno definida el área de relleno ¡color¿ es el color de
relleno, ya sea valor de color decimal 565 o constante
de color fill 20,20,150,50,1024 // llena el área 150 × 50
desde (20,20) a (169,69) con 565 Color 1024.
Dibuje una lı́nea de un punto a otro con el uso de color
especificado : lı́nea ¡x1¿, ¡y1¿, ¡x2¿, ¡y2¿, ¡color¿ ¡x1¿
es la coordenada x del punto inicial de la lı́nea que se
va a dibujar ¡y1¿ es la coordenada y del punto inicial
de la lı́nea que se va a dibujar ¡x2¿ es la coordenada x
del punto final de la lı́nea que se va a dibujar dibujado
¡y2¿ es la coordenada y del punto final de la lı́nea que
se va a dibujar ¡color¿ es el color de la lı́nea, ya sea
valor de color decimal 565 o constante de color lı́nea
20,30,170,200, AZUL // traza una lı́nea en AZUL de
(20,30) a (170,200)
Dibuja un rectángulo hueco alrededor del área especifi-
cada con el uso de color especificado : dibuja ¡x1¿,
¡y1¿, ¡x2¿, ¡y2¿, ¡color¿ ¡x1¿ es la coordenada x de la
esquina superior izquierda del área del rectángulo ¡y1¿
es la coordenada y de la esquina superior izquierda
del área del rectángulo ¡x2¿ es la coordenada x de la