iOS中的離屏渲染

什么是離屏渲染涵紊?

離屏渲染就是在屏幕之外渲染圖形圖像哈街,不會(huì)直接顯示到屏幕上揣苏,等待合適的時(shí)機(jī)再顯示悯嗓。

什么情況下會(huì)觸發(fā)離屏渲染?

說(shuō)幾種iOS開發(fā)的過(guò)程中常見的離屏渲染:

1.?使用了?mask?的?layer (layer.mask)

2. 需要進(jìn)行裁剪的?layer (layer.masksToBounds / view.clipsToBounds)

3. ?設(shè)置了組透明度為?YES卸察,并且透明度不為?1?的?layer (layer.allowsGroupOpacity/ layer.opacity)

4. 添加了投影的?layer (layer.shadow*)

5. 采用了光柵化的?layer (layer.shouldRasterize)

6. 繪制了文字的?layer (UILabel, CATextLayer, Core Text?等)

為什么會(huì)觸發(fā)離屏渲染脯厨?

當(dāng)app在渲染的過(guò)程中需要使用額外的渲染或者合并的時(shí)候就會(huì)觸發(fā)離屏渲染。

比如我們?cè)赨IImageView上加了一個(gè)mask:

由于UIImageView本身就存在一個(gè)layer坑质,所以這就是上面提到的第一種會(huì)觸發(fā)離屏渲染的情況合武。在渲染的時(shí)候就需要先渲染我們?cè)嫉膱D片,將渲染結(jié)果放到離屏緩沖區(qū)(offscreen buffer)里面涡扼,再渲染mask圖層稼跳,也將其結(jié)果存儲(chǔ)到離屏緩沖區(qū)里,最后將這兩個(gè)結(jié)果混合渲染的結(jié)果放到幀緩沖區(qū)里面壳澳,在下一次runloop到來(lái)的時(shí)候?qū)⑵滹@示到屏幕上岂贩。

離屏渲染會(huì)帶來(lái)什么問(wèn)題?

1巷波、離屏渲染需要額外的存儲(chǔ)空間萎津,它需要存儲(chǔ)一些渲染過(guò)程中的一些中間的結(jié)果。而我們的離屏緩沖區(qū)是有大小限制的抹镊,在蘋果關(guān)于光柵化(shouldRasterize)解釋了離屏緩沖區(qū)的大小為2.5倍屏幕大小锉屈。超出其大小的結(jié)果會(huì)被丟棄。

2垮耳、會(huì)帶來(lái)性能問(wèn)題颈渊,最常見的就是掉幀問(wèn)題(iOS中的掉幀問(wèn)題)遂黍。

為什么要使用離屏渲染?

既然離屏渲染會(huì)帶來(lái)各種各樣的問(wèn)題俊嗽,我們?yōu)槭裁催€要用離屏渲染呢雾家?

1、一些特殊的效果绍豁,不得不使用離屏渲染芯咧。比如 使用系統(tǒng)的毛玻璃(UIVisualEffectView)效果,使用圓角竹揍、陰影等敬飒,它們都是由系統(tǒng)自動(dòng)觸發(fā)的離屏渲染。

2芬位、效率優(yōu)勢(shì)无拗,有些效果我們需要多次頻繁的使用,就可以提前準(zhǔn)備在離屏緩沖區(qū)(offscreen Buffer)里面昧碉,從而達(dá)到復(fù)用的目的英染,是渲染速度更快捷。

如何避免離屏渲染晌纫?

1税迷、減少使用有透明度疊加的效果永丝。

2锹漱、使用圓角的時(shí)候不是系統(tǒng)自帶的,自己實(shí)現(xiàn)圓角效果(比如使用貝塞爾曲線)

注:在UIView里面使用layer.cornerRadius并不會(huì)直接觸發(fā)離屏渲染慕嚷,它只會(huì)對(duì)view的背景哥牍、邊框進(jìn)行圓角。

以上就是我對(duì)離屏渲染的理解喝检,最后附上YYImage對(duì)圓角的處理(YYImage源碼地址):

- (UIImage *)yy_imageByRoundCornerRadius:(CGFloat)radius corners:(UIRectCorner)corners

borderWidth:(CGFloat)borderWidth

borderColor:(UIColor *)borderColor borderLineJoin:(CGLineJoin)borderLineJoin {

if (corners != UIRectCornerAllCorners) {

UIRectCorner tmp = 0;

if (corners & UIRectCornerTopLeft) tmp |= UIRectCornerBottomLeft;

if (corners & UIRectCornerTopRight) tmp |= UIRectCornerBottomRight; if (corners & UIRectCornerBottomLeft) tmp |= UIRectCornerTopLeft;

if (corners & UIRectCornerBottomRight) tmp |= UIRectCornerTopRight; corners = tmp;

}

UIGraphicsBeginImageContextWithOptions(self.size, NO, self.scale); CGContextRef context = UIGraphicsGetCurrentContext();

CGRect rect = CGRectMake(0, 0, self.size.width, self.size.height); CGContextScaleCTM(context, 1, -1); CGContextTranslateCTM(context, 0, -rect.size.height);

CGFloat minSize = MIN(self.size.width, self.size.height); if (borderWidth < minSize / 2) {

UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectInset(rect, borderWidth, borderWidth) byRoundingCorners:corners cornerRadii:CGSizeMake(radius, borderWidth)];

[path closePath];

CGContextSaveGState(context);

[path addClip];

CGContextDrawImage(context, rect, self.CGImage); CGContextRestoreGState(context);

}

if (borderColor && borderWidth < minSize / 2 && borderWidth > 0) {

CGFloat strokeInset = (floor(borderWidth * self.scale) + 0.5) / self.scale;

CGRect strokeRect = CGRectInset(rect, strokeInset, strokeInset);

CGFloat strokeRadius = radius > self.scale / 2 ? radius - self.scale / 2 : 0;

UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:strokeRect byRoundingCorners:corners cornerRadii:CGSizeMake(strokeRadius,

borderWidth)];

[path closePath];

path.lineWidth = borderWidth; path.lineJoinStyle = borderLineJoin; [borderColor setStroke];

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末嗅辣,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子挠说,更是在濱河造成了極大的恐慌澡谭,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,734評(píng)論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件损俭,死亡現(xiàn)場(chǎng)離奇詭異蛙奖,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)杆兵,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,931評(píng)論 3 394
  • 文/潘曉璐 我一進(jìn)店門雁仲,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人琐脏,你說(shuō)我怎么就攤上這事攒砖「淄茫” “怎么了?”我有些...
    開封第一講書人閱讀 164,133評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵吹艇,是天一觀的道長(zhǎng)惰蜜。 經(jīng)常有香客問(wèn)我,道長(zhǎng)受神,這世上最難降的妖魔是什么蝎抽? 我笑而不...
    開封第一講書人閱讀 58,532評(píng)論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮路克,結(jié)果婚禮上樟结,老公的妹妹穿的比我還像新娘。我一直安慰自己精算,他們只是感情好瓢宦,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,585評(píng)論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著灰羽,像睡著了一般。 火紅的嫁衣襯著肌膚如雪廉嚼。 梳的紋絲不亂的頭發(fā)上玫镐,一...
    開封第一講書人閱讀 51,462評(píng)論 1 302
  • 那天,我揣著相機(jī)與錄音怠噪,去河邊找鬼恐似。 笑死,一個(gè)胖子當(dāng)著我的面吹牛傍念,可吹牛的內(nèi)容都是我干的矫夷。 我是一名探鬼主播,決...
    沈念sama閱讀 40,262評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼憋槐,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼双藕!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起阳仔,我...
    開封第一講書人閱讀 39,153評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤忧陪,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后近范,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體嘶摊,經(jīng)...
    沈念sama閱讀 45,587評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,792評(píng)論 3 336
  • 正文 我和宋清朗相戀三年顺又,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了更卒。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,919評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡稚照,死狀恐怖蹂空,靈堂內(nèi)的尸體忽然破棺而出俯萌,到底是詐尸還是另有隱情,我是刑警寧澤上枕,帶...
    沈念sama閱讀 35,635評(píng)論 5 345
  • 正文 年R本政府宣布咐熙,位于F島的核電站,受9級(jí)特大地震影響辨萍,放射性物質(zhì)發(fā)生泄漏棋恼。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,237評(píng)論 3 329
  • 文/蒙蒙 一锈玉、第九天 我趴在偏房一處隱蔽的房頂上張望爪飘。 院中可真熱鬧,春花似錦拉背、人聲如沸师崎。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,855評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)犁罩。三九已至,卻和暖如春两疚,著一層夾襖步出監(jiān)牢的瞬間床估,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,983評(píng)論 1 269
  • 我被黑心中介騙來(lái)泰國(guó)打工诱渤, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留丐巫,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,048評(píng)論 3 370
  • 正文 我出身青樓源哩,卻偏偏與公主長(zhǎng)得像鞋吉,于是被迫代替她去往敵國(guó)和親鸦做。 傳聞我的和親對(duì)象是個(gè)殘疾皇子励烦,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,864評(píng)論 2 354