iOS经典讲解之图片拉伸的几种方法

作者：刘新林

转载请标明出处：http://blog.youkuaiyun.com/loving_ios/article/details/52460627

一、通过UIImageView的属性image来设置图片会根据UIImageView的宽高自动拉伸，这样有比较大的的缺陷，就是会失真和变形

UIImage *image = [UIImage imageNamed:@"pao"];
NSLog(@"%lf %lf", image.size.width, image.size.height);
UIImageView *img_test = [[UIImageView alloc] initWithFrame:CGRectMake(100, 100, 96, 96)];
img_test.image = image;
[self.view addSubview:img_test];

二、通过实例方法stretchableImageWithLeftCapWidth:topCapHeight:来进行像素的拉伸

这个方法我们可以用来拉伸类似QQ，微信的聊天气泡背景图，这个函数是UIImage的一个实例函数，它的功能是创建一个内容可拉伸，而边角不拉伸的图片，需要两个参数，第一个是不拉伸区域和左边框的宽度，第二个参数是不拉伸区域和上边框的宽度。
参数的意义是，如果参数指定10，10。那么，图片左边10个像素，上边10个像素，不会被拉伸，x坐标为11的一个像素会被横向复制，y坐标为11的一个像素会被纵向复制。注意：只是对一个像素进行复制到一定宽度。

UIImage *image = [UIImage imageNamed:@"pao"];    
UIImageView *img_test = [[UIImageView alloc] initWithFrame:CGRectMake(100, 100, 96, 96)];
[self.view addSubview:img_test];
//   通过实例方法 stretchableImageWithLeftCapWidth: topCapHeight: 来拉伸
img_test.image = [image stretchableImageWithLeftCapWidth:16 topCapHeight:32];

这段代码的意思是将图片从坐标为(17,33)的像素点将图片进行拉伸。该方法也有一个缺陷，那就是如果图片内部也有被拉伸的的地方就不行了。比如下面这张图片，

就图片进行拉伸处理

 UIImage *image = [UIImage imageNamed:@"tupian"];
 UIImageView *img_test = [[UIImageView alloc] initWithFrame:CGRectMake(100, 100, 96, 96)];
 [self.view addSubview:img_test];
 img_test.image = [image stretchableImageWithLeftCapWidth:5 topCapHeight:5];

会得到下面这张图

原因很简单，因为只是对一个像素（6,6）进行横向和纵向拉伸，而内部的线条不在该像素内所以很出现该现象，这是这种方式的缺陷。

三、区域的拉伸通过方法- (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets

它分别对用了图片进行拉伸的区域距离顶部、左部、下部、右部的像素。比如，一个32*32像素的图片，将UIEdgeInsets参数全部设置为1，则实际拉伸的部分就是中间的30*30的区域的像素。有一点需要注意，这个方法默认使用的拉伸模式是区域复制，比如还是上面的图案，如下代码拉伸：

UIImage *image = [UIImage imageNamed:@"tupian"];
UIImageView *img_test = [[UIImageView alloc] initWithFrame:CGRectMake(100, 100, 96, 96)];
[self.view addSubview:img_test];
img_test.image = [image resizableImageWithCapInsets:UIEdgeInsetsMake(1, 1, 1, 1)];

得到的图片

很显然不符合要求，看下面的方法。

四、拉伸模式的设置

- (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets resizingMode:(UIImageResizingMode)resizingMode;

这个函数和上一个函数相比，唯一的差别是多了一个参数。这个参数是个枚举，如下

typedef NS_ENUM(NSInteger, UIImageResizingMode) {
    UIImageResizingModeTile,//进行区域复制模式拉伸 如上
    UIImageResizingModeStretch,//进行渐变复制模式拉伸
};

我们只需使用UIImageResizingModeStretch模式即可

UIImage *image = [UIImage imageNamed:@"tupian"];
UIImageView *img_test = [[UIImageView alloc] initWithFrame:CGRectMake(100, 100, 96, 96)];
[self.view addSubview:img_test];
img_test.image = [image resizableImageWithCapInsets:UIEdgeInsetsMake(1, 1, 1, 1) resizingMode:(UIImageResizingModeStretch)];

得到如下图：

在实际开发中会用到图片拉伸的地方很多，希望能有帮助。