美文网首页ios
UIViewContentMode 图片显示模式

UIViewContentMode 图片显示模式

作者: 秋月夜 | 来源:发表于2016-03-21 12:52 被阅读1228次

UIViewContentMode

// 但凡在设置图片模式的枚举中包含Scale这个单词的值,都会对原有的图片进行缩放
typedef NS_ENUM(NSInteger, UIViewContentMode) {

// 默认属性,按照"UIImageView"的宽高比缩放图片至图片填充整个UIImageView
    UIViewContentModeScaleToFill,

// 按照"图片的宽高"比例缩放图片至图片的宽度或者高度和UIImageView一样,并且让整个图片都在UIImageView中,然后居中显示
    UIViewContentModeScaleAspectFit,      // contents scaled to fit with fixed aspect. remainder is transparent

// 按照"图片的宽高"比例缩放图片至图片的宽度和高度填充整个UIImageView,然后居中显示
    UIViewContentModeScaleAspectFill,     // contents scaled to fill with fixed aspect. some portion of content may be clipped.

// 调用setNeedsDisplay方法时,就会重新渲染图片
    UIViewContentModeRedraw,              // redraw on bounds change (calls -setNeedsDisplay)
    UIViewContentModeCenter,              // contents remain same size. positioned adjusted.
    UIViewContentModeTop,
    UIViewContentModeBottom,
    UIViewContentModeLeft,
    UIViewContentModeRight,
    UIViewContentModeTopLeft,
    UIViewContentModeTopRight,
    UIViewContentModeBottomLeft,
    UIViewContentModeBottomRight,
};

Original Picture

horizontalImage.png verticalImage.png

Demo

UIViewContentModeScaleToFill

_leftImageView.contentMode = UIViewContentModeScaleToFill;
_rightImageView.contentMode = UIViewContentModeScaleToFill;
UIViewContentModeScaleToFill.png

默认填充模式,将图片拉伸或者压缩至充满整个容器。

UIViewContentModeScaleAspectFit

_leftImageView.contentMode = UIViewContentModeScaleAspectFit;
_rightImageView.contentMode = UIViewContentModeScaleAspectFit;
UIViewContentModeScaleAspectFit.png

图片并没有变形,等比例缩放至父容器完全装下图片为止。

UIViewContentModeScaleAspectFill

_leftImageView.contentMode = UIViewContentModeScaleAspectFill;
_rightImageView.contentMode = UIViewContentModeScaleAspectFill;
    
// 推荐:将超出容器范围的切除掉
//  _leftImageView.clipsToBounds = YES;
//  _rightImageView.clipsToBounds = YES;
UIViewContentModeScaleAspectFill.png

图片拉伸后居中显示 , 宽度或者高度拉伸到了与父容器的宽度或者高度相等,图片并没有变形,但超出了父容器的范围。

UIViewContentModeScaleAspectFill-ClipsToBounds.png

.clipsToBounds = YES;可以使图片占满整个父容器,并且不变形。

Summary

  • 凡是带有Scale单词的属性,图片都会被拉伸。
  • 凡是带有Ascept单词属性,图片会保持原来的宽高比,即图片不会变形。

GitHub

相关文章

网友评论

    本文标题:UIViewContentMode 图片显示模式

    本文链接:https://www.haomeiwen.com/subject/uoeklttx.html