Entspricht dem Einschränkungslayout 0dp

Ich habe versucht, mit Compose das folgende Layout zu erreichen:

Dafür habe ich das Composable erstellt:

@Preview(showBackground = true)
@Composable
fun element() {
    ConstraintLayout(
        modifier = Modifier.fillMaxWidth()
    ) {
        val (checkbox, title, icon) = createRefs()

        Text(
            text = "This would be some text",
            style = TextStyle(
                color = Color.Black,
                fontSize = 18.sp,
            ),
            modifier = Modifier.constrainAs(title) {
                top.linkTo(parent.top)
                bottom.linkTo(parent.bottom)
                start.linkTo(checkbox.end)
                end.linkTo(icon.start)
            },
        )

        Checkbox(
            checked = false,
            modifier = Modifier.constrainAs(checkbox) {
                top.linkTo(title.top)
                bottom.linkTo(title.bottom)
                start.linkTo(parent.start)
            },
            onCheckedChange = {},
        )

        Icon(
            asset = Icons.Filled.Close,
            modifier = Modifier
                .constrainAs(icon) {
                    top.linkTo(title.top)
                    bottom.linkTo(title.bottom)
                    end.linkTo(parent.end)
                }
        )
    }
}

Der zusammensetzbare Text füllt jedoch nicht den gesamten Raum aus und die Benutzeroberfläche sieht folgendermaßen aus:

Ich habe versucht, Modifikatoren hinzuzufügen Text zusammensetzbar wie Modifier..fillMaxWidth()aber das ergibt:

Ich habe auch versucht, einen Einschränkungssatz mit einer horizontalen Kette zu verwenden, aber ohne Erfolg. Ich kenne das Entfernen end.linkTo(icon.start) würde so aussehen, als ob dies erreichbar wäre, aber wenn der Text sehr lang wäre, würde er sich mit dem Löschsymbol überlappen.

Was fehlt mir hier? Wie erreiche ich das gleiche Ergebnis wie im Ansichtssystem, wenn wir das sagen? TextViewDie Breite beträgt 0dp?

Verwenden Dimension.fillToConstraints:

Eine Dimension, die sich entsprechend den Einschränkungen ausdehnt. Damit dies funktioniert, sollten Links von beiden Seiten entsprechend dieser Dimension angegeben werden.

Fügen Sie diese Zeile zu Ihrem hinzu Text Modifikator:

width = Dimension.fillToConstraints

Es wird also:

Text(
    text = "This would be some text",
    style = TextStyle(
        color = Color.Black,
        fontSize = 18.sp,
    ),
    modifier = Modifier.constrainAs(title) {
        top.linkTo(parent.top)
        bottom.linkTo(parent.bottom)
        start.linkTo(checkbox.end)
        end.linkTo(icon.start)
        width = Dimension.fillToConstraints
    },
)