Jetpack ComposeでURLから画像を取得する

利用するライブラリ

Remote Image for Jetpack Compose

URLを指定するだけでネットワークから簡単に画像を持ってくることができるJetpack Composeで利用できるライブラリです。

導入

プロジェクトレベルのbuild.gradle

build.gradle

allprojects {
    repositories {
        ...
        maven { url 'https://dl.bintray.com/agarasul/RemoteImage' }
        ...
    }
}

アプリレベルのbuild.gradle

build.gradle

dependencies {
    ...
    implementation 'dev.rasul:remoteimage:1.0.4'
    ...
}

使い方

RemoteImage(
    url = newsItem.urlToImage,
    contentScale = ContentScale.Crop,
    modifier = Modifier.height(200.dp),
    error = {
        Text(text = "Could not load image")
    },
    loading = {
        CircularProgressIndicator(
            strokeWidth = 2.dp,
            modifier = Modifier.size(16.dp)
        )
    }
)

url：取得したい画像のURL
contentScale：画像のスケールタイプ（ImageViewのscaleTypeと同じ）
modifier：高さや幅など、他のmodifierと同様
error：エラー発生時に表示されるView、デフォルトではText
loading：画像のロード中に表示されるView、デフォルトではCircularProgressIndicator

参考リンク

https://github.com/agarasul/RemoteImage