A modern programming language that makes developers happier.

kotlinlang

I am facing an issue where I have a `Row` with 2 columns in it, and I want the smaller height column to match the height of the other column
I achieved it by applying `height(IntrinsizSize.Min)` to Row and `fillMaxHeight()` to the smaller column

This works fine, but it breaks when I have a composable which uses `heightIn(max = ...)`
It works fine when i use a fixed height `height(...)` but breaks if I use maxHeight instead

More in thread :thread:

Screenshot_20240516_172326.jpg

1715860780625.jpeg

but as soon as i make the gray box have maxHeight instead it looks like this

Code -
```Surface(modifier = Modifier.fillMaxWidth(), border = BorderStroke(1.dp, Color.Black)) {
    Row(
        modifier = Modifier.fillMaxWidth()
            .padding(16.dp)
            .height(IntrinsicSize.Min)
    ) {
        Column(modifier = Modifier.fillMaxHeight()){
            Box(modifier = Modifier.size(40.dp).background(Color.Red))
            Box(modifier = Modifier.width(40.dp).weight(1f).background(Color.Green))
            Box(modifier = Modifier.size(40.dp).background(Color.Red))
        }
        Column(modifier = Modifier.weight(1f)){
            Box(modifier = Modifier.fillMaxWidth().height(32.dp).background(Color.Blue))
            Box(modifier = Modifier.fillMaxWidth().height(64.dp).background(Color.Yellow))
            Box(modifier = Modifier.fillMaxWidth().heightIn(max = 240.dp).background(Color.DarkGray))
            Box(modifier = Modifier.fillMaxWidth().height(44.dp).background(Color.Blue))
        }
    }
}```

In my actual code, the Grey Box is a Coil `Async Image`

Screenshot 2024-05-16 at 5.11.59 PM.png

When I change it to maxHeight the composable below it disappears

What height do you want the gray box to have? To me, it makes sense that if you don't specify a minimum height, it's going to be 0. Before you specify anything with the height, it's being determined by coil. If you put the `AsyncImage` in a `Box` with a constrained height, does it do something similar to what you want?

This is my image composable, its already wrapped in a Surface
```@Composable
private fun PostImage(
    url: String,
    modifier: Modifier = Modifier,
    onImageClick: () -&gt; Unit
) {
    Surface(
        onClick = onImageClick,
        modifier = modifier,
    ) {
        MedialImage(
            url = url,
            modifier = Modifier.fillMaxWidth(),
            contentScale = ContentScale.Crop,
            contentDescription = "Post Image",
        )
    }

}```
And i call it like this inside the Column
```PostImageItem(
    image = media.data,
    modifier = modifier.height(240.dp).clip(RoundedCornerShape(4.dp)),
    onImageClick = { onAction(PostAction.ImageClick(post, it)) }
)```
As soon as i change the `height()` to `heightIn(max = ...)` the ui becomes like the screenshot i shared above
With fixed height the image height is correct and the composable below it is also displayed

Yeah, I'm realizing now that was a bad suggestion. You could use the size of the image to set the size and use whatever bounds you like there.