Feeling... not smart. I'm having a simple problem ...

# compose

[Colton Idle]

Feeling... not smart. I'm having a simple problem with centering text. Here is what it looks like. Code in thread.

[Colton Idle]

Column(Modifier.padding(16.dp).fillMaxWidth()) {
    Column(
            Modifier.fillMaxWidth(),
    ) {
        Text(
                modifier = Modifier.fillMaxWidth(),
                text = loremText,
                textAlign = TextAlign.Center,
                maxLines = 1,
                overflow = TextOverflow.Ellipsis,
        )
        Spacer(Modifier.height(12.dp).
        Text(
                modifier = Modifier.fillMaxWidth(),
                text = loremText,
                textAlign = TextAlign.Center,
                maxLines = 3,
                overflow = TextOverflow.Ellipsis,
        )
    }
}

[robnik]

That seems to work for me. (I assumed Spacer12) is just Spacer(Modifier.height(12.dp).

[Colton Idle]

Woah. Very weird. Let me try running on an actual device?

[Colton Idle]

@robnik nope. On physical device it looks the same. Dang. Not sure what could be the issue.

[robnik]

Probably not related, but what's the point of the nested Column? I can remove it and layout appears the same.

[Vsevolod Ganin]

Tried your code too, doesn’t repro on beta06 either. What version of Compose are you using? I remember vaguely, there was some bug with textAlign but that was still in some alpha

[Colton Idle]

Using beta5

[Colton Idle]

Interesting. Seems related to my theme?

setContent {
            AppTheme {
                Column(Modifier.padding(16.dp).fillMaxWidth()) {
                    Spacer(Modifier.height(120.dp))
                    Column(
                            Modifier.fillMaxWidth(),
                    ) {
                        Text(
                                modifier = Modifier.fillMaxWidth(),
                                text = "asdf ".repeat(100),
                                textAlign = TextAlign.Center,
                                maxLines = 1,
                                overflow = TextOverflow.Ellipsis,
                        )
                        Spacer(Modifier.height(12.dp))
                        Text(
                                modifier = Modifier.fillMaxWidth(),
                                text = "asdf ".repeat(100),
                                textAlign = TextAlign.Center,
                                maxLines = 3,
                                overflow = TextOverflow.Ellipsis,
                        )
                    }
                }
            }
        }

this has the issue, but if I remove my wrapping AppTheme, then there's no issues.

This is AppTheme. Anyone have any ideas what could be going on?

@Composable
fun AppTheme(darkTheme: Boolean = isSystemInDarkTheme(), content: @Composable () -> Unit) {
    val colors = if (darkTheme) DarkColorPalette else LightColorPalette

    ProvideAppColors(colors) {
        MaterialTheme(content = content)
    }
}

@Adam Powell I suppose I'll file a bug, but maybe I'm doing something silly here?

[Colton Idle]

Filed a bug for center aligning text not working @Siyamed

https://issuetracker.google.com/issues/187339384

[Siyamed]

isnt this the same as b/183835422

[Siyamed]

text align and ellipsis does not work well

[Siyamed]

ah no sorry, that one is with letterspacing

[Siyamed]

looking at the first screenshot in the thread they look the same

[Siyamed]

probably letterspacing is set via theme

[Siyamed]

(ellipsis, letter spacing and text align combination is broken on android there wasnt anything to do on compose side)

[Colton Idle]

I put the theme in the bug report. It just defaults to material. @Siyamed so there's nothing I can do here? I'm not touching letter spacing or anything.

[Siyamed]

letteerspacing is set by the material theme afaik

[Siyamed]

you can remove letter spacing.

[Siyamed]

(or reset to default)

[Colton Idle]

Interesting. So is this one of those bugs that will never be fixed sort of thing? Or should my designers keep holding their breath

[Siyamed]

in min repro I checked in https://issuetracker.google.com/issues/183835422#comment4, ellipsis, align and letter spacing should come together.

[Siyamed]

So is this one of those bugs that will never be fixed sort of thing?

A few options:
1 - will work after Android S/T
2 - might work after Android O
3 - requires native (c++) code to be embedded into Compose, which I do not know if will happen or when will happen. no ideas there.

[Siyamed]

I am really sorry to say that, it might be easier to tell designers to keep holding their breath, or remove letter spacing.

[Colton Idle]

Oof. So remove letter spacing or remove ellipsis?

Silly question but is this advice that you can put somewhere? I want to be able to point my designer to a resource and say "hey it's not worth doing letter spacing if you want ellipsis as per the person that works on text at Google"

[Siyamed]

I can put on the bug?

[Colton Idle]

Yes please!

[Siyamed]

https://issuetracker.google.com/issues/183835422#comment7

¯\_(ツ)_/¯

[Colton Idle]

Thank you. That makes it very clear. Much appreciated