載入圖片

從磁碟載入圖片

使用 Image 可組合元件，在螢幕上顯示圖像。如要從磁碟載入圖片 (例如 PNG、JPEG、WEBP) 或向量資源，請搭配您的參考圖片使用 painterResource API。您無需知道素材資源的類型，只要在 Image 或 paint 修飾符中使用 painterResource 即可。

DrawScope..

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

為確保您的應用程式可供存取，請為螢幕中的視覺元素提供 contentDescription。TalkBack 會讀出內容說明，因此請務必確保文字內容在朗讀及翻譯時仍然通順。在上述範例中，stringResource() 會用於載入 strings.xml 檔案的翻譯內容說明。如果螢幕中的視覺元素只是視覺裝飾，請將 contentDescription 設為 null，讓螢幕閱讀器忽略該元素。

如果您需要較低層級的 ImageBitmap 專屬功能，可以使用 ImageBitmap.imageResource() 載入點陣圖。如要進一步瞭解 ImageBitmap，請參閱 ImageBitmap 與 ImageVector 一節。

可繪項目支援

painterResource 目前支援下列可繪項目類型：

• AnimatedVectorDrawable
• BitmapDrawable (PNG、JPG、WEBP)
• ColorDrawable
• VectorDrawable

從網際網路載入圖片

從網際網路載入圖片時，有幾個第三方程式庫可協助您處理這項程序。圖片載入程式庫可為您處理大部分的繁瑣作業。這類程式庫可同時處理快取 (讓您無需多次下載圖片) 和網路邏輯，這樣就能下載圖片並顯示在螢幕上。

舉例來說，如要從 Instacart 使用 Coil 載入圖片，請將程式庫新增至 Gradle 檔案，然後使用 AsyncImage 從網址載入圖片：

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

為您推薦

• 注意：系統會在 JavaScript 關閉時顯示連結文字
• Compose 中的資源
• Compose 中的無障礙功能
• Compose 中的圖形