AnnotatedString: texto enriquecido combinado
Aplique estilos a spans dentro de un único bloque Text.
AnnotatedString: texto enriquecido combinado es una lección gratuita de Jetpack Compose Academy en CoddyKit. Esta es la lección 4 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Jetpack Compose Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Jetpack Compose Academy incluye 4 lecciones en total.
Partes de esta lección aún no han sido traducidas y se muestran en inglés.
One Text, Many Styles
Sometimes one word in a sentence needs to stand out. AnnotatedString lets you style spans inside a single Text composable.
Why Not Two Texts
You could split words into separate Texts, but they would wrap awkwardly. AnnotatedString keeps everything as one flowing, naturally wrapping line.
Build It with buildAnnotatedString
Create rich text using the buildAnnotatedString builder. Inside it you append plain text and styled sections in the order you want them shown.
val s = buildAnnotatedString {
append("Hello ")
}Append Plain Text
Use append to add normal characters. Calls stack up in sequence, so the final string reads exactly in the order you appended.
append("Welcome, ")
append("friend")Style a Span
Wrap part of the text in withStyle and give it a SpanStyle. Everything appended inside that block gets that style applied.
withStyle(SpanStyle(fontWeight = FontWeight.Bold)) {
append("important")
}SpanStyle Options
A SpanStyle can set color, fontWeight, fontStyle, fontSize, and more, so each span can look completely different from its neighbors.
SpanStyle(color = Color.Blue,
fontWeight = FontWeight.Bold)Render It in Text
Pass your finished AnnotatedString straight to Text, just like a plain string. Compose draws every styled span in place.
Text(text = annotatedGreeting)Mix Bold and Color
Combine spans freely: a bold red word next to a normal sentence. Each withStyle block only affects the text appended inside it. 🙂
ParagraphStyle for Blocks
For line-level changes like alignment or spacing, use ParagraphStyle instead of SpanStyle. It styles whole paragraphs, not single words.
Tag Clickable Words
You can attach a LinkAnnotation so part of the text becomes tappable, perfect for inline links or a Terms of Service line.
Rich Text, One Element
AnnotatedString gives you mixed styling, links, and emphasis in a single Text. It is how you build natural, expressive copy.
Quick Check
You want one word bold inside a normal sentence in a single Text. What do you use?
Recap
You built rich text with buildAnnotatedString, styling spans via withStyle and SpanStyle. One Text can now hold many looks at once. 🎉
Preguntas frecuentes
¿La lección «AnnotatedString: texto enriquecido combinado» es gratis?
Sí — el texto completo de «AnnotatedString: texto enriquecido combinado» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Jetpack Compose Academy, actualiza a CoddyKit PRO. El curso de Jetpack Compose Academy incluye 4 lecciones en total.
¿Qué aprenderé en «AnnotatedString: texto enriquecido combinado»?
Aplique estilos a spans dentro de un único bloque Text. Practicas Jetpack Compose Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar Jetpack Compose Academy?
No se requiere experiencia previa. Jetpack Compose Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 4 de 4.
¿Cuánto tiempo toma la lección «AnnotatedString: texto enriquecido combinado»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de Jetpack Compose Academy?
Sí. Cada lección de Jetpack Compose Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- El Composable Text
- Tamaño, peso y estilo de fuente
- Color, alineación y desbordamiento
- AnnotatedString: texto enriquecido combinado