02總結(jié)--014--OpenGL ES 初識(shí)

TOC

OpenGL ES 初識(shí)

OpenGL ES 簡(jiǎn)介

OpenGL ES (OpenGL for Embedded Systems)是以手持和嵌入式為?標(biāo)的?級(jí)3D圖形應(yīng)?程序編程接?(API). OpenGL ES 是?前智能?機(jī)中占據(jù)統(tǒng)治地位的圖形API.?持的平臺(tái): iOS, Andriod , BlackBerry ,bada ,Linux ,Windows.

  • OpenGL的跨平臺(tái)并不是說(shuō)一套代碼適配安卓和iOS兩套系統(tǒng)，OpenGL不提供窗口
  • 跨平臺(tái)跨的是GLSL語(yǔ)言，頂點(diǎn)數(shù)據(jù)和著色器

OpenGL ES 在APPLE中的解釋

  • 蘋(píng)果對(duì)于OpenGL ES的介紹
  • 簡(jiǎn)化了OpenGL代碼，剔除了非移動(dòng)的代碼

The Open Graphics Library (OpenGL) is used for visualizing 2D and 3D data. It is a multipurpose open-standard graphics library that supports applications for 2D and 3D digital content creation, mechanical and architectural design, virtual prototyping, flight simulation, video games, and more. You use OpenGL to
configure a 3D graphics pipeline and submit data to it. Vertices are transformed and lit, assembled into primitives, and rasterized to create a 2D image. OpenGL is designed to translate function calls into graphics commands that can be sent to underlying graphics hardware. Because this underlying hardware is dedicated to processing graphics commands, OpenGL drawing is typically very fast. OpenGL for Embedded Systems (OpenGL ES) is a simplified version of OpenGL that eliminates redundant functionality to provide a library that is both easier to learn and easier to implement in mobile graphics hardware.

釋義

OpenGL ES 開(kāi)放式圖形庫(kù)(OpenGL的)?于可視化的?維和三維數(shù)據(jù)。它是?個(gè)多功能開(kāi)放標(biāo)準(zhǔn)圖形庫(kù)，?持2D和3D數(shù)字內(nèi)容創(chuàng)建，機(jī)械和建筑設(shè)計(jì)，虛擬原型設(shè)計(jì)，飛行模擬，視頻游戲等應(yīng)?程序。您可以使用OpenGL配置3D圖形管道并向其提交數(shù)據(jù)。頂點(diǎn)被變換和點(diǎn)亮，組合成圖元，并光柵化以創(chuàng)建2D圖像。OpenGL旨在將函數(shù)調(diào)?轉(zhuǎn)換為可以發(fā)送到底層圖形硬件的圖形命令。由于此底層硬件專(zhuān)?于處理圖形命令，因此OpenGL繪圖通常??？?。
OpenGL for Embedded Systems(OpenGL ES)是OpenGL的簡(jiǎn)化版本，它消除了冗余功能，提供了一個(gè)既易于學(xué)習(xí)又更易于在移動(dòng)圖形硬件中實(shí)現(xiàn)的庫(kù)。

OpenGL ES framework

image

OpenGL ES允許應(yīng)?程序利用底層圖形處理器的強(qiáng)?功能。iOS設(shè)備上的GPU可以執(zhí)行復(fù)雜的2D和3D繪圖，以及最終圖像中每個(gè)像素的復(fù)雜著?計(jì)算。

  • OpenGL ES framework提供的API，也是運(yùn)行在CPU，也就是client里面
  • 直到到頂點(diǎn)渲染開(kāi)始就是GPU處理階段

OpenGL ES 圖形管線(xiàn)

  • 藍(lán)寶書(shū)中的管線(xiàn)：數(shù)據(jù)類(lèi)型
image
  • 圖像管線(xiàn)，簡(jiǎn)化版，重點(diǎn)關(guān)注左側(cè)4個(gè)箭頭
image
  • 頂點(diǎn)數(shù)據(jù)：內(nèi)存拷貝到頂點(diǎn)緩存區(qū)里面（所有數(shù)據(jù)最開(kāi)始一定是先在內(nèi)存中，不會(huì)直接存在顯存中）
  • 左側(cè)的箭頭表示可以通過(guò)API來(lái)控制這四個(gè)東西
  • 蘋(píng)果給出的圖像管線(xiàn)：重點(diǎn)在每個(gè)過(guò)程所做的工作
image

著色器相關(guān)內(nèi)容

前面學(xué)到的所有固定著色器就是一個(gè)代碼片段，由GPU執(zhí)行

頂點(diǎn)著色器

1. 頂點(diǎn)著色器作用

  1. 著?器程序—描述頂點(diǎn)上執(zhí)?操作的頂點(diǎn)著?器程序源代碼/可執(zhí)?文件
  2. 頂點(diǎn)著?器輸?(屬性) — 用頂點(diǎn)數(shù)組提供每個(gè)頂點(diǎn)的數(shù)據(jù)
  3. 統(tǒng)?變量(uniform)—頂點(diǎn)/?元著?器使用的不變數(shù)據(jù)
  4. 采樣器—代表頂點(diǎn)著?器使?紋理的特殊統(tǒng)一變量類(lèi)型

2. 頂點(diǎn)著色器數(shù)據(jù)處理

image
  1. 可以通過(guò)統(tǒng)一變量、屬性、采樣器（例如紋理采樣）輸入給頂點(diǎn)著色器
  2. gl_Position：頂點(diǎn)著色器最終輸出結(jié)果的關(guān)鍵類(lèi)型（最終類(lèi)型）。內(nèi)建變量，事先已經(jīng)定義好了，直接使用即可
  3. gl_PointSize：點(diǎn)的尺寸

3. 頂點(diǎn)著色器業(yè)務(wù)

  1. 矩陣變換位置
  2. 計(jì)算光照公式?成逐頂點(diǎn)顏色
  3. 生成/變換紋理坐標(biāo)
  4. 片元著色器需要傳遞屬性（attribute）時(shí)，需要通過(guò)頂點(diǎn)著色器將屬性（attribute）透?jìng)鬟^(guò)來(lái)，因?yàn)樗旧硎遣荒苤苯荧@取到屬性（attribute）的。

總結(jié): 它可以?于執(zhí)行?定義計(jì)算,實(shí)施新的變換,照明或者傳統(tǒng)的固定功能所不允許的基于頂點(diǎn)的效果。

4. 頂點(diǎn)著色器代碼

attribute vec4 position;
attribute vec2 textCoordinate; 
uniform mat4 rotateMatrix; 
varying lowp vec2 varyTextCoord; 
void main()
{
    varyTextCoord = textCoordinate;
    vec4 vPos = position;
    vPos = vPos * rotateMatrix;
    gl_Position = vPos; 
}
  • 代碼并不復(fù)雜，因?yàn)镚PU不處理邏輯業(yè)務(wù)
  • 可能是沒(méi)有代碼提示等風(fēng)格，導(dǎo)致看起來(lái)復(fù)雜
  • 實(shí)現(xiàn)內(nèi)容1：紋理坐標(biāo)的橋接
  • 實(shí)現(xiàn)內(nèi)容2：紋理和旋轉(zhuǎn)矩陣的乘法

圖元裝配

頂點(diǎn)著?器之后,下一個(gè)階段就是圖元裝配。
圖元(Primitive): 點(diǎn),線(xiàn),三?形等。
圖元裝配: 將頂點(diǎn)數(shù)據(jù)計(jì)算成?個(gè)圖元.在這個(gè)階段會(huì)執(zhí)?裁剪、透視分割和Viewport變換操作。這個(gè)過(guò)程由OpenGL完成，開(kāi)發(fā)者不能編寫(xiě)。
圖元類(lèi)型和頂點(diǎn)確定將被渲染的單獨(dú)圖元。對(duì)于每個(gè)單獨(dú)圖元及其對(duì)應(yīng)的頂點(diǎn)，圖元裝配階段執(zhí)行的操作包括:將頂點(diǎn)著色器的輸出值執(zhí)?裁剪、透視分割、視口變換 后進(jìn)入光柵化階段。

光柵化

在這個(gè)階段繪制對(duì)應(yīng)的圖元(點(diǎn)/線(xiàn)/三?形). 光柵化就是將圖元轉(zhuǎn)化成一組二維片段的過(guò)程。而這些轉(zhuǎn)化的?段將由?元著?器處理.這些?維?段就是屏幕上可繪制的像素。

光柵化的作用：就是將圖元轉(zhuǎn)換成片元

  • 有多少個(gè)像素點(diǎn)，片元著色器就會(huì)執(zhí)行多少次
  • 但不會(huì)出現(xiàn)性能問(wèn)題，因?yàn)镚PU是真正的高并發(fā)，有很多ALU（計(jì)算單元）
光柵化

?元著?器/片段著?器/像素著色器

1. 片元著色器作用

  1. 著?器程序—描述片段上執(zhí)行操作的?元著?器程序源代碼/可執(zhí)行?件
  2. 輸入變量— 光柵化單元用插值為每個(gè)片段?成的頂點(diǎn)著?器輸出
  3. 統(tǒng)?一變量量(uniform)—頂點(diǎn)/片元著?器使用的不變數(shù)據(jù)
  4. 采樣器—代表?元著?器使?紋理的特殊統(tǒng)一變量類(lèi)型.

2. 片元著色器數(shù)據(jù)處理

image
  • 輸入變量：由頂點(diǎn)著色器透?jìng)鬟^(guò)來(lái)
  • gl_fragColor：片元著色器對(duì)某一個(gè)像素點(diǎn)進(jìn)行處理之后的結(jié)果。內(nèi)建變量

3. 片元著色器業(yè)務(wù)

  1. 計(jì)算顏?
  2. 獲取紋理值
  3. 往像素點(diǎn)中填充顏色值(紋理值/顏色值);

總結(jié): 它可以?于圖片/視頻/圖形中每個(gè)像素的顏?填充(?如給視頻添加濾鏡，實(shí)際上就是將視頻中每個(gè)圖?的像素點(diǎn)顏?填充進(jìn)行修改。

4. 片元著色器代碼

varying lowp vec2 varyTextCoord; 
uniform sampler2D colorMap;
void main() {
    gl_FragColor = texture2D(colorMap, varyTextCoord); 
}

【補(bǔ)充】濾鏡處理過(guò)程

  • 圖片濾鏡：

    圖片中每一個(gè)像素點(diǎn)
-->像素點(diǎn)飽和度處理
---->新的顏色
------>幀緩存區(qū)
-------->顯示

  • 視頻濾鏡：原理與圖片濾鏡處理一模一樣

  • 視頻mp4：轉(zhuǎn)成圖片之后的處理過(guò)程都是一樣的

    h264（視頻壓縮文件）
-->解碼(解壓）
---->一幀一幀圖片
視頻也是由圖片組成。視頻中的圖片是YUV格式，只占3/2個(gè)顏色通道

逐片元操作

逐片元操作流程

  • 像素歸屬測(cè)試: 確定幀緩存區(qū)中位置(Xw,Yw)的像素目前是不是歸屬于OpenGL ES所有. 例如,如果?個(gè)顯示OpenGL ES幀緩存區(qū)View被另外一個(gè)View 所遮蔽.則窗口系統(tǒng)
    可以確定被遮蔽的像素不屬于OpenGL ES上下文.從?不全顯示這些像素.?而像素歸屬測(cè)試是OpenGL ES 的一部分,它不由開(kāi)發(fā)者人為控制,?是由OpenGL ES 內(nèi)部進(jìn)?.

  • 裁剪測(cè)試: 裁剪測(cè)試確定(Xw,Yw)是否位于作為OpenGL ES狀態(tài)的一部分裁剪矩形范圍 內(nèi).如果該片段位于裁剪區(qū)域之外,則被拋棄.

  • 深度測(cè)試: 輸?片段的深度值進(jìn)步比較,確定片段是否拒絕測(cè)試

  • 混合: 混合將新生成的?段顏色與保存在幀緩存的位置的顏?值組合起來(lái).

  • 抖動(dòng): 抖動(dòng)可用于最?化因?yàn)槭?有限精度在幀緩存區(qū)中保存顏色值?而產(chǎn)生的偽像.

EGL (Embedded Graphics Library )

  • OpenGL ES 命令需要渲染上下文和繪制表面才能完成圖形圖像的繪制.
  • 渲染上下文: 存儲(chǔ)相關(guān)OpenGL ES 狀態(tài).
  • 繪制表面: 是?于繪制圖元的表面,它指定渲染所需要的緩存區(qū)類(lèi)型,例如顏色緩存區(qū),深度緩沖區(qū)和模板緩存區(qū).
  • OpenGL ES API 并沒(méi)有提供如何創(chuàng)建渲染上下文或者上下?如何連接到原?生窗?系 統(tǒng).
  • EGL 是Khronos 渲染API(如OpenGL ES) 和原?窗?系統(tǒng)之間的接?. 唯?支持 OpenGL ES 卻不?持EGL 的平臺(tái)是iOS. Apple 提供?己的EGL API的iOS實(shí)現(xiàn),稱(chēng)為EAGL.
  • 因?yàn)槊總€(gè)窗?系統(tǒng)都有不同的定義,所以EGL提供基本的不透明類(lèi)型—EGLDisplay, 這個(gè)類(lèi)型封裝了所有系統(tǒng)相關(guān)性,?于和原生窗口系統(tǒng)接口。

由于OpenGL ES是基于C的API，因此它?常便攜且受到?泛?支持。作為C API，它與Objective-C Cocoa Touch應(yīng)?程序無(wú)縫集成。OpenGL ES規(guī)范沒(méi)有定義窗?層; 相反，托管操作系統(tǒng)必須提供函數(shù)來(lái)創(chuàng)建一個(gè)接受命令的OpenGL ES 渲染上下文和?個(gè)幀緩沖區(qū)，其中寫(xiě)入任何繪圖命令的結(jié)果。在iOS上使?用OpenGL ES需要使?用iOS類(lèi)來(lái)設(shè)置和呈現(xiàn)繪圖表?，并使?平臺(tái)中立的API來(lái)呈現(xiàn)其內(nèi)容。

  • 蘋(píng)果提供 glkview 作為窗口
  • EGL：提供 OpenGL ES 與 原生窗口之間鏈接的接口。iOS系統(tǒng)推出的是 EAGL
  • 核心動(dòng)畫(huà)：特殊圖層（專(zhuān)門(mén)提供給 OpenGL ES使用的圖片 CAEAGLayer）

理解動(dòng)畫(huà)

1. 動(dòng)畫(huà)循環(huán)

image
  • 視覺(jué)暫留
  • 16幀就能看起來(lái)像動(dòng)畫(huà)
  • 逐幀動(dòng)畫(huà)

2. OpenGL ES 顯示器執(zhí)?動(dòng)畫(huà)的應(yīng)?程序流程

image
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書(shū)系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容