在仿写QQ会话窗口的时候，气泡的背景图片拉伸问题。并不是所有地方都可以拉伸的，所以定义了下面的工具类中的一个方法，专门拉伸图片。
UIImageResizingModeStrech：拉伸模式，通过拉伸UIEdgeInsets指定的矩形区域来填充图片
UIImageResizingModeTile：平铺模式，通过重复显示UIEdgeInsets指定的矩形区域来填充图片
+ (UIImage *)resizeWithImage:(UIImage *)image{
CGFloat top = image.size.height/2.0;
CGFloat left = image.size.width/2.0;
CGFloat bottom = image.size.height/2.0;
CGFloat right = image.size.width/2.0;
return [image resizableImageWithCapInsets:UIEdgeInsetsMake(top, left, bottom, right)resizingMode:UIImageResizingModeStretch];
}
显示样式：
方法说明
- (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets resizingMode:(UIImageResizingMode)resizingMode
//该方法返回的是UIImage类型的对象,即返回经该方法拉伸后的图像
//传入的第一个参数capInsets是UIEdgeInsets类型的数据,即原始图像要被保护的区域
//这个参数是一个结构体,定义如下
//typedef struct { CGFloat top, left , bottom, right ; } UIEdgeInsets;
//该参数的意思是被保护的区域到原始图像外轮廓的上部,左部,底部,右部的直线距离,参考图2.1
//传入的第二个参数resizingMode是UIImageResizingMode类似的数据,即图像拉伸时选用的拉伸模式,
//这个参数是一个枚举类型,有以下两种方式
//UIImageResizingModeTile, 平铺
//UIImageResizingModeStretch, 拉伸
resizableImageWithCapInsets出现在IOS5.0，在iOS6.0以后，又增加了一个增强型的版本
resizableImageWithCapInsets:resizingMode:
不同之处在于iOS6增加了一个resizingMode用于指定是使用平铺还是拉伸方式处理图片
- 参数说明
- (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets resizingMode:(UIImageResizingMode)resizingMode
capInsets：指定可以拉伸的区域
resizingMode：指定处理模式－－－拉伸或者平铺
什么鬼？不懂？？看官别急，听我慢慢道来
- 代码说明
**假如我如下一个对话框图片
我想保留圆角和箭头部分，然后使图片宽度和高度都扩大一倍
**
首先［Mark man］来看看圆角的各个位置
知道各个边界了，我们开始编码，注意原图大小是170X50，我这里将_tileImgView（UIImageView）大小设置为了固定的340X100，以便于查看图片变大后的效果。
UIImage *img = [UIImage imageNamed:@"msg.jpg"]; UIEdgeInsets tileSets = {.left = 10, .top = 17, .right = 10, .bottom = 10}; UIImage *tileImage = [img resizableImageWithCapInsets:tileSets resizingMode:UIImageResizingModeTile]; _tileImgView.image = tileImage;
我们看看效果
嗯，圆角没有什么问题，但是，等等，为什么出现了三个箭头，瞬间懵比了有没有？
不用说问题肯定出在tileSets（可拉伸区域）这里了，那么到底什么是可拉伸区域啊？
是如上图所示的阴影部分的矩形区域吗？不是，绝对不是，因为如果这样的话，我们
的图片处理就会很完美了，不会出现三个箭头。那到底是什么呢？其实，参考Android的
.9png，分两部分，横向拉伸区域和纵向区域。
纵向区域＝[top,bottom]
横向区域=[left,right]
具体如下图所示
横向区域：当需要将图片向X方向拉伸时，需要使用[left, right]之间区域去填充需要拉伸的区域，left表示
距离左边界的距离，right表示距离右边界的距离，这两条线之间的区域就是用于填充多出来的需要拉伸的区域
纵向填充区域：当需要将图片向Y方向拉伸时，需要使用[top, bottom]之间区域去填充需要拉伸的区域，top表示距离上边界的距离，bottom表示距离下边界的距离，这两条线之间的区域就是用于填充多出来的需要拉伸的区域
所以当我们，纵向变大时，由50变为100时，因为拉伸区域是如上图所示的一块长方形长条，所以，纵向上的表现很完美。
我们来分析下，横向区域：可拉伸区域大小为170-10(left)-10(right)=150，不可拉伸区域为左边界的10像素圆角和右边界的10像素圆角。
iOS的resizableImageWithCapInsets会如下处理图片等拉伸：在两头保留不可拉伸区域，中间需要拉伸的地方用可拉伸区域来填充
保留左右各10个像素，中间剩下的320个像素使用可拉伸区域来填充，因为我们采用的是平铺的方式，所以中间会采用170（原图大小）-10（left）－10（right）＝150的可拉伸区域来填充剩下的320个像素
所以最终的效果是150+150+20＝320，正好出现三个箭头
以上只是示意图，请忽略原始比例。
如果我们将tileSets改成如下形式呢？
UIImage *img = [UIImage imageNamed:@"msg.jpg"]; UIEdgeInsets tileSets = {.left = 20, .top = 17, .right = 140, .bottom = 10}; UIImage *tileImage = [img resizableImageWithCapInsets:tileSets resizingMode:UIImageResizingModeTile]; _tileImgView.image = tileImage;
我们可拉伸区域只有10个像素（170-20-140）刚刚好是箭头的宽度；需要拉伸的区域有180（340-20-140），
这样算下来，我们程序运行的结果应该是180/10=18，含有18个箭头效果
知道了原理之后，回到开始的那个问题，如果保留圆角和一个箭头呢？只要箭头不在可拉伸区域里就可以
代码如下
UIImage *img = [UIImage imageNamed:@"msg.jpg"]; UIEdgeInsets tileSets = {.left = 40, .top = 17, .right = 77, .bottom = 10}; UIImage *tileImage = [img resizableImageWithCapInsets:tileSets resizingMode:UIImageResizingModeTile]; _tileImgView.image = tileImage;
我们看看效果
非常完美，but 等等，貌似使用以下代码，都能达到同样的效果：
UIEdgeInsets tileSets = {.left = 40, .top = 17, .right = 77, .bottom = 10}; UIEdgeInsets tileSets = {.left = 40, .top = 17, .right = 129, .bottom = 10}; UIEdgeInsets tileSets = {.left = 32, .top = 17, .right = 10, .bottom = 10};
该怎么办，怎么办？莫慌，查看Apple的文档可知：
Apple的文档 写道
If resizable areas have a width or height of 1 pixel—that is, a horizontally resizable area is 1 pixel wide, a vertically resizable area is 1 pixel tall, or the center region of the image is 1 x 1 pixel—iOS draws the image by stretching the 1-pixel region. This mode provides the fastest performance (for nonzero cap insets).
大概意思是，如果采用UIImageResizingModeStretch（拉伸模式），那么拉伸区域保存一个像素长或者宽最好，这样性能最优。至于平铺模式，则没有说明。
