原帖地址：http://school.ogdev.net/ArticleShow.asp?id=5552&categoryid=5

編譯你的shaders

現在我們已經輸入了我們的頂點shader，對每一個shader開發人員來說，接下來要做的事情就是編譯它以確定它是否正確。要編譯它，點擊主工具欄中的提交改變按鈕（圖標為：）。你也可以用快捷鍵（F7）來開始編譯。這將編譯所有工作區中經過修正的shaders，然后將編譯結果輸出到輸出窗口。

輸出窗口

輸出窗口是一個可停靠的窗口，它通常位于主用戶界面底部（見圖18）。該窗口用于輸出shader的編譯結果和不同應用程序的一些文本信息。輸出窗口與shader編輯器鏈接用于高亮顯示編譯錯誤。




                                                      圖18 輸出窗口

一旦你點擊了提交改變按鈕，如果shader中有錯誤，他們將被顯示在輸出窗口。點擊提交改變按鈕不僅編譯當前的shader，它還將存儲shader代碼的改變。還有就是，提交改變將應用到所有別改變的打開的shaders。在輸出窗口中雙擊一個錯誤將打開一個糾正窗口并且高亮顯示有錯誤的行（見圖19）。如果你改變了shader的文本然后沒有提交就想關閉窗口，RenderMonkey將詢問在關閉窗口之前是否提交改變。


                                       圖19 HLSL shader 中的編譯錯誤

編輯匯編

盡管我們這個練習中沒有用到匯編sahders，還是讓我們認識一下怎樣編輯匯編shaders。匯編shader編輯器窗口有兩個窗格扣組成——上面的窗格用于綁定RenderMonkey的變量節點到shader的常量寄存器中，下面的窗格用于編輯匯編shader文本。下面是匯編shader編輯器窗口的快照（如圖20）



                                             圖12 匯編語言編輯器

常量儲存編輯器為一個三列的視圖列表。每行代表一個特定的寄存器的值。第一列（Constant）用于指定常量寄存器的索引。第二列（Name）顯示連接到寄存器的節點的名字或“…”（如果沒有變量鏈接到寄存器）。第三列顯示的是連接到寄存器的變量節點的初始值。

綁定一個RenderMonkey變量節點到一個常量儲存寄存器意味著軟件將直接將節點的內部值綁定到寄存器值。在RenderMonkey中，向量和顏色節點表示為4個浮點值，標量被映射為四個相同的浮點值，矩陣用16個浮點值表示。

要綁定一個節點到寄存器，在你想要綁定的常量行的“Name”列上單擊右鍵在彈出的菜單中選擇一個變量節點（見圖21）。該菜單包含了所有在被編輯的shader范圍內的變量。一旦你選擇了一個節點，他的名字將出現在“Name”列，它的初始值將顯示在“Initial Value”列。



                              圖21 映射一個節點到匯編shader常量寄存器

要清空一個常量寄存器，在上述的菜單中選擇 Clear。以前與節點連接的變量名將被“…”替代，它的初始值也將被清空。

注意，如果你綁定一個矩陣到一個特殊的常量，該常量將占四個常量行。

編輯器支持像素和頂點匯編代碼的自定義語法顏色。而且還能完全支持剪貼板操作。

像素shader編輯和設置

現在，我們應經對頂點shader有了一個完整的了解，接下來讓我們看看像素shader。要編輯像素shader，要在shader編輯器窗口中選中Pixel Shader標簽頁。在開始編輯文本之前，然我們先回顧一下光照公式以確定要用到那些參數。參照公式（2）—（4）我們能確定要用到以下參數：

Ø Ka，Kd，Ks — 分別為環境，漫射和光照系數。

Ø Ia — 環境光強度。

Ø Id — 漫反射光照強度。

Ø Is — 鏡面反射光強度。

Ø Ns — 鏡面反射系數。

以上參數我們要將其作為常量添加到像素sahder中。Ka，Kd，Ks，ns將作為標量添加到工作區中，Ia，Id和Is能被作為顏色節點添加。根據下表將變量節的添加到工作區節點中：

1. Ka：名字為Ka的標量變量

2. Kd：名字為Kd的標量變量

3. Ks：名字為Ks的標量變量

4. ns：名字為Ns的標量變量

5. Ia：名字為Ia的顏色變量

6. Id：名字為Id的顏色變量

7. Is：名字為Is的顏色變量

下圖為你定義完成后工作區樹視圖的快照：



好啦，讓我們將這些參數添加到像素shader的聲明塊中。用我們在頂點shader一節中講解的方法將他們添加到像素shader的聲明中。如果你已經添加完成了最后一個節點，你應該能看到下面的聲明塊：

Float Ka;

Float Kd;

Float Ks;

Float Ns;

Float4 Ia;

Float4 Id;

Float4 Is;

現在，我們已經準備好要開始寫我們的像素shader的代碼了。這里我們將真正感受到用高級著色語言編寫sahders程序的簡單和優雅。如果你嘗試過用匯編語言寫shader程序，那么你肯定會喜歡這種改變。本例中完整的像素shader程序如下（不包含聲明部分）：

你只需要簡單的將這些代碼寫到像素shader的文本編輯器中然后點擊提交改變按鈕。記住，我們用了Pow指令，所以要將我們的目標設置成ps_2_0或更高版本。

預覽窗口

現在，我們已經完成了shaders的編輯工作，但是要想看到我們編輯的代碼的效果，還需要一個能用于查看結果的窗口。在RendeMinkey中，預覽窗口就是用來交互的預覽我們編輯的結果的窗口。所有shader中的變化或參數的更新都將適時地被渲染出來，一次他是真正的交互式shader開發。圖23顯示了一個海洋特效的預覽窗口。

 
                                                      圖23 預覽窗口

在RenderMondey的標準預覽模塊中提供了簡單的導航系統：

l 在窗口中平移用上下左右鍵，

l 向前或向后移動攝像機用“Z”和“X”鍵，

l 用鼠標旋轉屏幕

注意，預覽窗口中的模型將繞著Z軸旋轉。

點擊“P”鍵將根據渲染過程的個數顯示為一個視口陣列，用于預覽每一個渲染過程。（如圖24）：



                           圖24 預覽窗口中的多重視口

你也能選擇一組預定義的視圖來觀看你的模型。在預覽窗口中單擊右鍵，再彈出的菜單中選擇一個你想要的視圖。在該菜單中選擇“Properties”將允許你改變預覽窗口的屬性。再彈出的對話框中將允許你：

l 改變預覽窗口的背景色，

l 改變過程陣列視圖的背景色

l 改變視域

l 改變遠近剪切面值

編輯變量

現在，我們的預覽窗口中將出現一個白色茶壺。茶壺的外表取決于變量的值。我們要將我們shaders中的所有參數都設定一個有意義的值。不過，在這之前，先讓我們討論一下怎樣編輯變量。編輯變量有兩種方法，一種是雙擊該變量節點，一種是右擊該節點再彈出的菜單中選擇“Edit”。RenderMonkey將自動選擇一個與被編輯變量相匹配的編輯框。

常量變量

每個標量都可以通過下圖所示的標量編輯模塊編輯。注意，你可以用任何方法改變標量的值，如果你最后想反悔，可以單擊“Cancel”。不過論你最后怎樣，預覽窗口都會交互地顯示你的改變。


                                       圖25 標量編輯器

要編輯一個標量，你可以直接指定一個值，也可以通過滑動條交互的改變它的值。讓我們將我們工作區中的標量設置成以下值：

1. Ka = 0.8

2. Kd = 0.8

3. Ks = 1.0

4. Ns = 100.0



正確的指定值后，你將在預覽窗口中看到一個白色的茶壺。我們已經開啟了光照！

向量變量

每個向量能通過向量編輯模塊進行編輯：




                                       圖26 向量編輯器

每一個向量組件也向標量一樣能直接指定值，也能通過滑動條來改變。用戶也可以鉤選“Keep normalized”選項以保持向量始終是歸一化的。若果你對結果不滿意，也可以單擊Cancel按鈕。

好了，現在我們來設定光向量的值。雙擊lightDir變量然后輸入下列值：

X = -0.4; Y = 0.3; Z = 0.8; W = 0.0;

矩陣變量

盡管在本例中我們沒有修改任何矩陣變量，也讓我們了解一下怎樣用怎樣用矩陣編輯模塊來編輯矩陣變量：



                                                圖27 矩陣編輯器

通過以上兩例，相信讀者已經知道怎樣編輯矩陣變量了。矩陣變量值是多了幾個值而已。這有一個選項用來將矩陣恢復為單位矩陣（Set to Identity Matrix）。

顏色變量

每個顏色變量都能通過顏色編輯模塊編輯：



                                 圖28 顏色編輯器

用戶能通過RGB和HSV兩種模式來編輯顏色?？梢灾苯虞斎腩伾?，也可以通過顏色各個組建后的滑動條，還可以在顏色盤上直接選擇一種顏色。窗口最右邊的滑動條用來調節顏色的亮度。你調節的顏色時時地顯示在左上角的小方框中。Float Point 選項只對RGB模式有效，它將其各個組件值限制在-1.0和1.0范圍之內。負的顏色值能用來減少顏色。同樣你也可以在不滿意時點擊Cancel按鈕。

如果我們將Ia值設置為R = 0, G = 112, B = 0, A = 255,我們將看到如圖29所示的茶壺。



圖29 Phong 光照特效

渲染狀態塊管理

盡管我們已經完成了我們的第一個視覺特效。我們還是要探索一下怎樣修改每一個繪制調用的渲染狀態。每個過程都可能有若干個渲染狀態，它可能是從一個更高級的過程繼承而來也坑能就是他自己的。如果想創建一個渲染狀態節點，在你想將其放置到的過程節點上單擊右鍵，再彈出的菜單中選擇“Add Render State Block”如圖30：



            圖30 在過程中增加渲染狀態塊

如果一個過程中沒有定義渲染狀態塊，應用程序將搜索整個工作區樹，然后將其找到的第一個渲染狀態塊節點作為該過程渲染狀態塊的父節點。當你在一個過程中創建一個渲染狀態塊節點時，它將繼承在工作區中找到的第一個高級別渲染狀態塊的值。如果以前沒有創建過渲染狀態塊，那么它將不繼承任何值。改變新創建的渲染狀態塊的值將覆蓋其繼承的值。注意，在搜索過程中應用程序只查找當前和默認特效中的各個過程。也就是說每個特效中渲染狀態塊的值不能被其他特效訪問。要編輯渲染狀態，雙擊渲染狀態節點或在該節點上單擊右鍵再彈出的菜單中選擇“Edit”。渲染狀態編輯窗口如圖31所示：



                                    圖31 渲染狀態編輯器

要編輯一個特定的渲染狀態，在你要編輯的渲染狀態行的Value列單擊左鍵，如果該狀態由于定義的值，你可以在它們中選擇一個，如果沒有你可以直接指定一個值。

讓我們將我們的茶壺改為線框顯示。要做到這點其實相當容易。在渲染狀態編輯器中找到Fillmode渲染狀態將其值設為WIREFRAME。你將立即在預覽窗口中看到一個縣礦石的茶壺：



                                    圖32 線框顯示

當今的游戲中使用個工各樣的紋理貼圖來生成視覺特效?，F在，就讓我們來學一學怎樣在RenderMonkey中使用紋理貼圖。就像你以前學習的一樣，RenderMonkey中有專門用于2D紋理，立方貼圖和體積紋理的變量類型。那么現在就讓我們在工作區中增加一個2D紋理貼圖變量。在我們的特效工作區節點上單擊右鍵選擇Add Variable。選擇Texture類型然后將其命名為baseMap。一個紋理變量將出現在你的工作區中（默認的，紋理變量都被指定為藝術家可編輯的）。

接下來，為了將紋理應用到我們的特效中，需要在頂點shader中增加一個紋理坐標流。雙擊名字為standard mapping的流映射節點燃后增加一個新的通道用于紋理坐標：Reg = v2, Usage = TexCoord, UsageIndex = 0, Type = Float2。這樣就在我們的頂點shader中增加了一個新的流通道。

下面的步驟是在我們的頂點shader程序中增加紋理坐標。打開頂點shader的文本編輯器然后輸入以下代碼（下面列出了代碼）。粗體顯示的行和被注釋的行是不同于上面例子的部分：

新增的三行代碼將頂點shader從輸入的頂點流中獲取的紋理坐標輸出給像素shader，但是，要想真正的在像素shader中對紋理進行采樣，我們還需要將我們的紋理變量綁定到一個紋理對象中。

紋理對象

要使用紋理變量，你首先要創建一個紋理變量（在你的工作區中用增加變量對話框創建紋理變量）。一旦一個紋理變量被創建，你需要選擇一個從中加載紋理的文件。要在一個過程中實際的使用一個紋理，你要在該過程中增加一個紋理對象（在過程節點上單擊右鍵，選擇Add Texture Object，如圖33）。

            圖33 在過程中增加紋理對象

這將創建一個空的紋理對象。一個紋理對象如果沒有一個有效的紋理引用，它的圖標上將用一個紅色的叉線：

。紋理對象映射到你shaders中的紋理階段，他們還用于存儲紋理和采樣器狀態。要使用一個紋理對象，還需要增加一個紋理引用。要增加一個引用，在紋理對象節點上單擊右鍵，在彈出的菜單中選擇Add Texture Reference菜單項（如圖34）。



                  圖34 為紋理對象增加一個引用

這將創建一個空的紋理引用。要實際綁定一個引用到一個紋理變量，用戶還需要指定要引用的變量的名字。如果一個有效的紋理變量被找到，紋理引用上的紅叉線將消失。如果紅線沒有消失，那就說明紋理變量沒有被成功的引用。默認情況下，如果工作區有一個baseMap紋理變量，RenderMonkey會將紋理引用綁定到該變量，所以我們不需要做任何事。

如果我們想為我們想為我們的紋理貼圖指定一些采樣狀態，我們為一個特定的紋理引用節點用紋理編輯器指定這些狀態值，雙擊紋理引用節點即可打開紋理編輯器。（如圖35）



                                             圖35 紋理編輯器

紋理編輯器為每個特效中的每個過程多分配了一個標簽頁。紋理編輯器的頂部包含一個紋理應用的列表。點擊紋理圖標，能選擇觀看該紋理或設置紋理狀態。要設置一個特定的狀態，在狀態行和Value 列單擊，如果該狀態有預定值則選擇其中一個，如果沒有直接指定一個值。注意，紋理編輯器為每個有有效文件關聯的紋理變量都增加顯示一個小的縮略圖，你將在該圖的左下角看到一個小圖標，這個小圖標顯示了紋理的類型。

注意，僅當紋理對象又有效的紋理引用的時候會出現小圖標
或顯示為一個縮略圖。如果紋理對象的紋理引用沒用被正確的連接，它將顯示為一個叉圖標。紋理編輯器為所有的紋理變量都創建縮略圖，可是，對立方貼圖或體積紋理它只顯示一個面或一個片斷。

在HLSL Shaders中使用紋理

要在我們的像素shader中使用紋理貼圖，我們首先要增加一個采樣器。添加一個采樣器非常簡單和添加一個常量的步驟一樣。你必須有一個有效的有引用的紋理對象用來添加一個采樣器。單擊Sampler標簽后的箭頭（）這將打開一個能映射到HLSL 采樣器對象的紋理對象變量的列表。紋理引用的名字將被用于采樣器。用上述的方法你可以添加也可以刪除采樣器對象。

如果你想綁定一個參數到一個特定的寄存器，你要在寄存器組合框的下拉列表中選擇一個寄存器。變量和采樣器映射的寄存器設置是各自獨立的。

然我們將我們的紋理對象映射到一個采樣器。點擊后面的小箭頭在下拉列表中選擇baseMap ，然后點擊Add。你將在生命窗口中看到如下代碼：

float4 Ia;

float Ka;

float4 Is;

float Kd;

float4 Id;

float Ns;

float Ks;

sampler baseMap;

在下面已經更新了的像素shader的代碼（粗體顯示的行為相對以前更新的代碼）：


如果你現在編譯它，你將在預覽窗口中看到一個精細的帶紋理的茶壺：



                              圖25 帶紋理的茶壺特效

渲染到紋理

讓我們將我們的特效變得稍微復雜一點。我們要將我們第一個過程的輸出（我們剛才創建的），作文我們第二個過程的輸入。這一技術叫渲染到紋理，使用它能創建各種各樣有趣的特效。

渲染過程

要創建一個最簡單的渲染到紋理特效，我們至少需要兩個過程。讓我們在工作區中增加一個新的過程。要增加一個新的過程，在特效節點上單擊右鍵在彈出的菜單中選擇Add Pass 。默認的，每個新創建的過程都將包含頂點和像素shader節點，一個模型節點和一個流映射參考節點（當然，他們允許修改）。一旦你創建了一個新的過程，你將發現在預覽窗口中又出現了一個紅色的茶壺。這是因為，一個特效里的過程都是按順序別調用的。要向前或向后移動一個過程，在該過程節點上單擊右鍵，然后選擇“Move Up”或“Move Down”（如圖36）。你也能用“Ctrl加Up”組合鍵來實現一個過程的上下移動?，F在我們有兩個過程，如果你將過程2移動到過程1上，你將再次看到那個帶紋理的茶壺，然后你再把它移回來，又將出現紅色的茶壺。



                     圖36 改變過程順序

為了方便調試shader程序，你也能將一個過程禁用。要禁用一個過程，在該過程節點上單擊右鍵選擇“Enable/Disable Pass”。一個禁用的過程的圖標上將出現一個紅叉線

表示他已經被禁用了。要激活一個過程，重復上述步驟即可。

工作區試圖中有一個禁用的過程的例子：



如果你已經重新排列了過程的順序，在繼續學習之前，請將其恢復到原來的順序（過程1在過程2之前）。

可渲染的紋理支持

RenderMonkey 支持將任何一個給定的過程渲染輸出成一個紋理供另一個后來的過程進行采樣。要在你的工作區中增加該功能，下面給出了步驟：

1. 在工作區中的任何地方創建一個可渲染的紋理。注意，一次只能將一個過程的渲染輸出到該紋理。要增加一個可渲染的紋理，在任何你想將該紋理添加到的節點上擊右鍵選擇“Add Renderable Texture”：



            圖37 增加可渲染的紋理

2. 你將看到一個新的節點，其圖標為：。這就是可渲染紋理節點，一會兒我們要將其連接到一個渲染目標和一個紋理對象以便對其進行采樣。

3. 接下來，你要在你的過程中增加一個渲染目標用來輸出可渲染的紋理。在過程節點上單擊右鍵選擇“Add Render Target”增加一個宣告染目標（該節點的圖標為）：




                     圖38 在過程中增加一個渲染目標

4. 下面，你要將渲染目標節點連接到你剛創建的可渲染的紋理。你可以通過直接將渲染目標節點的名字改為可渲染紋理節點的名字來連接它，也可以右擊渲染目標節點選擇一個參考節點，如下圖：


                        圖39 連接渲染目標節點到一個可渲染紋理變量

5. 現在，過程的輸出有了一個繪制可渲染紋理的渲染目標節點。

6. 然后，我們要將該可渲染的紋理連接到一個過程以便對其進行采樣。不過在這之前，你首先要在該過程中創建一個紋理對象和一個紋理參考。一旦你有了一個紋理參考，你必須將其連接到可渲染的紋理（或通過充命名的方式或單擊右鍵的方式，上面已經介紹過）。



                           圖40 連接紋理對象到一個可渲染的紋理變量

7. 現在，你就能像正常的紋理一樣使用該紋理對象了。

讓我們在我們的工作區中增加一個可渲染的紋理。在特效工作區節點上單擊右鍵，選擇Add Renderable Texture。然后再過程1中增加一個渲染目標（在過程1節點上單擊右鍵選擇Add Render Target）。連接渲染目標到可渲染的紋理（方法不再累述）?，F在，過程1的輸出已經轉向了可渲染紋理變量。

下面，我們要在過程2中增加對可渲染紋理的采樣能力。首先，我么要保證定點shader正確的傳遞了紋理坐標。將下面代碼下到定點shader中：

struct VS_OUTPUT

{

float4 Pos: POSITION;

float2 Tex: TEXCOORD0;

};

VS_OUTPUT main( float4 Pos: POSITION, float2 Tex: TEXCOORD0 )

{

VS_OUTPUT Out = (VS_OUTPUT) 0;

Out.Pos = mul( view_proj_matrix, Pos );

Out.Tex = Tex;

return Out;

}



這將保證我們將插值的紋理傳遞給了像素shader。接下來，我們在過程2中增加一個有紋理引用的紋理對象（步驟上面都已經講過）。但這次我們不是將其連接到紋理變量，而是連接到可渲染的紋理變量。這將直接把過程1的輸出傳遞給過程2。打開過程2的像素shader，增加一個采樣器。輸入以下代碼：

float4 main( float4 Diff : COLOR0,

float2 Tex : TEXCOORD0 ) : COLOR

{

return tex2D( renderTexture, Tex );

}



現在，預覽窗口中出現了一個帶紋理的茶壺，其紋理為我們在過程1中渲染的茶壺（見圖41）。設置兩個過程的紋理對象的采樣器狀態來獲得更好的渲染效果：Minfilter = LINEAR Magfilter = LINEAR。



                                 圖41 渲染到紋理特效

編輯可渲染的紋理

要編輯一個可渲染紋理節點，雙擊該節點將彈出可渲染紋理編輯框（見圖42）。



      圖42 可渲染紋理編輯器

在編輯器中，你能改變可編輯紋理的尺寸。要改變寬度或高度直接在編輯框中輸入你想改變的大小，然后按回車確認。選中“Use viewport dimensions”將會把紋理的大小邦定為視口的大小。要改變紋理的格式下拉列表中選擇一個與定義的格式。

編輯一個渲染目標

要編輯渲染目標節點，用戶要雙擊該節點打開渲染目標編輯器窗口：



               圖43 渲染目標編輯器

通過該編輯器，用戶能通過“Enable color clear”按鈕是否對一個可渲染的紋理使用一個透明色。如果用戶選擇用透明色，編輯器還提供了一個用于指定透明色的按鈕，點擊它然后回彈出顏色選擇對話框，在對話框中選擇一共顏色。用戶也能通過“Enable depth clear”復選框來制定是否使用深度清除。如果允許，用戶也能指定一個清除值。

藝術家編輯器

shaders開發者面臨的一個問題是怎樣將其開發的特效提交給藝術家，然后通過藝術家對其進行加工來達到更好的效果。RenderMonkey 的解決方案是提供了一個藝術家編輯模塊。

Shader開發人員能有選擇的指定一個變量是否為藝術家可編輯。在你想要指定的變量節點上單擊右鍵，再彈出的菜單中選擇Artist Editable項，該變量節點圖標的左上角將出現一個黃色的小箭頭。然后你就能將你開發的特效提供給與你一起工作的藝術家了。藝術家能通過藝術標簽來對藝術家可編輯變量進行編輯。當前，支持的藝術家可編輯的變量類型有向量，標量和顏色，但是，任何變量都能被指定為藝術家可編輯然后通過藝術標簽進行訪問。

要打開藝術家編輯器，你能通過點擊應用程序工具欄中的

圖標，也能在主菜單的視圖菜單中選擇“Artist Editor”項。


                        圖44藝術家編輯器界面

藝術家編輯器是一個可?？看翱?，它包含了特效工作區，特效組，特效和過程標簽頁，只要他們中包含了藝術家可編輯的變量。如果節點中沒有包含藝術家可編輯變量，那么，該節點的標簽頁將不會出現。

藝術家可編輯變量將按他們的類型分組（顏色，向量和標量）。每個組都能通過點擊按鈕將其展開或合并。



                                                圖45 藝術家編輯器界面

在藝術家編輯模塊編輯變量

顏色

每個顏色變量有三個相關的控制項——顏色樣本按鈕用于打開顏色拾取器，一個色調滑動條和一個強度滑動條：



                                    圖46 顏色拾取器

向量

每個向量有五個可用的控制項——一個標簽按鈕用于顯示向量編輯器的全貌，四個帶有滑動條的組件編輯框，用于編輯向量的每一個組件：


                        圖47 藝術家編輯器中的向量編輯器


                                    圖48 展開的向量編輯框

標量

每個標量有兩個相關的控制想：一個由于展開標量編輯器的標簽按鈕和一個用于編輯標量值得編輯框。



                        圖49 標量編輯框



                                 圖50 展開的標量編輯器