android - Jetpack Compose 将 PorterDuffMode 应用于图像

Question

基于此页面中的图像和 PorterDuffModes

我下载了图像，最初即使它们是png，它们也有不透明的浅灰色和深灰色矩形并将它们删除。

并使用此示例代码进行检查，将可绘制对象替换为原始代码中的可绘制对象，并得到结果

看起来它可以与 Android View 一起使用，但是当我使用 Jetpack Canvas 作为

androidx.compose.foundation.Canvas(modifier = Modifier.size(500.dp),
    onDraw = {

        drawImage(imageBitmapDst)
        drawImage(imageBitmapSrc, blendMode = BlendMode.SrcIn)

    })

BlendMode.SrcIn 在黑色矩形上绘制蓝色矩形，其他模式也不会返回正确的结果。BlendMode.SrcOut 返回黑屏。

并使用 2 个相互堆叠的图像Box

val imageBitmapSrc: ImageBitmap = imageResource(id = R.drawable.c_src)
val imageBitmapDst: ImageBitmap = imageResource(id = R.drawable.c_dst)

Box {
    Image(bitmap = imageBitmapSrc)
    Image(
        bitmap = imageBitmapDst,
        colorFilter = ColorFilter(color = Color.Unspecified, blendMode = BlendMode.SrcOut)
    )
}

只有蓝色的 src 矩形是可见的。

也试过了Painter，也不能让它工作

val imageBitmapSrc: ImageBitmap = imageResource(id = R.drawable.c_src)
val imageBitmapDst: ImageBitmap = imageResource(id = R.drawable.c_dst)

val blendPainter = remember {
    object : Painter() {

        override val intrinsicSize: Size
            get() = Size(imageBitmapSrc.width.toFloat(), imageBitmapSrc.height.toFloat())

        override fun DrawScope.onDraw() {
            drawImage(imageBitmapDst, blendMode = BlendMode.SrcOut)
            drawImage(imageBitmapSrc)
        }
    }
}

Image(blendPainter)

Jetpack Compose应该如何使用Blend或模式？PorterDuff

标签： androidcanvasandroid-jetpack-composeporter-duff

Answer 1

整整一周我都因类似的问题而感到沮丧，但是您的问题帮助我找到了解决方案如何使其发挥作用。

编辑：

我正在使用撰写1.0.0

就我而言，我使用的是双缓冲之类的东西，而不是直接在画布上绘图 - 只是作为一种解决方法。

Canvas(modifier = Modifier.fillMaxWidth().fillMaxHeight()) {

    // First I create bitmap with real canva size
    val bitmap = ImageBitmap(size.width.toInt(), size.height.toInt())

    // here I'm creating canvas of my bitmap
    Canvas(bitmap).apply {
       // here I'm driving on canvas
    }
   
    // here I'm drawing my buffered image
    drawImage(bitmap)
}

在里面Canvas(bitmap)我正在使用drawPath,drawText等与油漆：

val colorPaint = Paint().apply {
    color = Color.Red
    blendMode = BlendMode.SrcAtop
}

并且以这种方式BlendMode正常工作 - 我尝试了许多模式并且一切都按预期工作。

我不知道为什么这不能直接在可组合的画布上工作，但我的解决方法对我来说很好。