Con la biblioteca HCScreen, nos estamos acercando cada vez más a la posibilidad de construir un microcontrolador convenientemente operado con el ESP32 y una pantalla TFT.
Obtenemos una gran cantidad de nuevas posibilidades mediante el uso de iconos. En primer lugar, los iconos son más claros y fáciles de asociar con una determinada función, en segundo lugar, ahora también podemos usar las opciones X-Y del joystick.
Nuevas funciones en la biblioteca:
initIconGrid (x, y, columnas, filas)
En las posiciones x e y, se crea una cuadrícula con columnas y filas en la que se pueden mostrar iconos con 31x31 píxeles. La función verifica si se exceden los límites de los parámetros de la pantalla y corrige los parámetros en consecuencia.
initIconGrid ()
Esta forma simplificada de la función inicializa una cuadrícula que utiliza toda la pantalla (para 160x128, estos son iconos de 5 x 4).
showIcon (índice, * icono)
El índice es el número de la celda de la cuadrícula en la que se debe mostrar el icono. La numeración comienza con 0 y se realiza línea por línea, es decir, con 4 x 5 primera línea = 0, 1, 2, 3, 4 segunda línea = 5, 6, 7, 8, 9, etc.
* El icono es el puntero a una estructura del tipo HCIcon en la memoria del programa.
showIcon (icono x, y, *)
Otra variante para configurar un icono, aquí la columna (x) y la fila (y) se dan donde se debe colocar el icono. * El icono vuelve a ser el puntero a una estructura HCIcon.
setGridColor (color de resaltado, color de fondo)
Con esta función, se puede establecer el color del fondo de la cuadrícula y el color con el que se debe marcar un icono seleccionado. Los valores de color se transfieren en formato de 3 bytes (rojo, verde, azul) como es habitual en las páginas web. Entonces p. 0xFF0000 = rojo, 0x00FF00 = verde o 0x0000FF = azul. Los colores se convierten automáticamente al formato de 16 bits para la pantalla. Para marcar un icono seleccionado, se dibuja un cuadrado alrededor del icono en el color de marcado.
Iconos:
Ya se ha definido una mayor cantidad de iconos comunes en el subdirectorio Iconos, que se puede incluir fácilmente en el boceto. Pero también es muy fácil crear su propio icono. Necesitamos el programa de edición de imágenes GIMP. Como salida, necesitamos alguna imagen que podamos escalar a 31 x 31 píxeles. Luego exportamos la imagen y elegimos el formato fuente, elegimos c código fuente (*. C) o c encabezado del código fuente (*. H) agregando .c o .h como una extensión al nombre del archivo. Después de hacer clic en el botón Exportar, aparece un cuadro de diálogo en el que ingresamos el nombre del icono (por ejemplo, icon_senden). ¡Ninguna de las casillas de verificación debe tener una marca de verificación! Ahora se crea un archivo con la extensión .c o .h en la carpeta de destino especificada. Abrimos este archivo con un editor de texto. Debería comenzar algo como esto:
/ * GIMP RGB C-Source volcado de imagen (icon_senden.c) * /
constante estática struct {
ancho int sin signo;
altura int sin signo;
unsigned int bytes_per_pixel; / * 2: RGB16, 3: RGB, 4: RGBA * /
unsigned char pixel_data [1024 * 386 * 3 + 1];
} icon_senden = {
31, 31, 3,
"\274\273\267\272\271......
Ahora tenemos que reemplazar la parte que se muestra en rojo con el tipo de estructura HCIcon, que se definió en la biblioteca.
constante estática HCIcon icon_senden = {
31, 31, 3,
"\274\273\267\272\271......
Si ahora incluimos este archivo en el boceto, podemos usar la dirección de la estructura icon_senden en la función showIcon.
Importante! Los archivos de iconos siempre deben importarse a HCScreen.h.
Programa de ejemplo:
Un boceto con el nombre Esp32_Control_Center_Icon debería estar disponible en los programas de muestra de la biblioteca. Abrimos este boceto en el IDE de Arduino y lo cargamos en el ESP32 que estaba conectado a la pantalla TFT y al módulo joystick de acuerdo con la información en el comentario.
Los 20 íconos deben mostrarse en la pantalla como se muestra aquí en la imagen. Con el joystick ahora podemos seleccionar un icono y presionar el botón del joystick. El número del icono en el que se hizo clic se muestra en el monitor en serie. En el programa de ejemplo, a dos iconos se les asigna una función. Si hace clic en la carpeta de iconos, el contenido de una tarjeta SD se muestra en el lector de tarjetas. Si hace clic en el icono de configuración, se muestra un formulario de muestra con dos iconos en la parte inferior izquierda.
La biblioteca puede ser deBiblioteca HCScreenSe puede descargar. En el IDE de Arduino, simplemente importe el archivo ZIP de la descarga en el administrador de la biblioteca.
Mira las otras publicaciones en HCScreen en este blog. Allí también encontrará información detallada sobre el hardware utilizado.
