web-dev-qa-db-ja.com

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
                )
            }
        }
    }
}
5
Maddy
@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)
                }
            }
        }
    }
}
1
Jeffy Lazar

ただ使用する:

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

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

}

0
Mihaela Romanca

画像をロードするためのjetpack composeライブラリの 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))
            }
        }
    }
}

それでも、これがドローアブルから画像をロードする正しい方法であるかどうかはわかりません。

0
Maddy

GoogleがAPIを更新しました。 _0.1.0-dev03_の場合、イメージのロードは同期的であり、この方法で行われます

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

画像を描くには

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

現在、上記のコードは、正確な高さまたは幅を指定することに依存しています。たとえば、100 dpの高さとExpandedの代わりに_wrap_content_が必要な場合は、画像のスケーリングがサポートされていないようです。この問題を解決する方法を知っている人はいますか?また、古い方法_scaleType=fitCenter_のように画像をコンテナ内に収めることもできますか?

0