Channels
#compose
Title
r
Rahul Sainani
02/24/2021, 10:50 AMIs anybody else also stuck with text not being vertically center in buttons, top app bar, etc? Seems a bit towards the top than center.
c
Cicero
02/24/2021, 11:00 AMr
Rahul Sainani
02/24/2021, 11:31 AMLooks center in your preview but not here. Tried putting just text and even row with vertically center alignment inside the button but doesn't work.
c
Cicero
02/24/2021, 12:28 PMCould this be something in your theme?
Could I have your code snippet to compile here?
o
okarm
02/24/2021, 1:09 PMThat font looks like Poppins. If it is then I gotta tell you that Poppins is not vertically centered. If you want to achieve that you'll have to eyeball a top offset to counteract that. Been burned by Poppins before...
In the View system there is an attribute to remove implicit bottom padding from a TextView that was meant as an extra space for descenders. That did help to push the glyphs down alittle bit. Dunno if something like that exists in Compose.
r
Rahul Sainani
02/24/2021, 1:44 PMYes you're right! It's Poppins and the issue is definitely in the font. Will look for that property on compose. Thank you both! 🙌
🎉 1
c
Chris Grigg
02/24/2021, 10:14 PMI think you’re seeing the same font padding issue as me!
I posted about it on stack overflow two weeks ago https://stackoverflow.com/questions/66126551/jetpack-compose-centering-text-without-font-padding
When I posted about it here, someone suggested I open an issue on the Jetpack Compose feature tracker. I did, it got marked as duplicate, and it appears that there’s been a little activity on the existing issue since I posted!
r
Rahul Sainani
02/27/2021, 10:57 PMUpvoted and starred, yeah something like this is definitely needed. Is the -25f thing working for you well on different devices or does it need a density multiplier? I'm definitely gonna try this till there is a solution, thanks for sharing!
c
Chris Grigg
02/28/2021, 1:23 AMTbh I haven’t tried it on other devices, I’m spoiled by only having to target one particular device with a specific resolution. I would expect to need to tweak it so it works correctly on other devices, though. I’m not experienced enough with Android to advise there, this is just the way I’d handle something like this in CSS.
Also note that the -25f thing is usually just a starting point, I’ve been fine tuning as necessary. I’d also expect other fonts to be different. It all feels so hacky, I hope there’s a better solution soon!