La interfaz de usuario de texto enriquecido utiliza etiquetas de marcado simples para estilizar secciones de una cadena en negrita, cursiva, subrayado, color de fondo, variaciones de contorno y más. Puedes aplicar etiquetas de estilo a objetos TextLabel, TextButton, y TextBox.
Habilitar texto enriquecido
Debes habilitar el texto enriquecido en una base por objeto a través de su propiedad RichText en la ventana de Propiedades, o configurando la propiedad a true en un LocalScript.
Al editar la propiedad Text de un objeto en Studio, activar la casilla de verificación RichText en la ventana de Propiedades muestra la cadena de texto como un render final. Esto es útil para identificar y corregir errores en cualquier etiquetas soportadas.
Localizar una experiencia para admitir otros idiomas elimina las etiquetas de formato de texto enriquecido. Para asegurar que el formato aparezca en otros idiomas, vuelve a aplicar las etiquetas manualmente a tus cadenas localizadas.
Etiquetas soportadas
Las etiquetas de texto enriquecido son similares a las etiquetas XML/HTML y debes incluir tanto una etiqueta de apertura como de cierre alrededor del texto formateado.
<b>Texto formateado</b>
También puedes anidar etiquetas dentro de otras siempre que las cierres en el orden inverso en que las abriste.
<b><i><u>Texto formateado</u></i></b>
Color de fuente
<font color=""> </font>
Quiero el caramelo <font color="#FF7800">naranja</font>.
Quiero el caramelo <font color="rgb(255,125,0)">naranja</font>.
Tamaño de fuente
<font size=""> </font>
<font size="40">Esto es grande.</font> <font size="20">Esto es pequeño.</font>
Tipo de letra
<font face=""> </font>
<font face="Michroma">Este es el tipo de letra Michroma.</font>
Los nombres de las familias/tipos de letra se enumeran en la página de referencia del enum Font.
Familia de fuente
<font family=""> </font>
<font family="rbxasset://fonts/families/Michroma.json">Este es el tipo de letra Michroma.</font>
Los nombres de las familias/tipos de letra se enumeran en la página de referencia del enum Font.
Peso de fuente
<font weight=""> </font>
Esto es normal. <font weight="heavy">Esto es pesado.</font>
Esto es normal. <font weight="900">Esto es pesado.</font>
El peso de la fuente puede ser un nombre de cadena que no distingue entre mayúsculas y minúsculas incluyendo Thin, ExtraLight, Light, Regular, Medium, SemiBold, Bold, ExtraBold, o Heavy; también puede ser un número en factores de 100 entre 100 y 900.
Transparencia de fuente
<font transparency=""> </font>
Texto a <font transparency="0.5">50% de transparencia</font>.
Contorno
<stroke> </stroke>
| Parámetro | Propiedad equivalente | Valores de ejemplo |
|---|---|---|
| color | UIStroke.Color | "rgb(255,125,0)", "#FF7800" |
| thickness o th | UIStroke.Thickness | "1", "4", "0.5" |
| transparency o tr | UIStroke.Transparency | "0", "0.5", "1" |
| joins | UIStroke.LineJoinMode | "round", "bevel", "miter" |
| sizing | UIStroke.StrokeSizingMode | "fixed", "scaled" |
Ganaste <stroke color="#00A2FF" thickness="2" transparency="0.25" joins="miter">25 gemas</stroke>.
Consulta modificadores de apariencia de UI para detalles sobre los parámetros de la etiqueta <stroke> como thickness y joins.
Negrita
<b> </b>
Texto en <b>negrita</b>.
Cursiva
<i> </i>
Texto <i>en cursiva</i>.
Subrayado
<u> </u>
Texto <u>subrayado</u>.
Tachado
<s> </s>
Texto con <s>tachado</s>.
Salto de línea
<br/>
Nueva línea ocurre después de esta oración.<br/>Siguiente oración...
Mayúsculas
<uppercase> </uppercase>
<uc> </uc>
<uppercase>Mayúsculas</uppercase> hacen que las palabras se lean alto!
<uc>Mayúsculas</uc> hacen que las palabras se lean alto!
Minúsculas pequeñas
<smallcaps> </smallcaps>
<sc> </sc>
Mi nombre es <smallcaps>Diva Dragonslayer</smallcaps>.
Mi nombre es <sc>Diva Dragonslayer</sc>.
Marcado
<mark> </mark>
Texto <mark color="#009966" transparency="0">resaltado</mark>.
Comentario
<!-- -->
Después de esto hay un comentario...<!--Esto no aparece en el texto final--> y ahora más texto...
Formas de escape
Si deseas renderizar ciertos caracteres como < o > y eximirlos de ser considerados como parte de las etiquetas de texto enriquecido, puedes escribirlos en su forma de escape.
| Caracter | Escape | Ejemplo | Resultado |
|---|---|---|---|
| < | < | 10 < 100 | 10 < 100 |
| > | > | 100 > 10 | 100 > 10 |
| " | " | Conoce "Diva Dragonslayer" | Conoce "Diva Dragonslayer" |
| ' | ' | ¡La mascota de Diva es un halcón! | ¡La mascota de Diva es un halcón! |
| & | & | Renderiza otra forma de escape <b>&lt;</b> escapando un ampersand | Renderiza otra forma de escape < escapando un ampersand |