iOS 拉伸圖片

在開發(fā)過程中總會(huì)遇到背景圖片和控件大小一致的困擾规哲,通常就是兩種方法:
1、找美工切大小合適的圖片
2庐氮、通過使用代碼處理或可視化設(shè)置圖片拉伸

如何使用Slicing

Slicing功能要在.xcassets結(jié)尾的圖片資源管理器中才可以使用

1膘茎、通過以下Show Slicing按鈕和右邊欄Slicing屬性打開效果相同,點(diǎn)擊后可以看到有三種圖片拉伸方式:水平脚草、垂直赫悄、水平垂直方向;

Slicing 中有個(gè)Center屬性用來指定圖片的拉伸方式(Stretches馏慨、Tile)和可拉伸矩形范圍

第一步把冰箱門打開.png

2埂淮、根據(jù)需要選擇圖片拉伸方式,這里選擇十字圖標(biāo)或右側(cè)選擇 Horizontal And Vertical來演示效果写隶,如下圖藍(lán)色區(qū)域?yàn)榭衫靺^(qū)域 CGSizeMake(5, 5)倔撞,綠色區(qū)域?yàn)椴豢衫靺^(qū)域 UIEdgeInsetsMake(8, 8, 8, 8),可以通過過拖拉虛線來改變它們的作用區(qū)域或右側(cè)屬性來修改

第二步大象裝進(jìn)冰箱.png

水平拉伸方式更直觀:


拿一個(gè)水桶.png

3樟澜、拉伸前圖片大小52*52误窖,通過設(shè)置后的效果


第三步把大象拉出來溜溜.png

在可視化編程中設(shè)置UIImageView的Stretching為(0.5, 0.5, 0, 0)來處理拉伸

stretching.png

通過使用UIImage方法處理圖片拉伸

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

參數(shù)
capInsets:用來設(shè)置圖片的頂、左秩贰、底霹俺、右的端蓋高度
resizingMode:指定圖片的拉伸方式

UIImageResizingModeStretch:延伸模式,通過拉伸UIEdgeInsets指定的矩形區(qū)域來填充圖片圖片
UIImageResizingModeTile:平鋪模式毒费,通過復(fù)制顯示UIEdgeInsets指定的矩形區(qū)域來填充圖片

總結(jié)

Stretching屬性設(shè)置拉伸只對(duì)UIImageView有效丙唧,按鈕圖片拉伸需要使用其他兩種方式處理;
UIImage中方法處理圖片拉伸觅玻,適用于代碼設(shè)置想际;
Slicing功能最為方便有效培漏,推薦使用;

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末胡本,一起剝皮案震驚了整個(gè)濱河市牌柄,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌侧甫,老刑警劉巖珊佣,帶你破解...
    沈念sama閱讀 219,110評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異披粟,居然都是意外死亡咒锻,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,443評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門守屉,熙熙樓的掌柜王于貴愁眉苦臉地迎上來惑艇,“玉大人,你說我怎么就攤上這事拇泛”醢停” “怎么了?”我有些...
    開封第一講書人閱讀 165,474評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵碰镜,是天一觀的道長兢卵。 經(jīng)常有香客問我,道長绪颖,這世上最難降的妖魔是什么秽荤? 我笑而不...
    開封第一講書人閱讀 58,881評(píng)論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮柠横,結(jié)果婚禮上窃款,老公的妹妹穿的比我還像新娘。我一直安慰自己牍氛,他們只是感情好晨继,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,902評(píng)論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著搬俊,像睡著了一般紊扬。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上唉擂,一...
    開封第一講書人閱讀 51,698評(píng)論 1 305
  • 那天餐屎,我揣著相機(jī)與錄音,去河邊找鬼玩祟。 笑死腹缩,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播藏鹊,決...
    沈念sama閱讀 40,418評(píng)論 3 419
  • 文/蒼蘭香墨 我猛地睜開眼润讥,長吁一口氣:“原來是場噩夢(mèng)啊……” “哼!你這毒婦竟也來了盘寡?” 一聲冷哼從身側(cè)響起楚殿,我...
    開封第一講書人閱讀 39,332評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎宴抚,沒想到半個(gè)月后勒魔,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體甫煞,經(jīng)...
    沈念sama閱讀 45,796評(píng)論 1 316
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡菇曲,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,968評(píng)論 3 337
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了抚吠。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片常潮。...
    茶點(diǎn)故事閱讀 40,110評(píng)論 1 351
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖楷力,靈堂內(nèi)的尸體忽然破棺而出喊式,到底是詐尸還是另有隱情,我是刑警寧澤萧朝,帶...
    沈念sama閱讀 35,792評(píng)論 5 346
  • 正文 年R本政府宣布岔留,位于F島的核電站,受9級(jí)特大地震影響检柬,放射性物質(zhì)發(fā)生泄漏献联。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,455評(píng)論 3 331
  • 文/蒙蒙 一何址、第九天 我趴在偏房一處隱蔽的房頂上張望里逆。 院中可真熱鬧,春花似錦用爪、人聲如沸原押。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,003評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽诸衔。三九已至,卻和暖如春颇玷,著一層夾襖步出監(jiān)牢的瞬間笨农,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,130評(píng)論 1 272
  • 我被黑心中介騙來泰國打工亚隙, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留磁餐,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,348評(píng)論 3 373
  • 正文 我出身青樓,卻偏偏與公主長得像诊霹,于是被迫代替她去往敵國和親羞延。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,047評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容

  • 在一些情況下用圖片來做背景脾还,但是給的圖片的尺寸很小伴箩,不能鋪滿給定的ImageView或者button,這時(shí)候就要靠...
    Hanser0503閱讀 244評(píng)論 0 0
  • 返回一張受保護(hù)且被拉伸的圖片 應(yīng)用場景:聊天窗口的氣泡 方法一(棄用): iOS 5.0以前使用(棄用)這個(gè)方法會(huì)...
    林安530閱讀 15,751評(píng)論 1 36
  • + (UIImage *)resizableImageWithName:(NSString *)imageName...
    博行天下閱讀 1,460評(píng)論 0 0
  • 許多UIView的子類鄙漏,如一個(gè)UIButton或一個(gè)UILabel嗤谚,它們知道怎么繪制自己。遲早怔蚌,你也將想要做一些自...
    shenzhenboy閱讀 1,644評(píng)論 2 8
  • 文/鴻運(yùn) 凋落的春天 不再有殘紅的花瓣 一路的蒼白 就是你坦誠的誓言 凋落的春天 走向成熟的畫面 披上綠色 人生又...
    HONGYUNDANGTOU閱讀 272評(píng)論 9 10