1襟士、渲染簡介
正常渲染:APP中的數(shù)據(jù)經(jīng)過CPU和GPU的計(jì)算處理后,形成幀數(shù)據(jù)并將結(jié)果存放在幀緩存區(qū)魂贬,需要顯示時(shí)從幀緩存區(qū)拿取數(shù)據(jù)經(jīng)過數(shù)模轉(zhuǎn)換并渲染到屏幕上的過程(數(shù)據(jù)特點(diǎn)是即用即丟且只能存放一組數(shù)據(jù))。
離屏渲染:APP需要顯示的畫面涉及到多個(gè)layer混合處理密浑,因?yàn)閹彺鎱^(qū)只能存放一組數(shù)據(jù)無法同時(shí)對(duì)多組數(shù)據(jù)進(jìn)行處理時(shí),系統(tǒng)會(huì)自動(dòng)將這多組的數(shù)據(jù)存放至離屏緩存區(qū)并混合處理后形成一組數(shù)據(jù)再重走正常渲染流程的過程粗井。
2尔破、離屏渲染的利弊
劣勢:離屏渲染加大了系統(tǒng)的負(fù)擔(dān)街图,造成性能上的損耗。主要表現(xiàn)在以下幾個(gè)方面懒构。
離屏渲染需要額外的存儲(chǔ)空間餐济,存儲(chǔ)空間大小的上限是2.5倍的屏幕像素大小,一旦超過胆剧,則無法使用離屏渲染
一旦因?yàn)殡x屏渲染導(dǎo)致最終存入幀緩存區(qū)的時(shí)候絮姆,已經(jīng)超過了16.67ms,則會(huì)出現(xiàn)掉幀的情況
優(yōu)勢:雖然離屏渲染會(huì)需要多開辟出離屏緩存區(qū)來存儲(chǔ)中間狀態(tài)秩霍,但是對(duì)于多次出現(xiàn)在屏幕上的數(shù)據(jù)滚朵,可以提前渲染好,從而達(dá)到復(fù)用的目的前域,這樣CPU/GPU就不用做一些重復(fù)的計(jì)算(光柵化)。
開發(fā)的特殊需求背景下韵吨,比如 一些動(dòng)畫效果和顯示效果匿垄,需要多圖層以及離屏緩存區(qū)保存中間狀態(tài),這種情況下就不得不使用離屏渲染(圓角归粉、陰影椿疗、高斯模糊等)。
3糠悼、離屏渲染監(jiān)控
Xcode模擬器提供給開發(fā)者一個(gè)工具届榄,可如下圖進(jìn)行開啟,開啟狀態(tài)觸發(fā)離屏渲染的視圖會(huì)被標(biāo)記顏色
4倔喂、日常開發(fā)避免非必要離屏渲染
日常開發(fā)時(shí)總是聽到有人說盡量避免使用圓角來避免離屏渲染的問題產(chǎn)生铝条。那么經(jīng)過上文我們可以得知這一說法并不完全正確。
我們先看一下圓角方法cornerRadius的官方描述:
Setting the radius to a value greater than?0.0?causes the layer to begin drawing rounded corners on its background. By default, the corner radius does not apply to the image in the layer’s?contents?property; it applies only to the background color and border of the layer. However, setting the?masksToBounds?property to?true?causes the content to be clipped to the rounded corners.
設(shè)置cornerRadius大于0時(shí)席噩,只會(huì)為layer的backgroundColor和border設(shè)置圓角班缰,而不會(huì)對(duì)layer的contents設(shè)置圓角,除非同時(shí)設(shè)置了layer.masksToBounds為true(對(duì)應(yīng)UIView的clipsToBounds屬性)悼枢。
針對(duì)這一描述我們可以觀看以下示例:
在界面上顯示一個(gè)設(shè)置了圖片的按鈕埠忘,雖然顯示時(shí)會(huì)涉及到按鈕背景和圖片的分別渲染,但是按鈕視圖顯示到屏幕上時(shí)系統(tǒng)實(shí)質(zhì)上是先將按鈕背景渲染到屏幕上馒索,然后再將圖片渲染到屏幕上來實(shí)現(xiàn)這一按鈕的正秤ǘ剩現(xiàn)實(shí)的。所以并沒有出現(xiàn)圖層混合所以也不會(huì)出現(xiàn)離屏渲染現(xiàn)象绰上。
當(dāng)我們對(duì)按鈕進(jìn)行圓角切割時(shí)旨怠,這樣按鈕視圖顯示到屏幕上時(shí)系統(tǒng)必須要先將按鈕背景色數(shù)據(jù)處理完成,然后在背景上添加圖片數(shù)據(jù)渔期,最后再對(duì)兩組數(shù)據(jù)進(jìn)行切割處理后才能形成有效的位圖數(shù)據(jù)渲染到屏幕上运吓。所以會(huì)出現(xiàn)圖層混合也就會(huì)導(dǎo)致離屏渲染現(xiàn)象出現(xiàn)渴邦。
那么如何避免這一情況出現(xiàn)呢?拘哨?谋梭?
我們可以設(shè)置按鈕背景色與父視圖顏色相同,然后單獨(dú)對(duì)按鈕的圖片進(jìn)行切割就可以避免離屏渲染情況出現(xiàn)了倦青。