正確的顯示圖片 UIViewContentModeScaleAspectFill/fit

tableView

很多類型的APP中,都可以看到用到上面這種方式來展現訊息。

自定義Cell中圖片的問題

我們在開發的時候,會自定義一個Cell模板,設定好了基本的圖片、名稱、簡介等等,

比如這樣的一個Cell:

自定義Cell

但是設置圖片的時候,我們常常只是定義了他的基本屬性,比如大小和邊框。

這樣的顯示效果是:

without-setting


而UIImageView有個屬性叫做contentMode,其中有兩個值:


 設置UIViewContentModeScaleAspectFit的效果:

UIViewContentModeScaleAspectFit

這樣按照長寬比例的顯示了完整的圖片。


設置UIViewContentModeScaleAspectFill的效果:

withoutCut

按照原來長寬的比例填充了我的UIImageView,但是整個就超出範圍了,所以需要砍掉多餘的部分。


設置了UIViewContentModeScaleAspectFill以及ClipsToBounds的效果:

withCut


可以根據自己的需求去展現圖片,比如再詳細介面中,就可以用按照原本長寬比例,完整的顯示出商品。

左邊為fit,右邊為fill

UIViewContentModeScaleAspectFit UIViewContentModeScaleAspectFill

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *