请教个 Jetpack Compose 的布局问题

我想做一个类似物流的一个页面类似下图，但是左边那条绿线无法显示出来。（代码和图片在后面）

Row(modifier = Modifier.height(IntrinsicSize.Min)) 并且把图片 grid 注释掉，那么绿线是正常显示的
Row(modifier = Modifier.fillMaxHeight)并且设置 grid 的 height ，也无法显示

@Composable
fun ListDemo() {
    var titles = listOf("1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2","1","2")
    LazyColumn(modifier = Modifier
        .fillMaxSize()) {
        itemsIndexed(titles) { index, item ->
            Surface(modifier = Modifier
                .fillMaxWidth()) {
                Column(modifier = Modifier
                    .padding(horizontal = 18.dp)) {
                    Row(modifier = Modifier
                        .padding(vertical = 8.dp),
                        verticalAlignment = Alignment.CenterVertically) {
                        Box(modifier = Modifier
                            .size(24.dp)
                            .background(Color.Red))
                    }

                    Row(modifier = Modifier
                        .fillMaxWidth()) {
                        Box(modifier = Modifier
                            .width(24.dp)
                            .fillMaxHeight(IntrinsicSize.Min),
                            contentAlignment = Alignment.Center){
                            // TODO show this green line
                            Box(modifier = Modifier
                                .fillMaxHeight()
                                .width(1.dp)
                                .background(Color.Green))
                        }
                        Spacer(Modifier.width(8.dp))
                        Column(modifier = Modifier
                            .fillMaxWidth(),
                            verticalArrangement = Arrangement.spacedBy(8.dp)) {
                            Row(modifier = Modifier
                                .fillMaxWidth()) {
                                Text(
                                    text = "Time：",
                                    fontSize = 14.sp,
                                    color = Color.Gray,
                                    modifier = Modifier
                                        .width(100.dp)
                                )
                                Spacer(Modifier.width(4.dp))
                                Text(
                                    text = "2023-03-02 18:34:07",
                                    fontSize = 14.sp,
                                    color = Color.Gray
                                )
                            }

                            val images = listOf("1","2","3","4")
                            LazyVerticalGrid(
                                columns = GridCells.Fixed(3),
                                horizontalArrangement = Arrangement.spacedBy(6.dp),
                                verticalArrangement = Arrangement.spacedBy(6.dp),
                                modifier = Modifier.heightIn(
                                    max = 1000.dp)
                            ) {
                                items(images) { pic ->
                                    Box(
                                        modifier = Modifier
                                            .aspectRatio(1f)
                                            .background(Color.Gray)
                                    ) {
                                        Text(
                                            text = pic
                                        )
                                    }
                                }
                            }

                        }
                    }

                    Spacer(Modifier.height(8.dp))
                }


            }
        }
    }
}

@Preview
@Composable
fun ListDemoPreview() {
    ListDemo()
}

magic3584

186 天前

@qwell #3
不行，还是会报错
```shell
java. lang. IllegalStateException: Asking for intrinsic measurements of SubcomposeLayout layouts is not supported. This includes components that are built on top of SubcomposeLayout, such as lazy lists, BoxWithConstraints, TabRow, etc. To mitigate this: - if intrinsic measurements are used to achieve 'match parent' sizing, consider replacing the parent of the component with a custom layout which controls the order in which children are measured, making intrinsic measurement not needed - adding a size modifier to the component, in order to fast return the queried intrinsic measurement.
```

od66666666

186 天前

遇 size 不决，直接 onGloballyPositioned

Row(modifier = Modifier.fillMaxWidth()) {
val density = LocalDensity.current
var columnHeight by remember { mutableStateOf(0.dp) }
Box(
modifier = Modifier
.height(columnHeight)
.width(24.dp),
contentAlignment = Alignment.Center
) {
...
}
Spacer(Modifier.width(8.dp))
Column(modifier = Modifier
.onGloballyPositioned { layoutCoordinates ->
columnHeight =
with(density) { layoutCoordinates.size.height.toDp() }
}
.fillMaxWidth(),
verticalArrangement = Arrangement.spacedBy(8.dp)) {
...
}
}