I'm trying to do an avatar with user initials Basi...

# multiplatform

[Aviv Shlomi]

I'm trying to do an avatar with user initials
Basically a circle with text on it.

When the fontSize is big then it works correctly but when I have font size 12 and circle size 20

I get different results on Android and iOS - On Android it shows the correct layout but on iOS the text get squished and pushed down.

(left image iOS, right image Android, )

Anyone know why this is?

[Joel Denke]

Double check text style. I think Android get Roboto and iOS San Francisco default. Check if those get different line height or line space somewhere.
Can check this by override text style within your circle to enforce iOS and Android using identical text styles.

Another thing, check also Android OS settings not enlarged font. Android using sp and different font scaling compared to iOS.

[Joel Denke]

Even if circle 20dp, using 12sp font not helping if user increase font size on their phone. Will not be same.
I think can do wrapped box measure based on text itself and clip circle. And add padding to text. Then circle based on actual measured text size.

[Aviv Shlomi]

Overriding the text style worked!
Thank you very much Joel