A texto rico da UI utiliza tags de marcação simples para estilizar seções de uma string em negrito, itálico, sublinhado, cor de preenchimento, variações de contorno e muito mais. Você pode aplicar tags de estilo aos objetos TextLabel, TextButton e TextBox.
Habilitar texto rico
Você deve habilitar texto rico em uma base por objeto através da propriedade RichText na janela de Propriedades, ou definindo a propriedade como true em um LocalScript.
Ao editar a propriedade Texto de um objeto no Studio, alternar a caixa de seleção RichText na janela de Propriedades exibe a string de texto como uma renderização final. Isso é útil para identificar e corrigir erros em qualquer tags suportadas.
Localizar uma experiência para suportar outros idiomas remove as tags de formatação de texto rico. Para garantir que a formatação apareça em outros idiomas, reaplique as tags manualmente às suas strings localizadas.
Tags suportadas
As tags de texto rico são similares às tags XML/HTML e você deve incluir tanto uma tag de abertura quanto uma de fechamento ao redor do texto formatado.
<b>Texto formatado</b>
Você também pode aninhar tags dentro de outras, desde que as feche na ordem inversa de como as abriu.
<b><i><u>Texto formatado</u></i></b>
Cor da fonte
<font color=""> </font>
Eu quero o doce <font color="#FF7800">laranja</font>.
Eu quero o doce <font color="rgb(255,125,0)">laranja</font>.
Tamanho da fonte
<font size=""> </font>
<font size="40">Isto é grande.</font> <font size="20">Isto é pequeno.</font>
Tipo de fonte
<font face=""> </font>
<font face="Michroma">Este é o tipo de fonte Michroma.</font>
Os nomes das fontes/famílias de fontes estão listados na página de referência do enum Font.
Família da fonte
<font family=""> </font>
<font family="rbxasset://fonts/families/Michroma.json">Este é o tipo de fonte Michroma.</font>
Os nomes das fontes/famílias de fontes estão listados na página de referência do enum Font.
Peso da fonte
<font weight=""> </font>
Isto é normal. <font weight="heavy">Isto é pesado.</font>
Isto é normal. <font weight="900">Isto é pesado.</font>
O peso da fonte pode ser um nome de string sem diferenciação de maiúsculas e minúsculas, incluindo Thin, ExtraLight, Light, Regular, Medium, SemiBold, Bold, ExtraBold, ou Heavy; também pode ser um número em múltiplos de 100 entre 100 e 900.
Transparência da fonte
<font transparency=""> </font>
Texto a <font transparency="0.5">50% de transparência</font>.
Contorno
<stroke> </stroke>
| Parâmetro | Propriedade Equivalente | Valores de Exemplo |
|---|---|---|
| color | UIStroke.Color | "rgb(255,125,0)", "#FF7800" |
| thickness ou th | UIStroke.Thickness | "1", "4", "0.5" |
| transparency ou tr | UIStroke.Transparency | "0", "0.5", "1" |
| joins | UIStroke.LineJoinMode | "round", "bevel", "miter" |
| sizing | UIStroke.StrokeSizingMode | "fixed", "scaled" |
Você ganhou <stroke color="#00A2FF" thickness="2" transparency="0.25" joins="miter">25 gemas</stroke>.
Consulte modificadores de aparência da UI para detalhes sobre os parâmetros da tag <stroke> como thickness e joins.
Negrito
<b> </b>
Texto em <b>negrito</b>.
Itálico
<i> </i>
Texto <i>em itálico</i>.
Sublinhado
<u> </u>
Texto <u>sublinhado</u>.
Tachado
<s> </s>
Texto com <s>tachado</s> aplicado.
Quebra de linha
<br/>
Nova linha ocorre após esta frase.<br/>Próxima frase...
Maiúsculas
<uppercase> </uppercase>
<uc> </uc>
<uppercase>Maiúsculas</uppercase> faz palavras soarem alto!
<uc>Maiúsculas</uc> faz palavras soarem alto!
Letras minúsculas pequenas
<smallcaps> </smallcaps>
<sc> </sc>
Meu nome é <smallcaps>Diva Dragonslayer</smallcaps>.
Meu nome é <sc>Diva Dragonslayer</sc>.
Marcar
<mark> </mark>
Texto <mark color="#009966" transparency="0">destacado</mark>.
Comentário
<!-- -->
Depois disso é um comentário...<!--Isto não aparece no texto final--> e agora mais texto...
Formas de escape
Se você quiser renderizar certos caracteres como < ou > e isentá-los de consideração como parte das tags de texto rico, você pode escrevê-los em sua forma de escape.
| Caractere | Escape | Exemplo | Resultado |
|---|---|---|---|
| < | < | 10 < 100 | 10 < 100 |
| > | > | 100 > 10 | 100 > 10 |
| " | " | Encontre "Diva Dragonslayer" | Encontre "Diva Dragonslayer" |
| ' | ' | O animal de estimação de Diva's é um falcão! | O animal de estimação de Diva é um falcão! |
| & | & | Renderizar outra forma de escape <b>&lt;</b> escapando um e comercial | Renderizar outra forma de escape < escapando um e comercial |