如何使用 Jetpack Compose 在我的屏幕中使用 9 补丁可绘制 (.9.png)？

Question

我正在尝试在可组合图像中使用 .9.png 文件：

            Image(
            painter = painterResource(id = R.drawable.shadow_faq),
            contentDescription = "Faq card 1",
            modifier = Modifier
                .constrainAs(imgGeneral) {
                    top.linkTo(glImgGeneralTop)
                    bottom.linkTo(glImgBottom)
                    start.linkTo(glImgLeft)
                    end.linkTo(glImgRight)
                    height = Dimension.fillToConstraints
                    width = Dimension.fillToConstraints
                }
        )

但这样做时我遇到了一个渲染问题：java.lang.IllegalArgumentException: Only VectorDrawables and rasterized asset types are supported ex. PNG, JPG

如何将 .9.png 文件与 Jetpack Compose 结合使用？

Answer 1

有时，我们加载 9.png 作为视图的背景，就像聊天应用程序上的消息项一样。我们可以这样做：

首先我们将 9.png 作为可绘制对象加载：

 val bgImg = ContextCompat.getDrawable(
    LocalContext.current,
    if (isFromMe) R.drawable.chat_message_right else R.drawable.chat_message_left
)

其次我们可以使用 Modifier#drawBehind() 方法来设置背景：

Text(text = "This my message",
    modifier = Modifier
        .drawBehind {
            bgImg?.updateBounds(0, 0, size.width.toInt(), size.height.toInt())
            bgImg?.draw(drawContext.canvas.nativeCanvas)
        }
        .padding(8.dp)
)

最后，你就会得到你想要的效果。

Answer 2

更新：从1.0.0-rc02伴奏开始，0.14.0您可以使用线圈组合版本：

Image(
    rememberImagePainter(ContextCompat.getDrawable(context,R.drawable.xxx)),
    contentDescription = "Faq card 1",
)

以前已弃用的答案：
您可以使用DrawablePainter来自 Accompanist 的方法，它返回Painter绘制 Android 的Drawable.

Image(
    rememberDrawablePainter(drawable = ContextCompat.getDrawable(context,R.drawable.xxxx) ),
    contentDescription = "Faq card 1"
)