Start and End vs Left and Right

Android Programming (5th Edition) 28. Showing Dialogs with Jetpack Compose
1

On pages 623 and 625 the book used Alignment.TopStart, TopEnd, CentreStart and CenterEnd to align the images properly. I guess this is one of those rare situations where Start should realy be Left and End should really be Right as we’re dealing with images and not text.

If the app is translated into Arabic for example (i.e. right to left direction), users will be confused: they will choose left half and the image will show the topping on the right half.

One way to deal with this issue is to swap right and left when translating string.xml, which is not ideal.

Another way is to make use of what we learnt in that same chapter; we can wrap the content of PizzaHeroImage in a CompositionLocal as follows:

@Composable
fun PizzaHeroImage(
    ...
) {
    CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Ltr ) {
        Box(
            ...
        ) {
            ...
        }
    }
}

This will ensure that regardless of the user’s layout direction, the image will always show Start on the Left and End on the Right.

I have to say that the way the book explains CompositionLocal made it finally click for me. I was super confused when I read about it in the docs. Fantastic book, but I really wish the focus was on Jetpack Compose.

2 Likes