Is there a way to get a `Text` to stay centered wh...
# compose
r
Is there a way to get a
Text
to stay centered when it overflows. My label in
BottomNavigationItem
is overflowing a bit, but going off-center to the right. Image in thread.
Despite code like:
Copy code
BottomNavigationItem(
    icon = { Icon(item.icon, contentDescription = null) },
    label = {
        Text(item.name, maxLines = 1, textAlign = TextAlign.Center,
             overflow = TextOverflow.Visible, softWrap = false)
    },
c
cc @Louis Pullen-Freilich [G]
r
I can manually fix it with
Modifier.offset(-6.dp)
but obviously that's fugly and won't work for different screens.
l
This is happening because there is padding inside
BottomNavigationItem
at the start and end that constrains the size of the text (you can see in the image the bounds of the text, and how the ‘s’ at the end is drawing outside of it. If the text is bigger (such as translated text in a different language, or maybe the user has increased the overall font scaling of the device) then the text will have no choice but to draw outside of the item, which is probably not what is intended here. If you really want to ignore the default padding so there is more space for text, I would suggest instead creating your own implementation of
BottomNavigationItem
instead, this isn’t really supported and there isn’t a nice way of handling this without just having more space for the text in the first place
r
Okay, thanks. Well, regardless of the reason for the overflow, it still seems like if text is centered, then it should stay centered when it overflows (ie, the overflow should be equal amounts left and right). In my app, the items to the left and right have plenty of space, so if this one approached the item edge it would look okay. But now that it's off-center it looks bad.
l
Might be worth filing a bug for that, maybe the overflow should use the text alignment to work out where to place the new text
1