iOS圓角那些事

似乎沒有那家公司比Apple更愛圓角了,事實(shí)上,圓角也會讓圖形/產(chǎn)品看起來更加無侵略性,能夠帶來更好的用戶體驗(yàn).
iOS開發(fā)中各種圓角也隨處可見,最簡單給控件添加圓角的方式就是給視圖的layer設(shè)置corner屬性了:

self.blueView.layer.cornerRadius = 5.f;
self.blueView.layer.masksToBounds = YES; 

這種方式會帶來兩個問題:

    1. 當(dāng)圖片數(shù)量比較多的時候,這種添加圓角方式特別消耗性能,比如在UITableViewCell添加過多圓角的話,甚至?xí)硪曈X可見的卡頓.
    1. 無法配置圓角數(shù)量(只能添加view的四個角全為圓角),無法配置某個圓角大小.

第一個問題實(shí)際上是由于數(shù)量太多的情況下,系統(tǒng)會頻繁的調(diào)用GPU的離屏渲染(Offscreen Rendering)機(jī)制,導(dǎo)致內(nèi)存損耗嚴(yán)重.更多關(guān)于離屏渲染的詳解,可以看這里,本文不多贅述.

第二個問題,我們可以使用UIBezierPath來完美解決.以下是示例代碼:

    UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:self.blueView.bounds byRoundingCorners:UIRectCornerTopLeft | UIRectCornerBottomLeft cornerRadii:CGSizeMake(20, 0)];
    
    CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
   
    maskLayer.frame = self.blueView.bounds;
    
    maskLayer.path = maskPath.CGPath;
    
    self.blueView.layer.mask = maskLayer;
    
    self.blueView.layer.cornerRadius = 5.f;
    self.blueView.layer.masksToBounds = YES;

想要配置某個角為圓角的話,只需要指定對應(yīng)的UIRectCorner即可

5.jpg

以下是顯示效果:

4.jpg

你可以在這些下載這個demo

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末夭咬,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌号显,老刑警劉巖占业,帶你破解...
    沈念sama閱讀 217,826評論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件傲须,死亡現(xiàn)場離奇詭異也榄,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)赌莺,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,968評論 3 395
  • 文/潘曉璐 我一進(jìn)店門冰抢,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人艘狭,你說我怎么就攤上這事晒屎。” “怎么了缓升?”我有些...
    開封第一講書人閱讀 164,234評論 0 354
  • 文/不壞的土叔 我叫張陵,是天一觀的道長蕴轨。 經(jīng)常有香客問我港谊,道長,這世上最難降的妖魔是什么橙弱? 我笑而不...
    開封第一講書人閱讀 58,562評論 1 293
  • 正文 為了忘掉前任歧寺,我火速辦了婚禮,結(jié)果婚禮上棘脐,老公的妹妹穿的比我還像新娘斜筐。我一直安慰自己,他們只是感情好蛀缝,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,611評論 6 392
  • 文/花漫 我一把揭開白布顷链。 她就那樣靜靜地躺著,像睡著了一般屈梁。 火紅的嫁衣襯著肌膚如雪嗤练。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,482評論 1 302
  • 那天在讶,我揣著相機(jī)與錄音煞抬,去河邊找鬼。 笑死构哺,一個胖子當(dāng)著我的面吹牛革答,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播曙强,決...
    沈念sama閱讀 40,271評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼残拐,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了旗扑?” 一聲冷哼從身側(cè)響起蹦骑,我...
    開封第一講書人閱讀 39,166評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎臀防,沒想到半個月后眠菇,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體边败,經(jīng)...
    沈念sama閱讀 45,608評論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,814評論 3 336
  • 正文 我和宋清朗相戀三年捎废,在試婚紗的時候發(fā)現(xiàn)自己被綠了笑窜。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,926評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡登疗,死狀恐怖排截,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情辐益,我是刑警寧澤断傲,帶...
    沈念sama閱讀 35,644評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站智政,受9級特大地震影響认罩,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜续捂,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,249評論 3 329
  • 文/蒙蒙 一垦垂、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧牙瓢,春花似錦劫拗、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,866評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至聂渊,卻和暖如春差购,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背汉嗽。 一陣腳步聲響...
    開封第一講書人閱讀 32,991評論 1 269
  • 我被黑心中介騙來泰國打工欲逃, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人饼暑。 一個月前我還...
    沈念sama閱讀 48,063評論 3 370
  • 正文 我出身青樓稳析,卻偏偏與公主長得像,于是被迫代替她去往敵國和親弓叛。 傳聞我的和親對象是個殘疾皇子彰居,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,871評論 2 354

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