Aplica diseño a partes del texto

Puedes aplicar estilo a partes del texto para mejorar la legibilidad, aumentar la experiencia del usuario positiva y fomentar una mayor creatividad a través del uso de colores y fuentes.

Resultados

 Texto de Hello World con varios estilos
Figura 1. Es una línea de texto con varios estilos.

Compatibilidad de versiones

Esta implementación requiere que el minSDK de tu proyecto se establezca en el nivel de API 21 o superior.

Dependencias

Cómo aplicar estilo a partes del texto

El siguiente código muestra la cadena "Hello World" con la letra "H" en azul, la letra "W" en rojo y el resto del texto en negro. Para configurar diferentes estilos en un solo elemento Text componible, usa el siguiente código:

@Composable
fun MultipleStylesInText() {
    Text(
        buildAnnotatedString {
            withStyle(style = SpanStyle(color = Color.Blue)) {
                append("H")
            }
            append("ello ")

            withStyle(style = SpanStyle(fontWeight = FontWeight.Bold, color = Color.Red)) {
                append("W")
            }
            append("orld")
        }
    )
}

Puntos clave sobre el código

  • Usa buildAnnotatedString que devuelve una cadena AnnotatedString para establecer diferentes estilos dentro del texto.
  • Aplica un estilo a parte del texto con SpanStyle, una configuración que permite aplicar un estilo a nivel de los caracteres.

Colecciones que contienen esta guía

Esta guía forma parte de las colecciones seleccionadas de Guías rápidas que abarcan objetivos más amplios de desarrollo para Android:

El texto es una pieza central de cualquier IU. Descubre diferentes formas de presentar texto en tu app para brindar una experiencia del usuario agradable.

¿Tienes preguntas o comentarios?

Visita nuestra página de preguntas frecuentes y consulta las guías rápidas, o bien comunícate con nosotros y comparte tu opinión.