Jetpack Compose中如何移除图标添加背景后出现的默认边框？

可能的原因及解决方案： #

1. 调整Modifier顺序
   你当前把size放在Modifier链的最后，会导致背景、边框先基于图标的原始尺寸绘制，再缩放到目标大小，容易出现边缘错位。把size移到最前面，让后续的背景、边框都基于目标尺寸渲染：

Icon(
    painter = painterResource(id = R.drawable.ic_check_circle_outline),
    contentDescription = "checkIcon",
    tint = DarkGreen,
    modifier = Modifier
        .size((Utils.convertPixelsToDp((width/4).toFloat(),context = context).dp))
        .background(Color.White, CircleShape)
        .clip(CircleShape)
        .border(BorderStroke(4.dp, DarkGreen), CircleShape)
        .align(Alignment.Center)
)

2. 用外层Box分离图标与背景边框
   将背景和边框逻辑移到外层Box，让Icon完全填充Box空间，避免图标自身边缘与背景边框冲突：

Box(
    modifier = Modifier
        .size((Utils.convertPixelsToDp((width/4).toFloat(),context = context).dp))
        .background(Color.White, CircleShape)
        .border(BorderStroke(4.dp, DarkGreen), CircleShape)
        .align(Alignment.CenterHorizontally),
    contentAlignment = Alignment.Center
) {
    Icon(
        painter = painterResource(id = R.drawable.ic_check_circle_outline),
        contentDescription = "checkIcon",
        tint = DarkGreen,
        modifier = Modifier.fillMaxSize(0.8f) // 让图标与边框留安全距离，彻底避免边缘重叠
    )
}

3. 检查图标资源本身
   如果前两种方法无效，大概率是图标文件ic_check_circle_outline本身带有透明白色边缘（比如导出时的抗锯齿残留）。用图片编辑工具打开图标，清理边缘多余的白色像素后重新导出。

4. 开启抗锯齿优化
   给Modifier添加graphicsLayer开启抗锯齿，缓解渲染时的细微边缘问题：

modifier = Modifier
    // ...其他Modifier
    .graphicsLayer(antiAlias = true)

内容的提问来源于stack exchange，提问作者Manuel Lucas