Gravity of elements within Row (Jetpack Compose)

Question

How do I set the gravity of elements within Row? I have two Image composables in my Row. I want the first Image to be at start of Row and the next element at end of Row.

I have tried doing:

Row(Modifier.fillMaxWidth()) {

    Image(
        painter = painterResource(id = R.drawable.logo_voodlee),
        contentDescription = "logo",
        modifier = Modifier
            .width(with(LocalDensity.current) { dimensionResource(id = R.dimen._100sdp) })
            .height(with(LocalDensity.current) { dimensionResource(id = R.dimen._55sdp) })
            .offset(x = with(LocalDensity.current) { dimensionResource(id = R.dimen._16sdp) }),
    )

    Image(
        painter = painterResource(id = R.drawable.ic_menu),
        contentDescription = "logo",
        modifier = Modifier
            .width(with(LocalDensity.current) { dimensionResource(id = R.dimen._19sdp) })
            .height(with(LocalDensity.current) { dimensionResource(id = R.dimen._19sdp) })
        ,
    alignment = CenterEnd //This is not working
    )
}

But it's not working.

Answer 1

You can apply in the Row the Arrangement.SpaceBetween

Row(
    Modifier.fillMaxWidth(),
    horizontalArrangement = Arrangement.SpaceBetween
) {
    /* ... */
    Box(Modifier.width(50.dp).height(50.dp).background(Red))
    Box(Modifier.width(50.dp).height(50.dp).background(Blue))
}