I am trying to create a row with 2 pieces of text,...

# compose

[zsperske]

I am trying to create a row with 2 pieces of text, where one is aligned to the start & the other to the end. Additionally I want each piece of text to have a minimum size of 100.dp. However when I try to do that, the first piece of text tramples over the other and ignores the minimum width. What am I doing wrong?

Row(modifier = Modifier.fillMaxWidth().padding(8.dp),
        verticalAlignment = CenterVertically,
        horizontalArrangement = Arrangement.SpaceBetween) {
        Text(modifier = Modifier.defaultMinSize(minWidth = 100.dp), text = "Some text that gets really long and keeps going and going", overflow = TextOverflow.Ellipsis, maxLines = 1)

        Text(modifier = Modifier.defaultMinSize(minWidth = 100.dp), text = "Other text that gets really long", overflow = TextOverflow.Ellipsis, maxLines = 1)
      }

[Francesc]

Uses weight and textAlign for the 2nd one. If you need something fancier that takes into account the actual length of each text you may need to look at Layout

Row(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(8.dp),
                verticalAlignment = CenterVertically,
                horizontalArrangement = Arrangement.SpaceBetween,
            ) {
                Text(
                    modifier = Modifier.defaultMinSize(minWidth = 100.dp).weight(1f),
                    text = "Some text that gets really long and keeps going and going",
                    overflow = TextOverflow.Ellipsis,
                    maxLines = 1,
                )

                Text(
                    modifier = Modifier.defaultMinSize(minWidth = 100.dp).weight(1f),
                    text = "Other text that gets really long",
                    overflow = TextOverflow.Ellipsis,
                    textAlign = TextAlign.End,
                    maxLines = 1,
                )
            }

[zsperske]

will try this, thanks!

[zsperske]

using weights makes the min size irrelevant i’ve noticed, since with weights of 1 on each they will take up 50% of the screen. even if I overweight so that one gets 90% of the width, the min width is ignored

[Francesc]

if you want to check how much space each needs and adjust how much you allocate to each then look into Layout and intrinsic measurements

[Loney Chou]

Giving a minWidth to the second Text doesn't mean the first Text will consider that, because when the second one gets measured the size of the first one is already decided. You need a custom Layout.

[steelahhh]

This might be what you’re looking for

[zsperske]

nice, thanks all!