轉(zhuǎn)自:http://www.cnblogs.com/scorpiozj/p/3302270.html
最近在sae上搭建了個(gè)wp,因?yàn)樯罡凶约呵岸说臇|西缺乏,所以想依次為契機(jī),學(xué)習(xí)一下。本文是從個(gè)人的sae版wp轉(zhuǎn)載過(guò)來(lái)。
本篇也是在實(shí)現(xiàn)微博過(guò)程中遇到的問(wèn)題。原先以為很簡(jiǎn)單的東西,到了實(shí)際做的時(shí)候,才發(fā)現(xiàn)這里出錯(cuò)那里不對(duì)。浪費(fèi)很多時(shí)間,究根結(jié)底,還是沒(méi)有弄清楚文檔。
在iOS5, UIImage添加了可以拉伸圖片的函數(shù),即:
[UIImage resizableImageWithCapInsets:]
它帶參數(shù): UIEdgeInsets,這是一結(jié)構(gòu)體,包含 上/左/下/右四個(gè)參數(shù)。函數(shù)的作用我們看下文檔:
Creates and returns a new image object with the specified cap insets.
Discussion
You use this method to add cap insets to an image or to change the existing cap insets of an image. In both cases, you get back a new image and the original image remains untouched.
During scaling or resizing of the image, areas covered by a cap are not scaled or resized. Instead, the pixel area not covered by the cap in each direction is tiled, left-to-right and top-to-bottom, to resize the image. This technique is often used to create variable-width buttons, which retain the same rounded corners but whose center region grows or shrinks as needed. For best performance, use a tiled area that is a 1×1 pixel area in size.
上左下右4參數(shù)定義了cap inset,就是離四條邊的距離。拉升時(shí),cap到邊的部分不會(huì)被拉升,其余部分則會(huì)被拉升。尤其需要注意的時(shí),拉升的時(shí)候,是從左到右,從上到下的方向。通俗點(diǎn)說(shuō),拉升不是全方向的拉升,而是垂直和水平拉升的疊加。
以我遇到的問(wèn)題為例,我的圖片是170×50, 需要填充到240×140,但是四周的圓角以及小箭頭保持原樣,如圖:
開(kāi)始我設(shè)置參數(shù){20,10,10,10},在圖上的位置大致:
這樣拉升的結(jié)果:
很奇怪是不是,為什么出現(xiàn)了兩個(gè)箭頭(紅色部分是設(shè)置的背景色用語(yǔ)區(qū)分)?再回頭看下文檔,才恍然大悟:
拉升的時(shí)候,是按前文說(shuō)的兩個(gè)方向來(lái)拉升
拉升的部分,是以tiled方式,簡(jiǎn)單的說(shuō)就是以鏡像的方式
按照1的規(guī)則,拉升的時(shí)候,水平和垂直方向都需要拉升。這樣在水平拉升的時(shí)候,箭頭其實(shí)處于拉升的部分。而拉升的時(shí)候,先按照原有的尺寸添加進(jìn)去,不足的地方再把中間不拉升的部分填充進(jìn)去,周而復(fù)始,直到填充完畢。因此,就有上面的現(xiàn)象了。
要達(dá)到需要的效果,必須按照如下的設(shè)置:
于是得到了我們需要的效果:
Binggo~ 一切完畢。
說(shuō)實(shí)話,這個(gè)函數(shù)在iOS5 beta的時(shí)候就知道了,可是一直是不正確的理解。直到今天需要用到的時(shí)候,才發(fā)現(xiàn)一直沒(méi)理解對(duì)。于此同時(shí),也發(fā)現(xiàn)自己 局限在工作相關(guān)的部分,工作以外的東西不是光知道就可以,還是需要去實(shí)踐的。否則,就會(huì)遇到今天的情形,被個(gè)小問(wèn)題,折磨了好久。




