Lo que debes saber de la User Interface de Unity

UI en Unity

Dentro de la UI podemos usar diferentes tipos de elementos como pueden ser textos e imágenes, Unity puede utilizar las diferentes fuentes que nosotros necesitemos siempre y cuando estas fuentes se encuentren dentro de nuestro proyecto, es decir, no coge las fuentes instaladas en nuestro sistema operativo, es necesario que la fuente se encuentre dentro del proyecto para poder ser visualizada en cualquier equipo cuando nosotros creemos nuestra Build (ejecutable o instalable que usaremos para poder ejecutar nuestro juego en otra máquina). En cuanto a las imágenes Unity puede usar las imágenes para diferentes fines (texturas, mapa de normales, etc) es por eso que siempre que vayamos a usar una imagen para nuestro UI (ya sea para botones, marcos, fondos, etc) debemos asegurarnos que Texture Type que se tenga seleccionada para esa imagen sea “Sprite (2D and UI)”, ésta configuración nos permite usar las imágenes tanto como sprites de nuestro juego o como imágenes de nuestro interfaz de usuario.

EventSystem

Cuando creemos un elemento cualquiera de interfaz de usuario en nuestra escena, veremos que por defecto se crea un elemento adicional (si no lo teníamos con anterioridad), llamado EventSystem. Este objeto nos permite controlar todas las entradas (Inputs) dirigidos a objetos de la escena. Será el encargado de realizar el raycasting (lanzar un rayo desde el punto de interacción, ya sea un touch en una pantalla táctil o un clic con el ratón, para ver si ese rayo entra en contacto con algún elemento que sea interactivo y generar así la acción correspondiente) y nos permitirá con los diferentes elementos (botones, scrolls, etc) de nuestro interfaz de usuario. Además el objeto Eventsystem gestiona de manera automática las diferencias de interacción en plataformas diferentes como pueden ser los dispositivos móviles y los ordenadores. Si el objeto EventSystem se elimina por error de la escena no podremos interactuar con los elementos del UI del juego.

Canvas

De igual forma que pasaba con el objeto de EventSystem el objeto Canvas se creará también de forma automática al crear cualquier elemento de user interface. El canvas es el elemento raíz de la UI y nos permitirá definir diferentes características que afectarán a todos los elementos de interfaz de usuario que formen parte de él. Dentro de estas características nos podemos encontrar cómo se posicionan los elementos de la UI en el mundo, como se deben re-escalar según los diferentes formatos de pantalla en los que se reproduzca el juego y si es necesario o no ese reescalado. Nos definirá los límites de la pantalla donde los diferentes elementos hijos de ese canvas podrán ubicarse. 

Anchors

Otro concepto a tener en cuenta en el sistema de interfaz de usuario de Unity son los anchors (anclajes), los diferentes elementos que creemos dentro de nuestra UI se posicionarán siempre respecto a una ubicación concreta de nuestro canvas. En el inspector del elemento podremos cambiar esa ubicación modificando el anclaje del objeto. Es decir, podemos hacer que un objeto se coloque siempre en una posición respecto al centro de la pantalla o respecto a una de las esquinas, esto es importante ya que cuando usemos el escalado de la pantalla los elementos intentarán mantener la proporción de distancia indicada respecto a su anclaje, si no realizamos bien la tarea de configuración de los anchors de los elementos de UI, cuando tengamos reescalados de pantalla podemos encontrarnos que los elementos que queremos tener posicionados en una esquina (como pueden ser las vidas, los puntos, etc) se vayan más hacia el centro de la pantalla, obteniendo así un resultado muy diferente al diseño inicial que habíamos pensado. Cuando un elemento es hijo de otro los anchors se crean siempre en relación al objeto padre y no al canvas general.

Estos son algunos de los conceptos básicos a tener en cuenta al empezar a usar el sistema de creación de la interfaz de usuario (UI) de Unity, pero como puedes imaginar hay muchos más elementos a explicar en detalle que iremos viendo en próximos artículos como pueden ser las imágenes, los textos, los botones, los scrolls, etc. Además, de como crear animaciones para este tipo de elementos que podamos usar para enriquecer nuestras user interfaces.

¿Estás preparado para crear la Interfaz de Usuario de tu juego? Déjanos tu comentario