如何从Jetpack中的drawable加载图像?

时间:2019-06-26 07:38:02

标签: android image androidx android-jetpack-compose

我尝试了下面的代码,但是它在UI中什么都没有反映,我在这里什么都没丢失?

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
                )
            }
        }
    }
}

10 个答案:

答案 0 :(得分:19)

从版本 1.0.0-beta01 开始:

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

答案 1 :(得分:6)

0.1.0-dev14

工作

可以通过以下方式在Image中加载drawable:

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

现在,我正在尝试在Circle Image中上传听起来很棘手但在 JetPack Compose 中太容易了的drawable。您可以通过以下方式实现:

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

答案 2 :(得分:1)

我发现AndroidImage.kt中有一个函数 imageFromResource()

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)
        }
    }
}

}

答案 3 :(得分:1)

使用版本 1.0.0-beta01

就像下面

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

答案 4 :(得分:1)

version=1.0.0-beta01,use painterResource,imageResource 已删除。

示例

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

android developer doc

答案 5 :(得分:1)

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

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

但如果需要,您实际上仍然可以使用 Bitmap 而不是 drawable:

Image(bitmap = bitmap.asImageBitmap())

.asImageBitmap() 是 compose 提供的位图扩展,它从给定的位图创建一个 ImageBitmap。

答案 6 :(得分:0)

我从jetpack编写库中找到了SimpleImage类来加载图像,但这是一个临时解决方案,我还没有找到任何样式选项。

// 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))
            }
        }
    }
}

不过,我不确定这是从可绘制对象加载图像的正确方法。

答案 7 :(得分:0)

@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)
                }
            }
        }
    }
}

答案 8 :(得分:0)

只需使用:

val icon = imageFromResource(resources, R.drawable.ic_xxx)

答案 9 :(得分:0)

Google更新了其API。对于 gvkey ipo_date 1 1004 1965 2 1005 1950 ... ,图像加载是同步的,并且是通过这种方式完成的

0.1.0-dev03

绘制图像

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

当前,以上代码依赖于您指定确切的高度或宽度。如果您想要例如100 dp高度和Container(modifier = Height(100.dp) wraps Expanded) { DrawImage(icon) } 而不是wrap_content来扩展整个宽度,则似乎不支持缩放图像。 有谁知道如何解决这个问题?是否可以像旧方法Expanded一样将图像放入容器中?