版權(quán)聲明

• 本文為“優(yōu)夢(mèng)創(chuàng)客”原創(chuàng)文章，您可以自由轉(zhuǎn)載，但必須加入完整的版權(quán)聲明

• 更多學(xué)習(xí)資源請(qǐng)加QQ：1517069595，獲?。ㄆ髽I(yè)級(jí)性能優(yōu)化/熱更新/Shader特效/服務(wù)器/商業(yè)項(xiàng)目實(shí)戰(zhàn)/每周直播/一對(duì)一指導(dǎo)）

前言

眾所周知，在游戲當(dāng)中，陰影是無(wú)處不在的，如果一款游戲沒(méi)有陰影，那么不光畫質(zhì)會(huì)大大折扣，游戲性也會(huì)大大降低，因此，我將通過(guò)這篇文章給大家談一談關(guān)于三種陰影渲染方式相關(guān)的知識(shí)，由于篇幅所限，我將著重講解一種基礎(chǔ)的渲染方式即平面陰影的實(shí)現(xiàn)。

一、平面陰影

• 平面陰影雖然是一種相對(duì)簡(jiǎn)單的渲染方式，但是在我們的平面游戲中是一種非常普遍的陰影渲染方式，比如王者榮耀中就采用了這種陰影渲染方式，如下圖，右側(cè)代碼實(shí)際上就是王者榮耀平面陰影的一個(gè)代碼實(shí)現(xiàn)

1.1 實(shí)現(xiàn)步驟

• 對(duì)一個(gè)角色模型進(jìn)行了兩次繪制（兩個(gè)Pass)：

• 一次是利用模型數(shù)據(jù)繪制了游戲物體本身

• 第二次是利用模型數(shù)據(jù)繪制角色陰影，我稱這種繪制方法為兩遍繪制。

• 第一個(gè)Pass在我之前的視頻中有介紹過(guò)，今天就不著重講解了，這篇文章主要講解第二個(gè)Pass的繪制

• 首先要給大家介紹一下圖形著色器，圖形著色器由兩個(gè)部分組成：

• 我們可以將一個(gè)基礎(chǔ)模型看做是一個(gè)三角形，這個(gè)三角形由三個(gè)點(diǎn)構(gòu)成，如何去控制這個(gè)三角形在場(chǎng)景中的位置呢？這時(shí)，就需要用到我們的頂點(diǎn)渲染程序來(lái)確定三角形的繪制位置。下面是一段頂點(diǎn)渲染程序。

• 第一部分為頂點(diǎn)渲染，確定頂點(diǎn)位置

第二部分為像素著色：

• 當(dāng)我們確定了三角形在場(chǎng)景中的位置之后，他的內(nèi)部需要填充一個(gè)什么樣的顏色呢？像素著色程序就是對(duì)三角形內(nèi)部填充顏色的一個(gè)設(shè)置。下面是一段像素著色程序。

回到我們的游戲陰影繪制來(lái)說(shuō)，我們究竟要在頂點(diǎn)程序和像素程序里面做什么呢？

1. 首先，我們?cè)陧旤c(diǎn)程序里面需要干兩件事情，第一件事情，就是把所有的頂點(diǎn)變換到世界空間，同時(shí)在地面上產(chǎn)生一個(gè)垂直的投影，第二件事，我要計(jì)算我的光線，根據(jù)光線的投射方將對(duì)地面的投影做一個(gè)平移。

2. 其次，當(dāng)我們的模型投影好之后，就要對(duì)陰影進(jìn)行一個(gè)著色，通過(guò)rgb和透明度的設(shè)置，也就是半透明混合，來(lái)達(dá)到本身的顏色和陰影的顏色進(jìn)行混合，最后得到一個(gè)“五彩斑斕的黑“的陰影效果。

3. 當(dāng)你掌握了第二個(gè)pass的繪制，基本就達(dá)到了shader繪制入門的水平，但是在一個(gè)商業(yè)項(xiàng)目中，這樣的一個(gè)陰影效果是不夠完善的，如果單純的利用這種方法渲染陰影，會(huì)產(chǎn)生很多問(wèn)題。我會(huì)例舉其中的幾個(gè)問(wèn)題，并提供我的解決方案。

1.2 平面陰影渲染所存在的問(wèn)題

1. 陰影重疊

• 陰影是半透明的，在渲染前，我們會(huì)開(kāi)啟陰影渲染的透明混合狀態(tài)，模型的正面和背面的三角形可能重復(fù)渲染，造成不透明度的疊加，這種的疊加是非常雜亂無(wú)章的。如圖所示，陰影非常地雜亂。

• 什么是陰影重疊？：

• 造成陰影重疊的原因：

• 其實(shí)主要原因是我們Unity中默認(rèn)的疊加方法是加法疊加，使得一個(gè)陰影被渲染了多次

• 解決方法：

• 我們?yōu)榱私鉀Q陰影重疊的問(wèn)題，應(yīng)當(dāng)保證每個(gè)陰影區(qū)域只被渲染一次，如何做到每個(gè)陰影只渲染一次呢？這里我要為大家介紹一種名為模板緩沖區(qū)的東西，什么是模板緩沖區(qū)呢？模板緩沖區(qū)實(shí)質(zhì)上就是一個(gè)和我們屏幕大小一樣的二維數(shù)組，他的原理如圖所示。

• 
  

模板緩沖區(qū)對(duì)陰影進(jìn)行渲染時(shí)，我們會(huì)在每一幀渲染時(shí)，將像素點(diǎn)的值設(shè)置為零，我們用零與特定的參考數(shù)值進(jìn)行比較，當(dāng)他滿足比較條件即通過(guò)我們的模板測(cè)試時(shí)，對(duì)于通過(guò)測(cè)試的像素點(diǎn)，我們將他的模板值替換為參考值，當(dāng)下一次在相同的位置進(jìn)行渲染時(shí)，就無(wú)法通過(guò)模板測(cè)試，我們就舍棄了該片元，從而保證一個(gè)像素點(diǎn)只被渲染一次。

2.其他問(wèn)題

• 除了陰影重疊的問(wèn)題之外，還存在著兩個(gè)問(wèn)題：

1. 由于平面陰影所在的高度與地面相同，由于浮點(diǎn)精度問(wèn)題，會(huì)造成“深度抖動(dòng)問(wèn)題”

????????2.由于陰影是物體本體壓扁形成的，所以，在地面邊界處，物體的陰影可能超出邊界

• 優(yōu)勢(shì)：

• 不需要打燈

• 渲染速度快

• 劣勢(shì)

• 只適用于平面表面

• 高低起伏的地面上會(huì)出現(xiàn)陰影穿插，當(dāng)出現(xiàn)地面起伏時(shí)，陰影會(huì)被凸起的地面遮擋

二、陰影錐

• 原理：

• 陰影錐采用了一種叫做模板緩沖區(qū)的方式，如下圖，存在一個(gè)三角形，當(dāng)光源照射三角形，它會(huì)產(chǎn)生陰影，我們對(duì)這個(gè)三角形進(jìn)行一個(gè)拉伸，正面會(huì)拉長(zhǎng)出來(lái)一個(gè)紫色區(qū)域和一個(gè)藍(lán)色區(qū)域，這兩個(gè)區(qū)域稱之為正面區(qū)域，背面會(huì)產(chǎn)生一個(gè)褐色區(qū)域，當(dāng)這三個(gè)區(qū)域拉長(zhǎng)出來(lái)之后，就會(huì)形成一個(gè)三棱錐，也就是陰影錐。

• 實(shí)現(xiàn)方法：

• 陰影錐的實(shí)現(xiàn)公式其實(shí)就是（1）+（2）-（3）

三、陰影貼圖

3.1陰影貼圖的特點(diǎn)

• 陰影貼圖是Unity官方所采納的一種陰影渲染方式，官方為了集成陰影貼圖的方式，已經(jīng)做了很多的工作，我們作為開(kāi)發(fā)者只需要在場(chǎng)景中設(shè)置好燈光，并且設(shè)置游戲中的gameobject是否能夠產(chǎn)生陰影就能夠完成

• 需要一個(gè)額外的ShadowCaster通道

• 便于實(shí)現(xiàn)軟陰影

3.2陰影貼圖的實(shí)現(xiàn)

1. 第一步：在燈光的位置生成一張深度圖，將場(chǎng)景中的深度值渲染到深度圖里面，如下圖，地面的部分和方塊被光線照到的地方需要被渲染，那么我們就把他們的深度值渲染到我們的深度圖里面。這些場(chǎng)景的信息會(huì)被存儲(chǔ)到一個(gè)額外的pass即ShadowCaster。

ShadowCaster是專門用來(lái)取得場(chǎng)景的深度信息的pass，這個(gè)Pass的深度信息是從燈光的位置取得的

1. 第二步：

• 假如我們要渲染地平面，而地平面是由一個(gè)個(gè)點(diǎn)組成的，假如我們要渲染點(diǎn)P，如果用我們的肉眼去看，那么很容易就可以看出點(diǎn)P是在陰影中，但是計(jì)算機(jī)如何知道點(diǎn)P是否應(yīng)該被渲染呢？

• 將渲染的深度圖，與點(diǎn)P在燈光空間中的深度值做比較，這里涉及到將點(diǎn)P的攝像機(jī)空間的深度值轉(zhuǎn)換到燈光空間中。將點(diǎn)P轉(zhuǎn)到燈光空間后，可以理解為點(diǎn)P距離燈光0.9，距離攝像機(jī)0.4,因?yàn)?.9>0.4，所以點(diǎn)P位于陰影之中，不用渲染。

3.3軟陰影

• ShadowMap也能實(shí)現(xiàn)軟陰影的效果，軟陰影是游戲中重要的陰影效果，一個(gè)陰影是由本影和半影組成的，軟陰影就是所謂的半影，如右下角的圖，陰影的周圍伴隨著虛化的陰影。

• 進(jìn)一步學(xué)習(xí)的內(nèi)容：

• 如果場(chǎng)景中有多個(gè)光源，會(huì)對(duì)同一個(gè)物體造成多個(gè)陰影，如何實(shí)現(xiàn)多光源的實(shí)時(shí)陰影以及他的性能優(yōu)化，可以繼續(xù)關(guān)注我們的課程。

• 如圖左邊一個(gè)飛機(jī)停在飛機(jī)跑道上，因?yàn)榕艿蕾N圖和飛機(jī)陰影的深度值相同，因此會(huì)出現(xiàn)抖動(dòng)。

• 深度抖動(dòng)問(wèn)題的解決。

• 多光源實(shí)時(shí)陰影及其性能優(yōu)化 。

• 這篇文章我主要講解了兩個(gè)方面的知識(shí)，平面陰影的實(shí)現(xiàn)和模板緩沖區(qū)的使用，另外介紹了陰影錐和陰影貼圖的實(shí)現(xiàn)原理，并且也介紹了一些商業(yè)項(xiàng)目中陰影效果實(shí)現(xiàn)可能產(chǎn)生的問(wèn)題。

點(diǎn)贊、分享加關(guān)注可獲得教程配套視頻 更多學(xué)習(xí)資源請(qǐng)加QQ：1517069595獲?。ㄆ髽I(yè)級(jí)性能優(yōu)化/熱更新/Shader特效/服務(wù)器/商業(yè)項(xiàng)目實(shí)戰(zhàn)/每周直播/一對(duì)一指導(dǎo)

作者：優(yōu)夢(mèng)創(chuàng)客

出處： bilibili