A modern programming language that makes developers happier.

kotlinlang

When using `AnnotatedString`, I can specify a background for parts of the text with `SpanStyle.background` ... is it possible to specify how that background is rendered somehow, i.e. Id like it to have rounded corners?

Couldn't find a way to do this using annotated strings (really hope there is a way), but I was able to achieve the same result using FlowRow with a very small horizontal spacing

It does seem impossible using the current API :disappointed:  If you dont mind sharing - how are you doing it with a FlowRow, one `Text` per char?

Screenshot 2023-09-01 at 16.10.06.png

```FlowRow(horizontalArrangement = Arrangement.spacedBy(4.dp)) {
                        Text(
                            text = socialHandle,
                            modifier = Modifier.alignByBaseline(),
                            fontWeight = FontWeight.Medium
                        )
                        Text("added the", modifier = Modifier.alignByBaseline())
                        Text(
                            text = label,
                            fontWeight = FontWeight.Medium,
                            modifier = Modifier
                                .alignByBaseline()
                                .clip(MaterialTheme.shapes.small)
                                .background(tint)
                                .clickable {/* TODO */ }
                                .padding(horizontal = 4.dp, vertical = 2.dp)
                        )
                        Text("label on $time", modifier = Modifier.alignByBaseline())
                }```
=

Screenshot 2023-09-01 at 16.11.36.png

Ahh, gotcha! Thanks for the inspo :smiley:

Created a feature request for it: <https://issuetracker.google.com/issues/298540705> Feel free to :star2:

Check this you need some work to achieve the result that you want but you can do any custom layout you want <https://github.com/saket/ExtendedSpans>

Thats super interesting, thanks for the link!

This is a little clunky but I’ve done something similar based on <https://developer.android.com/reference/kotlin/androidx/compose/foundation/text/InlineTextContent> . Where the example has `Box` you could instead have `Text(modifier = Modifier.background(color = …, shape = RoundedCornerShape(...)))`. Then use `Text(text = …, inlineContent = …)` (the example uses `BasicText` but `Text`works too).

For the width and height in `PlaceHolder` I use the font size.

Some pretty neat solutions on here, thank you all. Are you able to get the sizing just right with that too, <@U01J21PP8TG>? Thats my biggest worry with "faking it"; the highlighted text in my case is part of a word/sentence and even the slightest difference will be noticeable.

That might possibly be an issue. When I said “something similar” I am inserting _icons_ into an annotated string. They may be slightly off (I can’t tell though) but look good for my purposes.

Given all of this, I think Ill just stick to the rectangular background that SpanStyle.background offers, and hope for a shape parameter to arrive sometime in the future. Feel free to star the issue if you feel the same! I appreciate all the ideas shared, Ive definitely learned a few new concepts today thanks to them! :smiley:

I tried it with text. It did not line up well like the icon did (plus getting the width right is trickier than with an icon).