在开发当中有时会有这样的需求,将从服务器端下载下来的图片添加到imageView上, 但是下载来的图片尺寸大小不固定,宽高也有可能不成比例, 如果我们直接显示,往往会发现图片被挤压,或者变形失真,如果你为了省事,你可以让你们的UI将图片处理一下,这样是能解决;但是如果这张图片是用户上传的头像, 这就要需要你来处理了。
比如这两张图片:
纵向图片.jpg 横向图片.jpg我们直接添加到imageView上的结果是:
screen_1.png这时我们会发现变形失真了。为了解决这一问题最简单的方法就是设置imageView的contentMode属性。因为imageView默认是填满整个容器,所以导致图片变形,影响美观。
首先contentMode的属性有:
typedef NS_ENUM(NSInteger, UIViewContentMode) {
//图片拉伸填充至整个UIImageView(图片可能会变形),这也是默认的属性,如果什么都不设置就是它在起作用
UIViewContentModeScaleToFill,
//图片拉伸至完全显示在UIImageView里面为止(图片不会变形)
UIViewContentModeScaleAspectFit,
//图片拉伸至图片的的宽度或者高度等于UIImageView的宽度或者高度为止.看图片的宽高哪一边最接近UIImageView的宽高,一个属性相等后另一个就停止拉伸.
UIViewContentModeScaleAspectFill,
//调用setNeedsDisplay 方法时,就会重新渲染图片
//下面的属性都是不会拉伸图片的
UIViewContentModeRedraw,
//中间模式
UIViewContentModeCenter,
//顶部
UIViewContentModeTop,
//底部
UIViewContentModeBottom,
//左边
UIViewContentModeLeft,
//右边
UIViewContentModeRight,
//左上
UIViewContentModeTopLeft,
//右上
UIViewContentModeTopRight,
//左下
UIViewContentModeBottomLeft,
//右下
UIViewContentModeBottomRight,
};
经过测试 UIViewContentModeScaleAspectFill 可以初步实现我们的需求
imageView_1.contentMode =UIViewContentModeScaleAspectFill;
imageView_2.contentMode =UIViewContentModeScaleAspectFill;
如图:
screen_2.png此时发现,虽然图片没有变形,但是图片已经超出了我们imageView控件的大小,为了解决这一问题就需要在加上一句话:
imageView_1.clipsToBounds = YES; //超出容器范围的切除掉
imageView_2.clipsToBounds = YES;
如图:
screen_3.png
这是我们就解决了imageView显示图片变形失真的问题了。
网友评论