Requisitos previos
- El TAK Editor está instalado y configurado.
- Existe al menos un paquete con un diseño en las carpetas de área de trabajo abiertas.
Vista previa de diseños
Obtener la vista previa de un diseño es tan sencillo como abrir el archivo de diseño en el editor, a través del Explorador de VS Code. Con solo hacer clic en un archivo de diseño dentro del directoriolayouts de un paquete, el contenido JSON del diseño se mostrará en una pestaña, y una vista previa en vivo del diseño aparecerá automáticamente en una pestaña adyacente.
Si hay errores en el archivo de diseño, se mostrarán en el panel de problemas de VS Code. La vista previa no se actualizará hasta que se resuelvan los errores. Esto se explora con más detalle en la sección Estado, errores y advertencias.
- Haciendo clic en el botón “Open Preview” en la esquina superior derecha del archivo de diseño:
- Ejecutando el comando “Touch Adaptation Kit: Open preview to the side” mediante la paleta de comandos.
Estado, errores y advertencias
Estado de verificación
A medida que se realizan modificaciones en los diseños, los recursos y otros archivos dentro de un paquete, la extensión verificará continuamente la validez del contenido del paquete con respecto a un conjunto predefinido de reglas que todos los paquetes deben cumplir. Esto se realiza en segundo plano y se vuelve a evaluar cada vez que se guarda un archivo anidado dentro de un paquete o se cambia de cualquier otra forma (por ejemplo, si se cambia de nombre). El estado de esta verificación se notifica mediante un elemento de la barra de estado situado en el borde inferior derecho de la ventana. Este elemento de la barra de estado solo aparecerá cuando haya al menos un archivo de diseño abierto en el editor. Muestra el nombre del paquete activo y el número de problemas (errores y advertencias) encontrados en el paquete. Al hacer clic en el elemento de la barra de estado se abrirá el panel de problemas de VS Code con una lista de todos los problemas encontrados en el paquete.Estado de sincronización
El panel de vista previa tiene una conexión activa de instalación local (sideload) de paquetes con la CLI de TAK. Puede obtener más información sobre cómo funciona esto en la documentación de la CLI de TAK. El estado de esta conexión se notifica mediante un elemento de la barra de estado situado en el borde inferior derecho de la ventana, junto al elemento de la barra de estado de verificación. Este estado solo aparecerá cuando el panel de vista previa esté abierto. La captura de pantalla anterior muestra el elemento de la barra de estado cuando la conexión está activa y la vista previa está sincronizada. Este es el caso cuando no hay errores en el paquete (se permiten advertencias, que mantienen el estado como “synchronized”). Si hay errores, el estado cambiará a “Out of sync”. Al mantener el puntero sobre este elemento de la barra de estado, aparecerá una información sobre herramientas con detalles del servidor de instalación local hospedado por la CLI de TAK. Esta dirección se puede usar para conectar otro cliente de transmisión de juegos a la vista previa, como la Content Test App.Errores y advertencias
El panel de problemas de VS Code mostrará una lista de todos los problemas encontrados en el paquete. Esto incluye todos los problemas que se detectan durante el proceso de verificación. Cuando existe un problema, al hacer clic en cualquiera de los elementos de la barra de estado de verificación o sincronización se abrirá el panel de problemas y se mostrará la lista de problemas. Cada problema tendrá una descripción y una ubicación dentro del paquete donde se encontró el problema. Por ejemplo, en la captura de pantalla siguiente, existe un error en el paquete en el que el archivo de diseñoplatformer-advanced.json hace referencia a un recurso (run.png) que no existe en el paquete:
El estado de la vista previa es ahora “Out of sync” hasta que la referencia se cambie a un recurso que exista en el paquete, o hasta que el recurso se agregue al paquete.
Paso siguiente
[!div class=“nextstepaction”] Personalización de la vista previa