Skip to content
This repository was archived by the owner on Dec 27, 2024. It is now read-only.

Horizontal chain in Compose does not support RTL layout #857

Open
ericksli opened this issue Jul 11, 2024 · 0 comments
Open

Horizontal chain in Compose does not support RTL layout #857

ericksli opened this issue Jul 11, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@ericksli
Copy link

Using constraint layout compose version 1.1.0-alpha13 with compose BOM version 2024.06.00, after setting up horizontal chain then the elements in the chain sequence does not flip in RTL layout.

Here is a demo:

@Composable
fun ChainDemo(modifier: Modifier = Modifier) {
    ConstraintLayout(modifier = modifier) {
        val (text1, text2) = createRefs()
        createHorizontalChain(text1, text2, chainStyle = ChainStyle.SpreadInside)
        Text(
            text = "1",
            modifier = Modifier.constrainAs(text1) {
                start.linkTo(parent.start)
                end.linkTo(text2.start)
            },
        )
        Text(
            text = "2",
            modifier = Modifier.constrainAs(text2) {
                start.linkTo(text1.end)
                end.linkTo(parent.end)
            },
        )
    }
}

@Preview(name = "LTR", showBackground = true, locale = "en")
@Preview(name = "RTL", showBackground = true, locale = "ar")
@Composable
private fun ChainDemoPreview() {
    ChainDemo(modifier = Modifier.fillMaxWidth())
}

Preview of the code above:

image

If we comment out the createHorizontalChain statement, then the element ordering is flipped propely in RTL layout:

image

@ericksli ericksli added the bug Something isn't working label Jul 11, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant