https://kotlinlang.org logo
#compose
Title
# compose
d

Daniele B

10/19/2020, 4:16 PM
Is there a way to make a word bold or italics within a Text in Jetpack Compose, without having to create different Texts for applying the bold or italics fontStyle?
n

nglauber

10/19/2020, 4:23 PM
you can use
AnnotatedString
.
Copy code
val builder = AnnotatedString.Builder().apply {
    append(
        AnnotatedString(
            "Texto Bold",
            SpanStyle(fontWeight = FontWeight.Bold)
        )
    )
    append(
        AnnotatedString(
            "Texto Strike",
            SpanStyle(textDecoration = TextDecoration.LineThrough)
        )
    )
    append(
        AnnotatedString(
            "Texto Big",
            SpanStyle(fontSize = 24.sp)
        )
    )
    append(
        AnnotatedString(
            "Texto Red",
            SpanStyle(color = Color.Red)
        )
    )
}
Text(text = builder.toAnnotatedString())
2
d

Daniele B

10/19/2020, 4:26 PM
I was hoping it was possible to use simple markups like * or “<b></b>” for making a word bold within a text
h

Halil Ozercan

10/19/2020, 4:31 PM
There is
compose-richtext
[0] if you want something quick. It doesn't support markup/markdown rendering right now but would give you a good idea of how to accomplish something like that. Also there is a PR[1] for exactly doing "markdown rendering" using
compose-richtext
. [0] https://github.com/zach-klippenstein/compose-richtext [1] https://github.com/halilozercan/compose-richtext/pull/1
👍 1
z

Zach Klippenstein (he/him) [MOD]

10/19/2020, 4:36 PM
That's not published as a library yet though unfortunately. Here's another solution: https://www.hellsoft.se/rendering-markdown-with-jetpack-compose/
268 Views