OpenGL + OpenGL ES +Metal 系列文章匯總

深度測(cè)試

在上一篇五、OpenGL 渲染技巧：正背面剔除中，文末還遺留一個(gè)問題未解決，在解決之前，先說(shuō)說(shuō)這種現(xiàn)象產(chǎn)生的原因

甜甜圈缺口產(chǎn)生原因

甜甜圈缺口產(chǎn)生過程

從圖中可以看出，在甜甜圈旋轉(zhuǎn)過程中，當(dāng)前后兩部分重疊時(shí)，對(duì)于我們而言，需要顯示的是前面部分，后面部分是隱藏面，但是OpenGL中并不能清除的區(qū)分，兩個(gè)圖層誰(shuí)顯示在前，誰(shuí)顯示在后，由此導(dǎo)致甜甜圈產(chǎn)生了缺口。

在解決這個(gè)問題前，我們先了解幾個(gè)概念

深度

深度是指OpenGL坐標(biāo)系中，像素點(diǎn)的Z坐標(biāo)距觀察者的距離

深度與圖形中像素點(diǎn)的Z坐標(biāo)有如下關(guān)系：

• 如果觀察者在Z軸的正方向，Z值越大則越靠近觀察者
• 如果觀察者在Z軸的負(fù)方向，Z值越小則越靠近觀察者

以下圖示，是針對(duì)個(gè)人理解所繪制，如有錯(cuò)誤的地方，歡迎留言指出

其實(shí)，我們應(yīng)該基于兩種觀察方式去理解深度值與Z坐標(biāo)值的關(guān)系，下方圖片是基于觀察者不動(dòng)，物體動(dòng)的觀察方式，討論觀察者處于z軸正負(fù)軸時(shí)，深度值與物體z坐標(biāo)值的關(guān)系，基于另一種觀察方式的這里就不多做說(shuō)明了，可以在這個(gè)圖示的基礎(chǔ)上，去推演看看。

深度值與Z坐標(biāo)值的關(guān)系（基于 觀察者不動(dòng)，物體動(dòng)的觀察方式）

深度緩沖區(qū)（Depth Buffer）

深度緩存區(qū)是指一塊專門內(nèi)存區(qū)域，存儲(chǔ)在顯存中，用于存儲(chǔ)屏幕上所繪制圖形的每個(gè)像素點(diǎn)的深度值

• 深度值越大，離觀察者越遠(yuǎn)
• 深度值越小，里觀察者越近

從上圖深度值與Z值關(guān)系的圖中也可以看出，這里就不做過多說(shuō)明。

深度緩存區(qū)原理

將深度值與屏幕上的每個(gè)像素點(diǎn)進(jìn)行一一對(duì)應(yīng)，然后將深度值存儲(chǔ)到深度緩沖區(qū)。

• 在深度緩存區(qū)中，每個(gè)像素點(diǎn)只會(huì)記錄一個(gè)深度值
• 深度緩沖區(qū)的范圍是[0, 1]之間，默認(rèn)值是1.0，表示深度值的最大值

在之前的demo中，zaiRenderScene函數(shù)繪制前，都會(huì)先清空緩存區(qū)，這里的緩沖區(qū)就包括深度緩沖區(qū)，因?yàn)槿绻彺鎱^(qū)不清空，之前的數(shù)據(jù)會(huì)有殘留，會(huì)對(duì)目前圖形的繪制造成影響。

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

深度測(cè)試

一個(gè)物體在繪制時(shí)，像素點(diǎn)新的深度值需要與深度緩存中已經(jīng)存在的深度值作比較，如果 新值 > 舊值，則丟棄這部分不繪制，反之，將新的深度值更新至深度緩存區(qū)，由于深度緩存區(qū)與顏色緩存區(qū)是一一對(duì)應(yīng)的，同時(shí)也需要更新該像素點(diǎn)的顏色值到顏色緩存區(qū)，這個(gè)過程就是深度測(cè)試

針對(duì)甜甜圈缺口問題，我們就需要利用深度測(cè)試來(lái)解決，需要在甜甜圈繪制前開啟深度測(cè)試glEnable(GL_DEPTH_TEST);，用于新舊深度值的對(duì)比，決定像素點(diǎn)是繪制還是丟棄，所以在之前代碼的基礎(chǔ)上，主要需要修改RenderScene函數(shù)，起流程圖如下所示

甜甜圈開啟深度測(cè)試

• 開啟和關(guān)閉的邏輯，主要取決于右鍵菜單的點(diǎn)擊次數(shù)，第一次打開，第二次關(guān)閉，以此類推

if(iDepth){
    glEnable(GL_DEPTH_TEST);
}else{
    glDisable(GL_DEPTH_TEST);
}

• 深度測(cè)試的開啟，在繪制完成后，都需要關(guān)閉glDisable(GL_DEPTH_TEST);

深度測(cè)試應(yīng)用場(chǎng)景

• 類似于甜甜圈的缺口問題，當(dāng)旋轉(zhuǎn)時(shí)，OpenGL無(wú)法區(qū)分物體的兩部分重疊情況，導(dǎo)致缺口出現(xiàn)。
• 利用深度測(cè)試解決隱藏面的消除，

隱藏面消除方案 總結(jié)

• 正背面消除：需要根據(jù)頂點(diǎn)數(shù)據(jù)順序判斷用戶可見部分與隱藏面，隱藏面直接丟棄，不繪制，只繪制可見部分
• 深度測(cè)試：可以一次性解決隱藏面消除問題，原理是不管有多少圖層，只顯示可見圖層，剩余不可見的都丟棄

多邊形偏移

Z-Fighting(Z沖突，閃爍)問題

開啟深度測(cè)試后，由于深度緩沖區(qū)精度有限制，導(dǎo)致深度值在誤差極小時(shí)，OpenGL出現(xiàn)無(wú)法判斷的情況，導(dǎo)致出現(xiàn)畫面交錯(cuò)閃現(xiàn)的現(xiàn)象，例如下圖

ZFIghting閃爍

其問題產(chǎn)生的主要原因是由于圖形靠的太近，導(dǎo)致無(wú)法區(qū)分出圖層先后次序，針對(duì)該問題，OpenGL提供了一種多邊形偏移（Polygon Offset）方案

使用多邊形偏移，主要有以下三個(gè)步驟

• 在繪制前，開啟多邊形偏移

glEnable(GL_POLYGON_OFFSET_FILL)

• 指定偏移量glPolygonOffset (GLfloat factor, GLfloat units);，參數(shù)一般填 -1 和 -1
• 在繪制完成后，關(guān)閉多邊形偏移

glDisable(GL_POLYGON_OFFSET_FILL)

預(yù)防ZFighting閃爍

• 避免兩個(gè)物體靠的太近：在繪制時(shí)，插入一個(gè)小偏移
• 將近裁剪面（設(shè)置透視投影時(shí)設(shè)置）設(shè)置的離觀察者遠(yuǎn)一些：提高裁剪范圍內(nèi)的精確度
• 使用更高位數(shù)的深度緩沖區(qū)：提高深度緩沖區(qū)的精確度

混合

當(dāng)開啟深度測(cè)試后，兩個(gè)重疊的圖層中，如果有一個(gè)圖層是半透明的，另一個(gè)是非半透明，此時(shí)就不能通過深度值比較，來(lái)進(jìn)行顏色值的覆蓋，而是需要將兩個(gè)顏色進(jìn)行混合，然后存入顏色緩沖區(qū)。

使用
針對(duì)不同需求，顏色混合的使用方式有兩種

• 開關(guān)方式

  用于單純的將兩個(gè)圖層重疊時(shí)進(jìn)行顏色混合，這種混合并不能解決顏色的混合。在固定著色器和可編程著色器都可以使用這種方式

//開啟，
glEnable(GL_BlEND);
//關(guān)閉
glDisable(GL_BlEND);

• 開關(guān)方式 + 混合方程式

  用于處理類似濾鏡效果的場(chǎng)景，簡(jiǎn)單描述就是將需要處理的圖片顏色和圖片上覆蓋的半透明顏色進(jìn)行混合 即 兩股顏色混合，此時(shí)如果只是單純的開關(guān)方式，已經(jīng)不能滿足我們的需求，需要借助混合方程式，來(lái)實(shí)現(xiàn)兩股顏色的混合。一般是在可編程著色器中片元著色器中使用。

//開啟，
glEnable(GL_BlEND);
//設(shè)置混合因子--默認(rèn)值是 GL_SRC_ALPHA 和 GL_ONE_MINUS_SRC_ALPHA
glBlendFunc(GL_SRC_ALPHA,GL_ONE_MINUS_SRC_ALPHA);
//關(guān)閉
glDisable(GL_BlEND);

在glBlendFunc方法中，是通過混合方程式來(lái)得到顏色的組合，默認(rèn)情況下混合方程式如下所示

//Cf -- 最終組合的顏色值
//Cd：源顏色 -- 當(dāng)前渲染命令傳入的顏色值
//CS：目標(biāo)顏色 -- 顏色緩沖區(qū)中已經(jīng)存在的顏色值
//S：源混合因子
//D：目標(biāo)混合因子 
Cf = (Cs * S) + (Cd * D)

==> 在混合方程中，新顏色的alpha值越高，添加的新顏色成分就越高，舊顏色值值就保留的越少

總結(jié)

• 在顏色緩沖區(qū)中，每個(gè)像素點(diǎn)只能存儲(chǔ)一種顏色
• 顏色混合主要用于實(shí)現(xiàn)在不透明物體前繪制透明物體的效果
• 只有上面圖層是透明時(shí)，才需要開啟顏色混合，如果不是，則沒有必要開啟顏色混合

案例04：顏色混合

是在正方形鍵位控制Demo的基礎(chǔ)上作了一些改動(dòng)，當(dāng)正方形移動(dòng)到與固定正方形重疊時(shí)，他們重疊的部分就會(huì)發(fā)生顏色混合形成新的顏色值，存儲(chǔ)到顏色緩沖區(qū)。最終效果如下所示：

顏色混合效果

主要流程圖如下

顏色混合總流程

• 在SetupRC中創(chuàng)建了4個(gè)固定正方形，且將可移動(dòng)正方形設(shè)置為半透明

• RenderScene函數(shù)繪制前，開啟顏色混合，在繪制完成后，關(guān)閉顏色混合，函數(shù)主要流程如下

  
  
  RenderScene函數(shù)流程

從流程圖中可以看出，顏色組合的核心代碼說(shuō)明如下

• 通過glEnable開啟組合
• 通過glBlendFunc，開啟組合函數(shù)，計(jì)算混合因子，并在每次渲染，都會(huì)將屏幕上所有的像素點(diǎn)都更新一遍
• 繪制可移動(dòng)正方形
• 繪制完成后，需要關(guān)閉混合功能，通過glDisable關(guān)閉
  因?yàn)槿绻魂P(guān)閉，會(huì)對(duì)其他項(xiàng)目造成影響，混合的開啟是針對(duì)全局的，并不單單只是這個(gè)項(xiàng)目

//1.開啟混合
    glEnable(GL_BLEND);
    //2.開啟組合函數(shù) 計(jì)算混合顏色因子---每次渲染，會(huì)把屏幕上所有的像素點(diǎn)更新一遍
    //混合方程式：Cf = （Cs * S）+（Cd * D）
    glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
    //3.使用著色器管理器
    //*使用 單位著色器
    //參數(shù)1：簡(jiǎn)單的使用默認(rèn)笛卡爾坐標(biāo)系（-1，1），所有片段都應(yīng)用一種顏色。GLT_SHADER_IDENTITY
    //參數(shù)2：著色器顏色
    shaderManager.UseStockShader(GLT_SHADER_IDENTITY, vRed);
    //4.容器類開始繪制
    squareBatch.Draw();
    //5.關(guān)閉混合功能
    glDisable(GL_BLEND);