Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to set Spacer between with two elements in a row

How to use Spacer filling between with two elements in a row, let one element at the start of row and another at the end?

Row {
    Text("Start")
    Spacer(modifier = Modifier.SpaceBetween)  // How to set the modifier
    Text("End")
}
like image 783
ccd Avatar asked Oct 19 '20 10:10

ccd


Video Answer


2 Answers

You can use this:

Row(
    modifier = Modifier.fillMaxWidth(),
    horizontalArrangement = Arrangement.SpaceBetween
) {
    Text("Start")
    Text("End")
}
like image 27
Saurabh Thorat Avatar answered Sep 27 '22 22:09

Saurabh Thorat


With 1.0.x the Modifier.SpaceBetween doesn't exist.

You can use the horizontalArrangement parameter in the Row applying theArrangement.SpaceBetween.This parameter places children such that they are spaced evenly across the main axis, without free space before the first child or after the last child.

Row( modifier = Modifier.fillMaxWidth(),
        horizontalArrangement = Arrangement.SpaceBetween
    ) {
    Text("Start")
    Text("End")
}

As alternative you can apply the weight(1f) to the Spacer.
Something like:

Row (modifier = Modifier.fillMaxWidth()) {
    Text("Start")
    Spacer(Modifier.weight(1f))
    Text("End")
}

enter image description here

like image 142
Gabriele Mariotti Avatar answered Sep 27 '22 21:09

Gabriele Mariotti