val textMeasurer = rememberTextMeasurer()
val measureResult = textMeasurer.measure(
    text = text,
    style = TextStyle(
        fontSize = fontSize,
        fontFamily = fontFamily,
    ),
)
println("measuredSize: " + measureResult.size)
Text(
    text = text,
    color = color,
    fontSize = fontSize,
    fontFamily = fontFamily,
    textAlign = TextAlign.Center,
    modifier = Modifier
        .wrapContentSize()
        .drawWithCache {
            println("actualSize: " + this.size)
            onDrawWithContent {
                drawContent()
            }
        }
    ,
)

Why is the actual size wider than the measured size?

measuredSize: 152 x 169
actualSize: Size(158.0, 169.0)

Note:

text

is a single codepoint

try with

LocalTextStyle.current.merge(fontSize = fontSize, fontFamily = fontFamily)

?

Oh yes, that does work, thanks! So I guess there is some property that was being picked up by the Text composable

Text composable (a material component) merges all its attributes with

LocalTextStyle.current

which is the current TextStyle coming from MaterialTheme. TextMeasurer on the other hand is a

ui

class which has no concept of Material or theming whatsoever. So, it's crucial to use

LocalTextStyle

to have the same result as Text composable. I would also like to note that Text composable decides its color via

LocalContentColor

in

material3

, and

LocalContentColor + LocalContentAlpha

in

material

. So you may also need to take those into account if you want to draw the resulting

TextLayoutResult

.

Do you mean: “…merges all its attributes with the

style

argument (which defaults to

LocalTextStyle.current

which is the current TextStyle coming from MaterialTheme)“?

Is there a way to measure a annotedstring mix of multiple formats?

TextMeasurer

supports

AnnotatedString

Another question, is it possible to measure Annotatedstring with inner inlinecontent ?

Yes,

TextLayoutResult

has all the necessary functions to get the line metrics, indices where each line starts and ends, etc.

I have a scenario where there is a Text composable showing a large FULL_WIDTH single codepoint and then I decorate it with some smaller text to indicate certain properties of that codepoint. This makes the composable larger than a normal non-decorated Text. Furthermore, I want the resulting composable to be the same size regardless of content (so that they can be displayed nicely in a grid - actually I’m using a FlowRow but it looks like a grid). So I need to do some measurements upfront. Is it okay to call measure (and perform various placement calculations) outside of the Text composable, or is this a performance concern?

It can be a performance concern if the measurement is not cached.

TextMeasurer

itself has an internal cache that's initialized with a default size of 8. So as long as your inputs to the measurement do not change,

TextMeasurer

will skip the expensive text layout computation. Fortunately you can go even one step further and

remember

the measurement result, completely skipping even the cache hit-miss detection. In short, it's not usually a major problem if you do the text layout once during composition.