Texto en Unity con Text Mesh Pro

Curso de Creación de Interfaces de Usuario con Unity

Contenido del curso

Introducción y configuración inicial

El sistema de UI de Unity

Haciendo interfaces para el juego

Tomar examen

Cursos Empresas Blog Live Conf Eventos Precios

0:006:14

Texto en Unity con Text Mesh Pro

Curso de Creación de Interfaces de Usuario con Unity

Clase 8 de 29

Clase 8 / 29

Recursos

Trabajar con texto en Unity es tan importante como trabajar con imágenes cuando construyes interfaces de usuario. Con Text Mesh Pro puedes crear títulos, etiquetas y mensajes que se vean nítidos en cualquier resolución, además de importar tus propias fuentes para darle identidad visual a tu juego.

¿Por qué Unity usa Text Mesh Pro en lugar del texto tradicional?

Cuando das clic derecho dentro del menú UI, la opción de texto aparece como Text Mesh Pro y no simplemente como Text. La razón tiene una historia interesante detrás.

Unity tenía originalmente su propio sistema de texto, que hoy encuentras bajo la categoría Legacy. Un usuario de la comunidad creó un asset alternativo para renderizar texto que resultó ser tan superior, que Unity decidió comprarlo e integrarlo como la opción por defecto del engine.

¿Qué es Text Mesh Pro? Es el sistema oficial de Unity para renderizar texto en interfaces, originalmente creado por un usuario externo y luego adquirido por Unity por su calidad superior frente al sistema Legacy.

Por eso, siempre que trabajes con texto en Unity moderno, vas a usar Text Mesh Pro.

¿Qué propiedades puedes editar en un componente de Text Mesh Pro?

Al crear un nuevo elemento de texto, Unity genera un Game object con un Rect Transform idéntico al de las imágenes, lo que te permite posicionarlo y escalarlo con las mismas reglas. Lo interesante está en el componente Text Mesh Pro [01:30].

Estas son las propiedades clave que puedes ajustar:

Texto: el contenido literal, por ejemplo Hola mundo.
Estilo: cambia entre normal, quote, link o títulos como H1.
Fuente: selecciona el font asset que quieres usar.
Formato: negrilla, subrayado o underline.
Tamaño de fuente: manual o automático con Auto Size.
Vertex Color: define el color del texto, incluso con gradient.
Espaciado: ajusta caracteres, palabras, párrafos y líneas.
Alineación: izquierda, centro, derecha o justificado, igual que en Word.

La opción Auto Size merece atención especial. Cuando la activas, el texto crece o se reduce según el tamaño del Rect Transform, respetando los valores mínimo y máximo que definas. Si pones un tamaño máximo de 200, por ejemplo, el texto puede escalar bastante antes de detenerse [03:15].

¿Cómo controlas la alineación vertical del texto?

La alineación horizontal funciona como en cualquier procesador de texto, pero la vertical tiene un detalle útil. Puedes anclar el texto al top, al centro o hacia abajo dentro del Rect Transform.

Si lo dejas centrado, no importa cuánto agrandes la caja verticalmente: el texto se mantiene en el medio. Esto es valioso cuando diseñas interfaces que cambian de tamaño según la pantalla.

¿Para qué sirve el Rect Transform en un texto? Define la caja contenedora donde vive el texto, controla su posición, tamaño y cómo se alinea internamente, igual que con cualquier elemento UI en Unity.

¿Cómo importar tus propias fuentes en Unity con Text Mesh Pro?

Por defecto, Text Mesh Pro solo te da acceso a la fuente Liberation Sans. Para usar tipografías propias necesitas un proceso de dos pasos.

Importar el archivo TTF

Primero, organiza tu proyecto creando una carpeta llamada Fonts dentro de Assets. Luego importa tu archivo de fuente con clic derecho y Import New Asset. Unity acepta el formato TTF (True Type Font), que es el estándar para tipografías digitales [05:40].

En el ejemplo se usa la fuente KennyBlogs.ttf, parte de los assets gratuitos de Kenny, que son libres para usar en cualquier proyecto.

Crear el Font Asset de Text Mesh Pro

Aquí viene el paso que muchos olvidan. Text Mesh Pro no usa directamente el archivo TTF, sino que necesita generar su propio Font Asset a partir de él.

Da clic derecho sobre el archivo de fuente importado y elige Create > Text Mesh Pro > Font Asset. Unity leerá el TTF y creará un asset con un ícono de F que ya puedes asignar al campo font asset de cualquier componente Text Mesh Pro [06:30].

¿Qué formato de fuente acepta Unity? Unity acepta archivos TTF (True Type Font) y los convierte en un Font Asset propio mediante Text Mesh Pro para poder renderizarlos correctamente.

Una vez asignada, tu texto se renderiza con la nueva tipografía y puedes ajustar color, tamaño y alineación como con cualquier otra fuente.

¿Qué sigue después de dominar texto e imágenes en UI?

Con imágenes y texto ya tienes los bloques visuales fundamentales para construir interfaces en Unity. El siguiente paso lógico es agregar interactividad, y eso se logra con botones, que combinan ambos elementos en un componente reaccionable al usuario.

¿Has encontrado alguna propiedad de Text Mesh Pro que te haya sorprendido al explorarla? Cuéntalo en los comentarios.

Resumen

¿Por qué Unity usa Text Mesh Pro en lugar del texto tradicional?

Cuando das clic derecho dentro del menú UI, la opción de texto aparece como Text Mesh Pro y no simplemente como Text. La razón tiene una historia interesante detrás.

¿Qué es Text Mesh Pro? Es el sistema oficial de Unity para renderizar texto en interfaces, originalmente creado por un usuario externo y luego adquirido por Unity por su calidad superior frente al sistema Legacy.

Por eso, siempre que trabajes con texto en Unity moderno, vas a usar Text Mesh Pro.

¿Qué propiedades puedes editar en un componente de Text Mesh Pro?

Estas son las propiedades clave que puedes ajustar:

Texto: el contenido literal, por ejemplo Hola mundo.
Estilo: cambia entre normal, quote, link o títulos como H1.
Fuente: selecciona el font asset que quieres usar.
Formato: negrilla, subrayado o underline.
Tamaño de fuente: manual o automático con Auto Size.
Vertex Color: define el color del texto, incluso con gradient.
Espaciado: ajusta caracteres, palabras, párrafos y líneas.
Alineación: izquierda, centro, derecha o justificado, igual que en Word.

¿Cómo controlas la alineación vertical del texto?

Si lo dejas centrado, no importa cuánto agrandes la caja verticalmente: el texto se mantiene en el medio. Esto es valioso cuando diseñas interfaces que cambian de tamaño según la pantalla.

¿Para qué sirve el Rect Transform en un texto? Define la caja contenedora donde vive el texto, controla su posición, tamaño y cómo se alinea internamente, igual que con cualquier elemento UI en Unity.

¿Cómo importar tus propias fuentes en Unity con Text Mesh Pro?

Por defecto, Text Mesh Pro solo te da acceso a la fuente Liberation Sans. Para usar tipografías propias necesitas un proceso de dos pasos.

Importar el archivo TTF

En el ejemplo se usa la fuente KennyBlogs.ttf, parte de los assets gratuitos de Kenny, que son libres para usar en cualquier proyecto.

Crear el Font Asset de Text Mesh Pro

Aquí viene el paso que muchos olvidan. Text Mesh Pro no usa directamente el archivo TTF, sino que necesita generar su propio Font Asset a partir de él.

¿Qué formato de fuente acepta Unity? Unity acepta archivos TTF (True Type Font) y los convierte en un Font Asset propio mediante Text Mesh Pro para poder renderizarlos correctamente.

Una vez asignada, tu texto se renderiza con la nueva tipografía y puedes ajustar color, tamaño y alineación como con cualquier otra fuente.

¿Qué sigue después de dominar texto e imágenes en UI?

¿Has encontrado alguna propiedad de Text Mesh Pro que te haya sorprendido al explorarla? Cuéntalo en los comentarios.

Introducción y configuración inicial

Transforma la UI de tu juego Match 3 en Unity

Cargando el proyecto

Unity UI vs UI Toolkit: cuál usar en 2022

El sistema de UI de Unity

Canvas y sus modos de renderizado en Unity

El Rect Transform

Componente de imagen

Máscaras y efectos

Texto en Unity con Text Mesh Pro

Creando botones en nuestra interfaz

Otros elementos de UI

Auto layout

Scroll views

Controla grupos de UI con Canvas Group

Haciendo interfaces para el juego

Pantallas de UI para Safari Match en Unity

Importar y configurar sprites UI en Unity

Construye la Start Screen en Unity

Animando el fondo con shader graph

Agregando lógica a la pantalla de título

Scroll view de selección de niveles en Unity

Genera lista de niveles con prefabs en Unity

Corrige bugs de UI antes de añadir más features

Contador de puntos y pausa en Unity HUD

Anima iconos con DOTween en Unity

Pantalla de pausa en Unity con Layout Group

Pantalla de pausa con reseteo de escena en Unity

Rediseño visual de la pantalla Game Over en Unity

Pantalla de opciones con layouts en Unity

Implementación de la pantalla de configuración

Interfaces de Unity que parecen juegos profesionales

Texto en Unity con Text Mesh Pro

Progreso del curso

Introducción y configuración inicial

El sistema de UI de Unity

Haciendo interfaces para el juego

Recursos

Recursos