このページは Cloud Translation API によって翻訳されました。

画像を読み込んで表示する

コンテンツやユーザーアクションへのレスポンスとしてアプリに画像を表示するには、ディスクまたはインターネット上の外部ソースから画像を読み込みます。画像は次の方法で読み込むことができます。

ディスクから
Coil を使用したネットワークから
Glide を使用したネットワークから

バージョンの互換性

この実装では、プロジェクトの minSDK を API レベル 21 以上に設定する必要があります。

ディスクから画像を読み込む

ローカルに保存されている画像をディスクから読み込み、アプリのコンテンツとして表示したり、ユーザーの操作に応答したりできます。

依存関係

画像を読み込む

ローカルに保存されている画像をディスクから読み込んでアプリに表示するには、次のコードを使用します。

Image(
    painter = painterResource(id = R.drawable.dog),
    contentDescription = stringResource(id = R.string.dog_content_description)
)LoadingImagesSnippets.kt

コードに関する主なポイント

アプリのリソースから画像を読み込む painterResource() に painter 属性が設定された、定義済みの Compose Image オブジェクト。
TalkBack が読み取ることができる contentDescription。これにより、アプリのユーザー補助機能を強化できます。
strings.xml ファイルから翻訳されたコンテンツの説明を読み込む stringResource()。

ネットワーク経由で画像を読み込む

インターネット上に外部で保存されている画像は、Coil または Glide を使用して読み込むことができます。プロジェクトに使用するライブラリを選択するには、プロジェクトの要件やパフォーマンスの制約などの要素を考慮してください。

Coil を使用して画像を読み込む

サードパーティライブラリの Coil を使用して、インターネットから画像を読み込むことができます。Coil は Kotlin コルーチンを基盤としており、メインスレッドから画像を読み込む責任を負い、読み込みが完了すると表示します。Coil を使用してインターネットから画像を読み込むには、こちらのガイダンスに沿って操作してください。

依存関係

画像を読み込む

Coil を使用して画像を読み込むには、次のコードを使用します。

AsyncImage(
    model = "https://example.com/image.jpg",
    contentDescription = "Translated description of what the image contains"
)LoadingImagesSnippets.kt

Glide を使用して画像を読み込む

Glide を使用して、インターネット上の外部に保存されている画像を読み込み、アプリのフィードに表示できます。Glide は、滑らかなスクロールを重視した、Android 向けの高速かつ効率的な画像読み込みライブラリです。メインスレッドから画像の読み込みを担当し、読み込みが完了すると表示します。

依存関係

画像を読み込む

次のコードを使用して、Glide を使用して画像を読み込みます。

GlideImage(
    model = "https://example.com/image.jpg",
    contentDescription = "Translated description of what the image contains"
)LoadingImagesSnippets.kt

結果

このガイドを含むコレクション

このガイドは、Android 開発の幅広い目標を網羅する、厳選されたクイックガイドコレクションの一部です。

画像を表示する

明るく魅力的なビジュアルを使用して、Android アプリの外観を美しくする手法について学びます。

クイックガイドコレクション

ご質問やフィードバックがある場合

よくある質問のページでクイックガイドをご覧になるか、お問い合わせフォームからご意見をお寄せください。

よくある質問に移動フィードバックを送信する