如何让Jetpack Compose中CardHome组件保持统一宽高？

要让所有CardHome组件保持相同的宽高，你可以通过以下调整实现：

1. 固定卡片尺寸并规范内部布局 #

给Card添加固定高度约束，同时让内部布局自适应卡片空间，避免内容撑大卡片：

@Composable
fun CardHome(clickable:()->Unit,text:String,image: Any?)
{
    Card(
        modifier = Modifier
            .fillMaxWidth() // 宽度占满父布局
            .height(280.dp) // 固定高度，按需调整数值
            .padding(15.dp)
            .clickable { clickable() },
        elevation = 10.dp
    ) {
        Column(
            modifier = Modifier
                .padding(10.dp)
                .fillMaxSize(), // 让Column占满Card的全部空间
            verticalArrangement = Arrangement.Center
        ) {
            AsyncImage(
                model = image,
                contentDescription = "${UUID.randomUUID()}",
                alignment = Alignment.Center,
                contentScale = ContentScale.Inside,
                modifier = Modifier
                    .weight(1f) // 让图片占据Column的剩余空间，保证高度统一
                    .fillMaxWidth()
            )
            Text(
                text = text,
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(5.dp),
                style= TextStyle(color = Azul2, fontWeight = FontWeight.Bold, fontSize = 15.sp),
                textAlign = TextAlign.Center
            )
        }
    }
}

2. 用宽高比替代固定高度（可选） #

如果需要卡片保持固定宽高比例而非固定高度，可以用aspectRatio()替代height()：

// 在Card的Modifier中替换height为aspectRatio
modifier = Modifier
    .fillMaxWidth()
    .aspectRatio(4f/3f) // 比如4:3的宽高比
    .padding(15.dp)
    .clickable { clickable() },

关键调整说明 #

• 给Card设置固定高度或宽高比，从根节点限制尺寸
• 内部Column用fillMaxSize()占满卡片，配合weight(1f)让图片自适应剩余空间，避免不同内容导致高度差异
• 确保图片不会因自身原始尺寸撑大布局，通过contentScale和weight控制显示区域

内容的提问来源于stack exchange，提问作者Richard Víquez Pérez