如何在 drawable 内绘制图像，其边界仅限于使用 compose 绘制的 drawable

Question

经过大量研究和尝试，我决定向您寻求帮助。

我有 2 个可绘制对象，我想将它们合并为一个。
在上的应该限制在后面的形状。
这是我想出的，但由于某种原因，顶部的透明部分不透明。
不要介意背景可绘制对象的奇怪偏移，这是我稍后会解决的问题。

稍后我希望能够传递图像并让它填充笔画以外的形状。但也许我可以在之后添加笔触？

代码如下：

@Composable
fun Avatar(backgroundDrawable: Int, avatarSize: Int = 80) {
    val imageBitmapDst =
        getBitmapFromImage(LocalContext.current, backgroundDrawable)
            .asImageBitmap()
    val imageBitmapSrc =
        getBitmapFromImage(LocalContext.current, R.drawable.default_avatar)
            .asImageBitmap()

    Canvas(modifier = Modifier.size(avatarSize.dp)) {
        val dimension = size.height.coerceAtMost(size.width) / 2f
        val xPos = (size.width - dimension) / 2f
        val yPos = (size.height - dimension) / 2f

        drawImage(
            image = imageBitmapDst,
        )

        drawImage(
            image = imageBitmapSrc,
            dstOffset = IntOffset(xPos.toInt(), yPos.toInt()),
            dstSize = IntSize(dimension.toInt(), dimension.toInt()),
            blendMode = BlendMode.SrcIn
        )
    }
}

我觉得我快到了，但我错过了什么。

提前感谢您的帮助！

Answer 1

您需要将 Canvas 的 alpha 设置为小于 1f 或使用图层才能应用 Blend 或 Porter Duff 模式。

 with(drawContext.canvas.nativeCanvas) {
        val checkPoint = saveLayer(null, null)

    // Destination
     drawImage(
            image = imageBitmapDst,
        )

      // Source
        drawImage(
            image = imageBitmapSrc,
            dstOffset = IntOffset(xPos.toInt(), yPos.toInt()),
            dstSize = IntSize(dimension.toInt(), dimension.toInt()),
            blendMode = BlendMode.SrcIn
        )
    restoreToCount(checkPoint)
}

您可以参考这些问题和答案

https://stackoverflow.com/a/69790654/5457853

如何剪辑或剪切可组合项？

https://stackoverflow.com/a/73996333/5457853