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

深度測試

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

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

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

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

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

深度

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

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

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

以下圖示，是針對個人理解所繪制，如有錯誤的地方，歡迎留言指出

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

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

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

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

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

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

深度緩存區(qū)原理

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

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

在之前的demo中，zaiRenderScene函數(shù)繪制前，都會先清空緩存區(qū)，這里的緩沖區(qū)就包括深度緩沖區(qū)，因為如果緩存區(qū)不清空，之前的數(shù)據(jù)會有殘留，會對目前圖形的繪制造成影響。

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

深度測試

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

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

甜甜圈開啟深度測試

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

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

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

深度測試應(yīng)用場景

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

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

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

多邊形偏移

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

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

ZFIghting閃爍

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

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

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

glEnable(GL_POLYGON_OFFSET_FILL)

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

glDisable(GL_POLYGON_OFFSET_FILL)

預(yù)防ZFighting閃爍

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

混合

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

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

• 開關(guān)方式

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

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

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

  用于處理類似濾鏡效果的場景，簡單描述就是將需要處理的圖片顏色和圖片上覆蓋的半透明顏色進(jìn)行混合 即 兩股顏色混合，此時如果只是單純的開關(guān)方式，已經(jīng)不能滿足我們的需求，需要借助混合方程式，來實(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方法中，是通過混合方程式來得到顏色的組合，默認(rèn)情況下混合方程式如下所示

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

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

總結(jié)

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

案例04：顏色混合

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

顏色混合效果

主要流程圖如下

顏色混合總流程

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

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

  
  
  RenderScene函數(shù)流程

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

• 通過glEnable開啟組合
• 通過glBlendFunc，開啟組合函數(shù)，計算混合因子，并在每次渲染，都會將屏幕上所有的像素點(diǎn)都更新一遍
• 繪制可移動正方形
• 繪制完成后，需要關(guān)閉混合功能，通過glDisable關(guān)閉
  因為如果不關(guān)閉，會對其他項目造成影響，混合的開啟是針對全局的，并不單單只是這個項目

//1.開啟混合
    glEnable(GL_BLEND);
    //2.開啟組合函數(shù) 計算混合顏色因子---每次渲染，會把屏幕上所有的像素點(diǎn)更新一遍
    //混合方程式：Cf = （Cs * S）+（Cd * D）
    glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
    //3.使用著色器管理器
    //*使用 單位著色器
    //參數(shù)1：簡單的使用默認(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);