[UIImage resizableImageWithCapInsets:]使用注意
转自:http://www.cnblogs.com/scorpiozj/p/3302270.html
最近在sae上搭建了个wp,因为深感自己前端的东西缺乏,所以想依次为契机,学习一下。本文是从个人的sae版wp转载过来。
原文见此。
本篇也是在实现微博过程中遇到的问题。原先以为很简单的东西,到了实际做的时候,才发现这里出错那里不对。浪费很多时间,究根结底,还是没有弄清楚文档。
在iOS5, UIImage添加了可以拉伸图片的函数,即:
它带参数: UIEdgeInsets,这是一结构体,包含 上/左/下/右四个参数。函数的作用我们看下文档:
上左下右4参数定义了cap inset,就是离四条边的距离。拉升时,cap到边的部分不会被拉升,其余部分则会被拉升。尤其需要注意的时,拉升的时候,是从左到右,从上到下的方向。通俗点说,拉升不是全方向的拉升,而是垂直和水平拉升的叠加。
以我遇到的问题为例,我的图片是170×50, 需要填充到240×140,但是四周的圆角以及小箭头保持原样,如图:
开始我设置参数{20,10,10,10},在图上的位置大致:
这样拉升的结果:
很奇怪是不是,为什么出现了两个箭头(红色部分是设置的背景色用语区分)?再回头看下文档,才恍然大悟:
- 拉升的时候,是按前文说的两个方向来拉升
- 拉升的部分,是以tiled方式,简单的说就是以镜像的方式
按照1的规则,拉升的时候,水平和垂直方向都需要拉升。这样在水平拉升的时候,箭头其实处于拉升的部分。而拉升的时候,先按照原有的尺寸添加进去,不足的地方再把中间不拉升的部分填充进去,周而复始,直到填充完毕。因此,就有上面的现象了。
要达到需要的效果,必须按照如下的设置:
于是得到了我们需要的效果:
Binggo~ 一切完毕。
说实话,这个函数在iOS5 beta的时候就知道了,可是一直是不正确的理解。直到今天需要用到的时候,才发现一直没理解对。于此同时,也发现自己 局限在工作相关的部分,工作以外的东西不是光知道就可以,还是需要去实践的。否则,就会遇到今天的情形,被个小问题,折磨了好久。