如何在 android compose 中将具有渐变边缘的透明圆圈绘制到阴影覆盖层中

例如，如果在入职流程中，你想让屏幕的其余部分变暗，然后在屏幕的某个部分画一个光圈来突出显示聚光灯之类的东西，你会怎么做？圆需要有渐变边.它还需要至少与Jetpack Compose兼容.

这是我的try .

1. 绘制部分透明的黑色覆盖.
2. 使用混合模式绘制一个不带渐变边的圆以穿透叠加.清除
3. 绘制带有渐变边缘的透明圆，使其恢复到与背景相同的 colored颜色 .

// Background content, in my real use case this would be something else
        Image(
            modifier = Modifier.matchParentSize(),
            painter = painterResource(id = R.drawable.hqdefault), contentDescription = "")

        val overlayShadeColor = Color.Black.copy(alpha = 0.8f)
        val gradient = Brush.radialGradient(
            .2f to Color.Transparent,
            .5f to overlayShadeColor)
        val radius = 120.dp

        Canvas(modifier = Modifier.fillMaxSize().graphicsLayer {
            alpha = .99f
        }) {

            // Dark overlay
            drawRect(overlayShadeColor)

            // Circle to punch through the overlay
            drawCircle(
                color = Color.White,
                radius = radius.toPx(),
                blendMode = BlendMode.Clear
            )

            // Circle that adds back a gradient edge
            drawCircle(
                gradient,
                radius = radius.toPx(),
            )
        }

It looks like this:

我的try 的缺陷是在圆圈与背景相遇的边缘上留下了一条非常小的线(可能是1个硬件像素宽).也许画布不是正确的方法，有一种更容易的方法来做到这一点.我对建议持开放态度.