Jetpack Compose设置Card elevation时内部出现隐形矩形问题求助
Jetpack Compose卡片设置elevation后出现内部隐形矩形问题
我正在使用Jetpack Compose开发Android应用,UI中包含自定义卡片组件HomeScreenCards。当为Card设置如下elevation属性时:
elevation = CardDefaults.cardElevation(4.dp)
卡片内部会出现一个隐形矩形,注释掉该elevation代码行后,问题消失。不设置elevation时,所有内容渲染正常。
组件代码
@Composable fun HomeScreenCards( cardDetials:HomeScreenDatas, onClicked: (HomeScreenDatas)-> Unit, modifier: Modifier ){ Card( //elevation = CardDefaults.cardElevation(4.dp), shape = RoundedCornerShape(60f), colors = CardDefaults.cardColors( containerColor = Color.White.copy(alpha = 0.5f) ), modifier = Modifier .padding(16.dp) .size(width = 400.dp, height = 130.dp) .clickable { onClicked(cardDetials) } ) { Row( modifier = Modifier .fillMaxWidth() .padding(16.dp), verticalAlignment = Alignment.CenterVertically, horizontalArrangement = Arrangement.SpaceBetween ) { Text( text = cardDetials.name, color = Color.Black, fontWeight = FontWeight.Bold, modifier = Modifier .padding(start = 20.dp) ) Image( painter = painterResource(cardDetials.ImageId), contentDescription = "Card Image", modifier = Modifier .padding(8.dp) .size(width = 150.dp, height = 100.dp) .clip(RoundedCornerShape(9f)), contentScale = ContentScale.FillBounds ) } } }
效果对比
- 设置elevation时:卡片内部出现与containerColor同色的隐形矩形,破坏原有UI展示
- 未设置elevation时:卡片UI正常渲染,无多余矩形
已尝试的解决方法
- 移除elevation属性,问题消失
- 修改shape和padding参数,无任何改善
- 更换containerColor,内部矩形颜色同步变化
- 咨询ChatGPT、DeepSeek等AI工具,未解决问题
内容的提问来源于stack exchange,提问作者gold-roger33
相关产品推荐
相关产品推荐

