Hey folks I would use second pair of eyes eyes I am working kotlinlang #compose

Hey folks! I would use second pair of eyes 👀. I am working on a “rich text view” which would allow me to render additional content (images, for simplicity) along standard text. I use Compose’s

Text

with annotated string and embed images using

inlineContent

. What I am unable to do is to correctly align embedded content on text’s base line. Details in 🧵

😯 1

The illustration shows the desired state vs what I get when change

placeholderVerticalAlign

InlineTextContent

’s

Placeholder

. The ideal state is that the green part of item is always above baseline (orange line) and the red part is always below it (note that height’s of red & green parts are pre-computed for each item).

Text

the best way for that or is there another API which would give me more control over text’s layout?

ildar.i [Android]

04/05/2022, 7:33 PM

There is a

BasicText

- it provides more customization From the looks of it you can set green part ‘Above baseline’ and then slap red part below it (just throwing out thoughts)

you can also use translationY from graphicsLayer (see https://medium.com/mobile-app-development-publication/have-fun-with-jetpack-compose-graphicslayer-modifier-e39c12a4791f)

josefdolezal

04/05/2022, 7:43 PM

Thanks! I’ll look into BasicText.. Red and Green is a single composable, I only used different colors to demonstrate placeholder’s alignment behavior.. I’ll create a gist of what I have now

This is simplified implementation: https://gist.github.com/josefdolezal/f1db3c9e5783ec0cfc56290b7ffe2dfb

#compose Join Slack