Hi, I am new to compose and I am trying ConstraintLayout, I have this issue where the title is overlapping with favorite button, Any help is appreciated. Thank you.

ConstraintLayout(modifier = Modifier.padding(16.dp)) {
        val (headerImage, title, subtitle, date, like) = createRefs()
        val modifier = Modifier
            .preferredHeight(180.dp)
            .fillMaxWidth()
            .clip(RoundedCornerShape(8.dp))
            .constrainAs(headerImage) {
                top.linkTo(parent.top)
                centerHorizontallyTo(parent)
            }
        Image(
            asset = image,
            modifier = modifier,
            contentScale = ContentScale.Crop
        )
        likeCounter(
            isFavorite = isFavorite.value,
            tintColor = colors.primary,
            updateCounts = { newValue -> isFavorite.value = newValue },
            modifier = Modifier.constrainAs(like) {
                top.linkTo(headerImage.bottom)
                end.linkTo(parent.end)
            }
        )
        Text(
            text = "Hello this is nothing from nothing withing " +
                    "nothing and usually besides nothing and embedded in nothing",
            style = typography.h6,
            maxLines = 2,
            overflow = TextOverflow.Ellipsis,
            modifier = Modifier.constrainAs(title) {
                top.linkTo(headerImage.bottom)
                start.linkTo(parent.start)
                end.linkTo(like.start)
                width to Dimension.fillToConstraints
            }
        )
}

It looks like if you change

width to Dimension.fillToConstraints

to

width = Dimension.preferredWrapContent

it works just fine

I tried and didn't work.

width to Dimension.preferredWrapContent

use

=

instead of

to

I copied your code and it was working in my layout preview

It works, thank you so much.