深入探索Silverlight3D：从基础到高级应用

### 深入探索Silverlight 3D：从基础到高级应用 #### 1. 理解BasicEffect对象 在深入学习Silverlight 3D之前，我们需要先了解BasicEffect对象。Silverlight 3D的渲染工作依赖于着色器，这是一种直接在显卡GPU上运行的小程序。着色器主要分为两种： - **顶点着色器**：它会检查顶点缓冲区中的每个顶点，并将其在虚拟3D空间中的坐标转换为2D绘图表面上的物理显示位置。 - **像素着色器**：它会检查即将绘制的每个像素（作为线或三角形的一部分），并为其分配适当的颜色。 虽然我们可以使用DirectX SDK中的fxc.exe实用程序编写和编译自己的着色器，其语法为HLSL（高级着色器语言），类似于C#，但编写低级像素处理算法既繁琐又复杂。幸运的是，Silverlight继承了Microsoft的XNA高级效果模型，我们可以使用具有内置顶点和像素着色器的效果对象，其中BasicEffect类是一个几乎不可或缺的效果类，它具有执行基本着色、纹理映射和复杂光照的能力。 在当前示例中，准备BasicEffect对象需要进行以下设置： ```csharp effect = new BasicEffect(device); effect.View = view; effect.Projection = viewProjection; effect.World = Matrix.Identity; effect.VertexColorEnabled = true; ``` 这里，`View`和`Projection`矩阵用于设置视图和投影，`World`矩阵用于将对象移动到新位置，在本示例中使用单位矩阵，因为只有一个对象且无需移动。`VertexColorEnabled`属性设置为`true`，以启用内置的像素着色器为三角形着色。 #### 2. 绘制场景 当`DrawingSurface`控件触发`Draw`事件时，我们需要进行场景渲染。具体步骤如下： 1. 获取当前`GraphicsDevice`对象，并使用`Clear()`方法清除任何先前存在的内容： ```csharp private void drawingSurface_Draw(object sender, DrawEventArgs e) { GraphicsDevice device = GraphicsDeviceManager.Current.GraphicsDevice; device.Clear(new Color(0, 0, 0)); ... } ``` 注意，每次绘图操作都应从调用`Clear()`方法开始，否则`DrawingSurface`会使用深紫色背景提示。 2. 将之前创建的顶点缓冲区应用到`GraphicsDevice`，通过调用`SetVertexBuffer()`方法： ```csharp device.SetVertexBuffer(vertexBuffer); ``` 3. 执行实际绘制。使用效果对象时，可能需要多次重复绘制，我们只需遍历`Effect.CurrentTechniques.Passes`集合中的所有`EffectPass`对象，对每个对象调用`EffectPass.Apply()`，然后使用`GraphicsDevice.DrawPrimitives()`方法绘制内容： ```csharp foreach (EffectPass pass in effect.CurrentTechnique.Passes) { pass.Apply(); device.DrawPrimitives(PrimitiveType.TriangleList, 0, vertexBuffer.VertexCount / 3); } ``` `DrawPrimitives()`方法用于绘制一系列三角形，通过在顶点缓冲区末尾添加更多顶点（以三个为一组），可以添加更多三角形。此外，还有其他几种可绘制的图元类型，如下表所示： | 图元类型 | 描述 | | ---- | ---- | | TriangleList | 顶点缓冲区表示一系列不同的三角形，每个三角形由三个顶点描述。 | | TriangleStrip | 顶点缓冲区表示一系列相连的三角形，第一个三角形由三个顶点描述，后续每个三角形使用前一个三角形的最后一个顶点并添加两个新顶点。 | | LineList | 顶点缓冲区表示一系列不同的线段，每个线段由两个顶点描述。 | | LineStrip | 顶点缓冲区表示一系列相连的线段，第一个线段由两个顶点描述，后续每个线段使用前一个三角形的最后一个顶点并添加一个新顶点。 | #### 3. 背面剔除 在3D渲染中，有许多问题可能导致对象无法显示，常见的问题包括未启用3D加速、忘记在`DrawingSurface`后面放置纯黑色背景、相机指向错误方向、相机距离对象过近或过远以及未在BasicEffect对象中启用顶点着色等。此外，如果以逆时针顺序定义顶点，而不是顺时针顺序，对象也会消失，这是因为Silverlight使用背面剔除技术来移除看起来是对象背面的表面。 如果遇到背面剔除问题，可以通过以下代码关闭它： ```csharp device.RasterizerState = new RasterizerState() { CullMode = CullMode.None }; ``` 还可以将渲染切换到线框模式，以便更清楚地看到场景中不同对象的重叠情况： ```csharp device.RasterizerState = new RasterizerState() { FillMode = FillMode.WireFrame }; ``` #### 4. 缩放绘图 在许多应用中，我们希望允许用户调整浏览器窗口大小，并相应地缩放3D绘图。实现此技术的步骤如下： 1. 从页面标记中的`DrawingSurface`控件中移除硬编码的`Width`和`Height`属性。 2. 响应`DrawingSurface`或其容器的`SizeChanged`事件，并适当调整投影： ```csharp private void DrawingSurface_SizeChanged(object sender, SizeChangedEventArgs e) { float aspectRatio = (float)e.NewSize.Width / (float)e.NewSize.Height; Matrix view = Matrix.CreateLookAt(new Vector3(0, 0, 5), Vector3.Zero, Vector3.Up); Matrix projection = Matrix.CreatePerspectiveFieldOfView(MathHelper.PiOver4, aspectRatio, 1, 10); effect.Projection = view * projection; } ``` 3. 触发实际的重绘操作，在`drawingSurface_Draw`方法末尾调用`e.InvalidateSurface()`： ```csharp private void drawingSurface_Draw(object sender, DrawEventArgs e) { ... e.InvalidateSurface(); } ``` #### 5. 绘制立方体 在掌握了单个三角形的绘制后，我们可以尝试绘制更复杂的形状，如立方体。绘制立方体的基本步骤与绘制单个三角形类似： 1. 定义成员字段来存储顶点缓冲区和效果对象： ```csharp private VertexBuffer vertexBuffer; private BasicEffect effect; ``` 2. 在页面显示之前填充顶点缓冲区，通常在构造函数中调用`PrepareDrawing()`方法。在该方法中，首先定义所需的颜色： ```csharp private void PrepareDrawing() { Color colorRed = new Color(255, 0, 0); Color colorBlue = new Color(0, 255, 0); Color colorGreen = new Color(0, 0, 255); Color colorWhite = new Color(255, 255, 255); ... } ``` 3. 定义三角形所需的点，一个立方体需要八个点，分别用于前面和后面的正方形： ```csharp Vector3 topLeft = new Vector3(-1, 1, 0); Vector3 bottomLeft = new Vector3(-1, -1, 0); Vector3 topRight = new Vector3(1, 1, 0); Vector3 bottomRight = new Vector3(1, -1, 0); Vector3 topLeftFront = ne ```