載入並顯示圖片

如要在應用程式中顯示圖片，以便顯示內容和回應使用者動作，請從磁碟或網路上的外部來源載入圖片。您可以透過下列方式載入圖片：

• 從磁碟
• 透過使用 Coil 的網路
• 透過使用 Glide 的網路

版本相容性

這個實作方式需要將專案 minSDK 設為 API 級別 21 以上。

從磁碟載入圖片

您可以從磁碟載入本機儲存的圖片，在應用程式中顯示圖片內容，並回應使用者操作。

依附元件

載入圖片

使用下列程式碼，從磁碟載入本機儲存的圖片，並在應用程式中顯示：

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

程式碼的重點

• 已定義的 Compose Image 物件，其 painter 屬性設為 painterResource()，可從應用程式資源載入圖片。
• TalkBack 可讀取的 contentDescription，可讓您的應用程式更易於存取。
• stringResource() 用於從 strings.xml 檔案載入翻譯內容說明。

透過網路載入圖片

您可以使用 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 應用程式打造美觀的視覺效果。

Quick Guide 集合

有問題或意見回饋嗎？

請前往常見問題頁面，瞭解快速指南或與我們聯絡，分享您的想法。

前往常見問題 提供意見回饋