iT邦幫忙

2024 iThome 鐵人賽
DAY 8
0
Mobile Development

從零開始學習 Jetpack Compose系列 第 8 篇

從零開始學習 Jetpack Compose Day7 - Image

16th鐵人賽
121 瀏覽

  • 分享至 

  • xImage
    •  

Image

在畫面上顯示圖片的元件，但需要先把要顯示的圖檔放在專案資料夾的resources裡面，如果要使用網路圖片就必須使用第三方套件，如：Glide、Coil。

Painter：設定圖片

透過painterResource來設定顯示的圖片
https://raw.githubusercontent.com/jian-fu-hung/ithelp-2024/refs/heads/main/Images/Day7/%E6%88%AA%E5%9C%96%202024-09-22%20%E6%99%9A%E4%B8%8A9.28.44.png

ContentScale：圖片縮放

ContentScale.Fit：等比例縮放

ContentScale.Crop：裁減滿版

ContentScale.Inside：等比例縮放，如果圖片本身就小於外框則處理縮放。

ContentScale.FillBounds：垂直和水平非均勻縮放內容

ContentScale.None：不做縮放，如果圖片大於外框則裁切
https://raw.githubusercontent.com/jian-fu-hung/ithelp-2024/refs/heads/main/Images/Day7/%E6%88%AA%E5%9C%96%202024-09-22%20%E6%99%9A%E4%B8%8A9.30.26.png

Alpha：圖片透明度

https://raw.githubusercontent.com/jian-fu-hung/ithelp-2024/refs/heads/main/Images/Day7/%E6%88%AA%E5%9C%96%202024-09-22%20%E6%99%9A%E4%B8%8A9.30.49.png


上一篇
從零開始學習 Jetpack Compose Day6 - Button
下一篇
從零開始學習 Jetpack Compose Day8 - Column、Row與Box
系列文
從零開始學習 Jetpack Compose 共 30 篇
  1. 26
    從零開始學習 Jetpack Compose Day25 - 專案實作（3）主畫面 ViewModel 建立
  2. 27
    從零開始學習 Jetpack Compose Day26 - 詳細頁ViewModel建立
  3. 28
    從零開始學習 Jetpack Compose Day27 - 專案實作（5）Room建立
  4. 29
    從零開始學習 Jetpack Compose Day28 - Compose UI Test
  5. 30
    從零開始學習 Jetpack Compose Day29 - 參賽感想
完整目錄
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言
iThome鐵人賽
參賽組數
1064 組
團體組數
40 組
累計文章數
22195 篇
完賽人數
600 人
iT+看影片追技術 看影片追技術 看更多
熱門tag 看更多
15th鐵人賽 16th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽 鐵人賽 2019鐵人賽 javascript 2018鐵人賽 python 2017鐵人賽 windows php c# windows server linux css react vue.js
熱門問題
熱門回答
熱門文章
IT邦幫忙