Perilla giratoria de bajo costo Visualización de la fuente del equipo Visualización

• Re-publicado desde NATHAN XI AI Diantang, parte 2

En este artículo, profundizaremos en la creación de un carrusel 2D. Al crear varias páginas funcionales y escribir una simple instrucción switch en la interfaz del menú, utilizaremos las acciones, interacciones y funciones personalizadas de TouchGFX para construir un menú secundario con un código mínimo.

Conceptos básicos de las acciones de TouchGFX

Enlace de referencia: https://support.touchgfx.com/docs/development/ui-development/touchgfx-engine-features/custom-triggers-and-actions#custom-actions. En resumen, si desea que una interacción se active en el código, puede intentar crear una acción para ella. Una acción puede ser un desencadenador de una interacción o ser activada por una interacción.

En este proyecto, usamos la acción como disparador de la interacción, lo que permite su activación en el código. Luego, enviamos la señal de activación a la base TouchGFX, activando así la interacción de cambio de pantalla, logrando así que el cambio de pantalla se active indirectamente en el código.

Utilicemos primero el proyecto anterior:

Cree dos acciones en la interfaz del menú, correspondientes a los dos elementos que diseñamos. A continuación, vaya a la pestaña de interacción a la derecha y cree una interacción que conecte los dos elementos de cambio de pantalla (las páginas funcionales deben crearse previamente).

En este punto, hemos completado la creación de la parte de interfaz basada en acciones e interacciones.

Posicionamiento de elementos del carrusel e integración de API

Al interactuar con un control de menú, este necesita saber qué elemento está seleccionado para que, al hacer clic en él, se pueda determinar a qué página apunta según la etiqueta escrita en la interfaz de usuario. Debemos aclarar esto antes de llamar a la API que hemos creado.

En TouchGFX, el control de menú ya integra la función `scrollWheel1.getSelectedItem()`, específicamente para recuperar el elemento seleccionado. Sin embargo, es necesario asignar estos datos a otros archivos en la capa de aplicación para que el programa reconozca qué subdemo se está seleccionando.

Por lo tanto, utilizamos 'Model.cpp', donde agregamos la funcionalidad de transferencia de datos.

Esto conecta exitosamente el menú scrollWheel a nuestra aplicación.

Entonces, ¿cómo conectamos los datos transmitidos con nuestra API? Básicamente, llamamos a nuestra acción directamente como una función. Para simplificar, simplemente transmitimos el elemento seleccionado como "DemoNumber", lo que nos permite escribir directamente una sentencia switch con varias sentencias case para invocar la función de cambio de pantalla correspondiente. Esto requiere conocimientos básicos de C.

Como puedes ver, debido a que la biblioteca TouchGFX es muy completa, en realidad no necesitamos escribir mucho código para implementar la funcionalidad.

Compile, actualice y vea los resultados, haga clic en el siguiente enlace para verificar más sobre el rendimiento de nuestro módulo de visualización de perilla giratoria:

https://www.youtube.com/watch?v=WnhW_CznyXY