很多類型的APP中,都可以看到用到上面這種方式來展現訊息。
自定義Cell中圖片的問題
我們在開發的時候,會自定義一個Cell模板,設定好了基本的圖片、名稱、簡介等等,
比如這樣的一個Cell:
但是設置圖片的時候,我們常常只是定義了他的基本屬性,比如大小和邊框。
1 2 3 4 5 |
_productImageView = [[UIImageView alloc]init]; _productImageView.frame = CGRectMake(10, 10, imageViewWidth, imageViewHeight); _productImageView.layer.borderWidth = 1; _productImageView.layer.borderColor = [[UIColor colorWithWhite:0.697 alpha:1.000]CGColor]; [_baseView addSubview:_productImageView]; |
這樣的顯示效果是:
而UIImageView有個屬性叫做contentMode,其中有兩個值:
1 2 3 4 5 |
// contents scaled to fit with fixed aspect. remainder is transparent UIViewContentModeScaleAspectFit, // contents scaled to fill with fixed aspect. some portion of content may be clipped. UIViewContentModeScaleAspectFill, |
設置UIViewContentModeScaleAspectFit的效果:
1 |
_productImageView.contentMode = UIViewContentModeScaleAspectFit; |
這樣按照長寬比例的顯示了完整的圖片。
設置UIViewContentModeScaleAspectFill的效果:
1 |
_productImageView.contentMode = UIViewContentModeScaleAspectFill |
按照原來長寬的比例填充了我的UIImageView,但是整個就超出範圍了,所以需要砍掉多餘的部分。
設置了UIViewContentModeScaleAspectFill以及ClipsToBounds的效果:
1 2 |
_productImageView.contentMode = UIViewContentModeScaleAspectFill; _productImageView.clipsToBounds = true; |
可以根據自己的需求去展現圖片,比如再詳細介面中,就可以用按照原本長寬比例,完整的顯示出商品。
左邊為fit,右邊為fill