如何加载图像从可绘制的 Jetpack 组成？

我已经尝试下面的代码，但它没有反映在用户界面，我在这里遗漏了什么？

class MainActivity : AppCompatActivity() {


override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
loadUi()
}
}


@Composable
fun loadUi() {
CraneWrapper {
MaterialTheme {
Image(
(ResourcesCompat.getDrawable(
resources,
R.mipmap.ic_launcher,
null
) as BitmapDrawable).bitmap
)
}
}
}
}
73274 次浏览
小开

我发现 SimpleImage类从 jetpack 组合库加载图像，但这是一个临时的解决方案，我还没有找到任何样式选项与这一点。

// TODO(Andrey) Temporary. Should be replaced with our proper Image component when it available
@Composable
fun SimpleImage(
image: Image
) {
// TODO b132071873: WithDensity should be able to use the DSL syntax
WithDensity(block = {
Container(width = image.width.toDp(), height = image.height.toDp()) {
Draw { canvas, _ ->
canvas.drawImage(image, Offset.zero, Paint())
}
}
})
}

我已经这样使用它了

class MainActivity : AppCompatActivity() {


override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
loadUi()
}
}


@Composable
fun loadUi() {
CraneWrapper {
MaterialTheme {
val bitmap = (ResourcesCompat.getDrawable(
resources,
R.mipmap.ic_launcher,
null
) as BitmapDrawable).bitmap
SimpleImage(Image(bitmap))
}
}
}
}

尽管如此，我还是不确定这是从可绘制文件中加载图像的正确方法。

小开

我发现 AndroidImage.kt 中有一个函数 Image FromResource ():

fun imageFromResource(res: Resources, resId: Int): Image {
return AndroidImage(BitmapFactory.decodeResource(res, resId))
}

所以你的代码应该是:

class MainActivity : AppCompatActivity() {


override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
loadUi()
}
}


@Composable
fun loadUi() {
CraneWrapper {
MaterialTheme {
val image = imageFromResource(resources, R.mipmap.ic_launcher)
SimpleImage(image)
}
}
}

}

小开 
@Composable
fun loadUi() {
val image = +imageResource(R.drawable.header)
CraneWrapper {
MaterialTheme {
Container(expanded = true,height = 180.dp) {
//Use the Clip() function to round the corners of the image
Clip(shape = RoundedCornerShape(8.dp)) {
//call DrawImage() to add the graphic to the app
DrawImage(image)
}
}
}
}
}
小开
最佳答案

你可以使用 强 > painterResource强函数:

 Image(painterResource(R.drawable.ic_xxxx),"content description")

具有给定 id 的资源必须指向完全栅格化的 影像(例如。PNG 或 JPG 文件)或 VectorDrawable xml 资产。
这意味着该方法可以分别为基于 ImageBitmap的资产或基于向量的资产加载 BitmapPainter或 VectorPainter的实例。

例如:

Card(
modifier = Modifier.size(48.dp).tag("circle"),
shape = CircleShape,
elevation = 2.dp
) {
Image(
painterResource(R.drawable.ic_xxxx),
contentDescription = "",
contentScale = ContentScale.Crop,
modifier = Modifier.fillMaxSize()
)
}

enter image description here

小开

谷歌更新了他们的 API。对于 0.1.0-dev03加载图像是同步的，是这样做的

val icon = +imageResource(R.drawable.ic_xxx)

画画

Container(modifier = Height(100.dp) wraps Expanded) {
DrawImage(icon)
}

目前，上面的代码依赖于您指定精确的高度或宽度。似乎缩放的图像是不支持的，如果你想例如100 dp 的高度和 wrap_content而不是 Expanded扩展全宽。 有人知道怎么解决这个问题吗？也有可能适合的形象内，它的容器喜欢旧的方式 scaleType=fitCenter？

小开

在 0.1.0-dev14工作

可以通过以下方式实现在 Image 中加载可绘制内容:

Image(
imageResource(id = R.drawable.scene_01),
modifier = Modifier.preferredHeightIn(160.dp, 260.dp)
.fillMaxWidth(),
contentScale = ContentScale.Crop
)

现在，我试图上传在圆形图像，听起来很棘手，但太容易在 喷气发动机组合绘图。你可以这样做:

Image(
asset = imageResource(id = R.drawable.scene_01),
modifier = Modifier.drawBackground(
color = Color.Black,
style = Stroke(4f),
shape = CircleShape
).preferredSize(120.dp)
.gravity(Alignment.CenterHorizontally)
.clip(CircleShape),
contentScale = ContentScale.FillHeight
)

产出:

enter image description here

小开

从 1.0.0-beta01版本开始:

Image(
painter = painterResource(R.drawable.your_drawable),
contentDescription = "Content description for visually impaired"
)
小开

与版本 1.0.0-beta01

就像下面

Image(
painter = painterResource(R.drawable.header),
contentDescription = null,
)
小开

Version = 1.0.0-beta01，使用 painterResource，imageResource已被删除。

例子

Image(
painterResource(R.drawable.ic_vector_or_png),
contentDescription = null,
modifier = Modifier.requiredSize(50.dp)
)

机器人开发者文档

小开

由于 imageResource不再可用，使用 painterResource的解决方案确实是正确的，例如。

Image(painter = painterResource(R.drawable.ic_heart), contentDescription = "content description")

但实际上，如果需要的话，你仍然可以使用 Bitmap 来代替绘图:

Image(bitmap = bitmap.asImageBitmap())

.asImageBitmap()是 Bitmap 上的一个扩展，它提供并从给定的 Bitmap 创建一个 ImageBitmap。

小开

尝试这一个，但如果你复制代码，然后粘贴它，我不知道为什么，但它不会工作，所以只要键入它，因为它是，并替换图像 ID

Image(
painter = painterResource(id = R.drawable.tanjim),
contentDescription = null,
)

提交答案