?上一章我們了解了一些OpenGL相關(guān)的名詞,現(xiàn)在我們開始了解一下與之相關(guān)的坐標(biāo)系,把一個(gè)圖片成像在手機(jī)屏幕當(dāng)然需要有對(duì)應(yīng)的位置啦,所以還是必須要了解滴!
? ? 1.?2D笛卡爾坐標(biāo)系
這個(gè)我們都知道啦,就是我們平時(shí)用的二維坐標(biāo)系
2. 3D笛卡爾坐標(biāo)系
普通的三維坐標(biāo)系
3.視口
所謂視口就是我們用戶在屏幕上所能看到的范圍
4.OpenGL投影方式
5.OpenGL攝像機(jī)坐標(biāo)系
通過(guò)上圖我們不難看出,所謂相機(jī)坐標(biāo)系就是觀察的物體以相機(jī)為參考點(diǎn)所在的三維坐標(biāo)
那么OpenGL是怎么通過(guò)坐標(biāo)轉(zhuǎn)換最終定位到我們屏幕顯示位置的呢,大致流程如下:
圖片的渲染流程
大致流程如上圖所示,那么cpu 和 gpu都具體做了什么事情呢?我們就從iOS系統(tǒng)下加載一張圖片說(shuō)起
1.假設(shè)我們使用?????????????+imageWithContentsOfFile:????????????????????????????? ??????????????????????????從此盤中加載一張圖片,這個(gè)時(shí)候這張圖片是png或者jpg格式的圖片,就是說(shuō)這張圖片經(jīng)過(guò)了壓縮
2.然后我們 imgView.image = image 給到imgView
3.接著會(huì)有???????????????CATransaction 來(lái)捕捉到?????????UIImageView?????????????圖層樹的變化
4.在主線程里的下一個(gè)RunLoop到來(lái)之時(shí),Core Animation會(huì)提交這個(gè)隱式的transaction
在這里我們思考一個(gè)問(wèn)題,就是經(jīng)過(guò)壓縮后的圖片能直接使用取渲染到屏幕上嗎?
答案是否定的,只有位圖才能通過(guò)GPU渲染!那應(yīng)該怎么辦呢? 這個(gè)時(shí)候就到了我們的CPU發(fā)揮功效的時(shí)候了!
1.首先CPU會(huì)針對(duì)壓縮的圖片進(jìn)行解壓縮,把它還原成位圖形式(這張圖就是我們所說(shuō)的紋理),這是一個(gè)非常耗時(shí)的CPU操作
2.CPU會(huì)計(jì)算出當(dāng)前圖片的Frame
3.將解壓縮之后的圖片提交給GPU來(lái)做圖片渲染
4.GPU拿到圖片以后會(huì)獲取??????圖片F(xiàn)rame,并且將坐標(biāo)提交給頂點(diǎn)著色器進(jìn)行頂點(diǎn)坐標(biāo)計(jì)算
5.光柵化(將頂點(diǎn)轉(zhuǎn)化為片元,??????????????????????????獲取圖片對(duì)應(yīng)屏幕的像素點(diǎn))
6.片元著色器確定每個(gè)像素點(diǎn)的顏色值
7.渲染到屏幕
上面我們提到了解壓縮是一個(gè)非常耗時(shí)的操作,并且他默認(rèn)實(shí)在主線程執(zhí)行的,那么當(dāng)需要加載大量的圖片的時(shí)候,相對(duì)應(yīng)的CPU工作量就會(huì)很大,從而可能會(huì)導(dǎo)致阻塞主線程
在這里我們說(shuō)一下解壓縮原理
解壓縮的原理其實(shí)很簡(jiǎn)單,其實(shí)就是對(duì)圖片進(jìn)行重新繪制,得到一張新的解壓縮后的圖片,如果已經(jīng)解壓縮過(guò)的圖片系統(tǒng)講不會(huì)再解壓縮.其中解壓縮用的最核心的函數(shù)就是???????????????????????????CGBitmapContextCreate???()
參數(shù)解釋:
data:指定一塊內(nèi)存,如果為空就會(huì)由系統(tǒng)自己分配,所以一半為NULL
width???和height:圖片的大小->對(duì)應(yīng)像素
bitsPerComponent:?像素的每個(gè)顏色分量使用的bit???數(shù),在RGB空間下一般為8
bytesPerRow:NULL
space:就是我們的顏色空間,一般為RGB
bitmapInfo:kCGImageAlphaPremultipliedFirst
如果我們看過(guò)YYImage\SDWebImage開源框架的話也會(huì)從中找到對(duì)應(yīng)的,他們是提前對(duì)圖片進(jìn)行解壓縮,下面是我截取的SDWebImage部分代碼
