Jetpack Compose：ListItem 中的中心图标或尾随元素

Question

我正在尝试使用 ListItem 将图标和尾随元素垂直居中。我不确定是否可行，或者我需要删除 ListItem 并改为使用 column/row 的组合。

我正在使用类似的东西：

ListItem(
    Modifier.clickable(onClick = onClick),
    icon = {
        Box(
           modifier = Modifier.fillMaxHeight(), contentAlignment = ALignment.Center
        ) {
            Text(
                text = dateUtil.formatTime(item.startTime),
                style = TextStyle(
                    color = SnyDarkBlue,
                    fontSize = 14.sp,
                    fontFamily = oswaldFamily,
                    fontWeight = FontWeight.Bold,
                    letterSpacing = (-0.25).sp,
                ),
            )
        }
    },

提前致谢！

Answer 1

您可以使用列将图标和文本部分居中：

ListItem(
    modifier = Modifier
        .fillMaxWidth()
        .requiredHeight(50.dp)
        .background(color = Color.Gray),
    icon = {
        Column(
            modifier = Modifier
                .fillMaxHeight(), verticalArrangement = Arrangement.Center
        ) {
            Text(
                text = "06:00 PM"
            )
        }
    },
    text = {
        Column(
            modifier = Modifier
                .fillMaxHeight(), verticalArrangement = Arrangement.Center
        ) {
            Text("Your item text goes here")
        }
    },
)