着色器的效果如何?

着色器的效果如何?

2.5 样例应用程序:卡通渲染(上)

阅读此文表明您已同意文末的声明

作为第二个顶点着色器的例子,让我们编写两个顶点着色器,它们以卡通风格绘画的方式对网格着色(shade)和画轮廓(outline)。图17.2展示了这一点:

着色器的效果如何?

2.2:(a)使用卡通着色法着色的对象(注意着色间的尖锐过渡)。(b)增强卡通效果,轮廓边silhouette edge)被勾出。(c)使用标准散射光照着色的对象

注意:卡通渲染是一种特定类型的非写实渲染non-photorealistic rendering),有时被称作风格化渲染stylistic rendering)。

虽然卡通渲染不适用于所有游戏,例如激烈的第一人称射击游戏,但是它仍然可以增强一些希望表现卡通感觉类型游戏的气氛。此外,卡通渲染相当易于实现,并让我们得以漂亮的演示顶点着色器。

我们将卡通渲染分割为两步:

1. 卡通绘图典型的很少有在两种着色间强烈过渡的着色强度luminance)级别;我们称此为卡通着色(cartoon shading)。在图2.2a)中,我们看到只用了三种着色强度(亮、中、暗)对网格进行着色,而且其间的过渡是不连贯的——不像图2.2c),其明暗过渡是平滑的。

2. 卡通绘图也典型的有其轮廓边被勾出,如图2.2b)所示。

这两个步骤都需要其各自的顶点着色器。

2.5.1 卡通着色

要实现卡通着色,我们采用Lander20003月发表在Game Developer Magazine的文章“Shades of Disney: Opaquing a 3D World”中所描述的方法。它像这样工作:我们创建一个带强度级别的灰度纹理,它包含我们需要的不同的着色强度。图2.3显示了我们在样例程序中使用的这个纹理。

着色器的效果如何?

2.3:用来保存着色强度的着色纹理。注意观察不连续的着色间过渡和纹理着色强度必须从左到右增加。

然后在顶点着色器中,我们执行标准散射点积运算standard diffuse calculation dot product)来确定顶点法线N和光线向量L之间角度的余弦,用以确定顶点接收到多少光线:

s=L·N

如果s0,就表示光线向量和顶点法线之间的角度大于90度,也就表示该表面接收不到光线。因此,如果s0,我们就让s0。所以s [0, 1]

现在,在通常的散射光照模型中,我们使用s来标记颜色向量,这样顶点颜色就根据接收到的光照的量变暗:

diffuseColor = s(r, g, b, a)

但是,这将会导致从亮到暗之间着色的平滑过渡。这是与我们期望的卡通着色相反的。我们想要一个(对卡通渲染在两至四种着色间工作良好的)在一些不同着色间的不连续的过渡。

反其道而行之,不使用s来标记颜色向量,我们准备使用s作为早先提到的强度纹理的u纹理坐标——如图2.3

注意:标量scalars必定是一个有效的纹理坐标,因为s [0, 1],这是通常纹理坐标的区间。

按这种方式,顶点不会被平滑着色,而是不连续的。例如,强度纹理可能被分成3种着色,如图2.4所示:

着色器的效果如何?

2.4:那么,s [0, 0.33]的值使用shader0着色,s [ 0.330.66]的值使用shader1着色,s [0.66,1]的值使用shader2着色。当然,从这些着色的一种到另一种的过渡是不连续的,这就赋予了我们期望的效果。

注意:我们还为卡通着色关闭了纹理过滤,因为这种过滤会试图使着色过渡变平滑。这对于我们要求的不连续过渡是多余的。

2.5.2 卡通着色的顶点着色器代码

我们现在呈现卡通着色的顶点着色器。这个着色器的主要任务只是根据s=L·N计算并设置纹理坐标。注意观察输出结构,我们已经增加了一个数据成员来存储已被计算过的纹理坐标。同时还需注意,我们仍然输出顶点颜色,虽然我们不修改它,不过当颜色被与强度纹理组合起来的时候,它呈现为被着色的。

// File: toon.txt

// Desc: Vertex shader that lights geometry so it appears to be

// drawn in a cartoon style.

//

// Globals

//

extern matrix WorldViewMatrix;

extern matrix WorldViewProjMatrix;

extern vector Color;

extern vector LightDirection;

static vector Black = {0.0f, 0.0f, 0.0f, 0.0f};

//

// Structures

//

struct VS_INPUT

{

vector position : POSITION;

vector normal : NORMAL;

};

struct VS_OUTPUT

{

vector position : POSITION;

float2 uvCoords : TEXCOORD;

vector diffuse : COLOR;

};

//

// Main

//

VS_OUTPUT Main(VS_INPUT input)

{

// zero out each member in output

VS_OUTPUT output = (VS_OUTPUT)0;

// transform vertex position to homogenous clip space

output.position = mul(input.position, WorldViewProjMatrix);

//

// Transform lights and normals to view space. Set w

// components to zero since we're transforming vectors.

// Assume there are no scalings in the world

// matrix as well.

//

LightDirection.w = 0.0f;

input.normal.w = 0.0f;

LightDirection = mul(LightDirection, WorldViewMatrix);

input.normal = mul(input.normal, WorldViewMatrix);

//

// Compute the 1D texture coordinate for toon rendering.

//

float u = dot(LightDirection, input.normal);

//

// Clamp to zero if u is negative because u

// negative implies the angle between the light

// and normal is greater than 90 degrees. And

// if that is true then the surface receives

// no light.

//

if(u < 0.0f)

u = 0.0f;

//

// Set other tex coord to middle.

//

float v = 0.5f;

output.uvCoords.x = u;

output.uvCoords.y = v;

// save color

output.diffuse = Color;

return output;

}

两点注解:

n 我们假设世界矩阵没有执行任何缩放。因为如果它执行,它就会弄乱乘以它的顶点的长度和方向。

n 我们总是设置v纹理坐标为纹理的中点。这意味着我们仅使用纹理中一条单一的线,那就是说我们可以使用1D强度纹理来代替2D的那个纹理。不管怎样,1D2D纹理都能工作。本例中,我们使用了2D纹理而不是1D纹理,这是没有什么特别的原因的。

[声明]:本文译自Frank Luna的《Introduction to 3D Game Programming with DirectX 9.0》,限于译者水平,文中难免错漏之处,欢迎各位网友批评指正;本文仅用于学习交流与参考用途,不得用于任何形式的商业用途;如需转载需事先征得作者本人和译者的同意,保持文章的完整性,并注明作者、译者和出处,作者保留对译文的所有权利。对于违反以上条款造成的后果,译者对此不负任何责任。我的MSNRaymond_King123@hotmail.com,欢迎热爱3D图形和游戏,并有一定图形编程经验的朋友与我进行交流。