[转]Stage3D 翻译系列之三: Stage3D是如何工作的（完结篇）

作者：蝈蝈  发表于：2012年05月10日 18:03  分类：Flash 3D  417 views 

接上篇，咱们书归正传

Stage3D： 舞台背后的舞台（The stage behind the stage）

    在本节你将了解Stage3D如何融入到Flash显示模型中。

    Flash是基于舞台（Stage）这个概念而设计的。Flash中的显示对象被称为 DisplayObject，而每个DisplayObject都被置到舞台（Stage）中。所以，舞台是所有显示对象的容器，是所有2D对象的根。

    当Adobe引入3D渲染的概念后，专门为3D渲染添加了一组新的舞台，这些特殊的舞台被称为：Stage3D（见图3）

 

图3：了解Stage3D如何显示在舞台背后的舞台上

    在Flash主舞台后边有一系列的Stage3D舞台。这意味着，用Stage3D创建的3D内容都在每一个具体的Stage3D矩形视图中渲染，然后Flash中的普通2D内容在其上出现。从这里可以清楚的看到你如何将两个世界最好的部分都拿了过来：你可以用硬件加速来渲染3D场景，然后将2D内容（如游戏的UI）放在上边。UI部分可以用强大而灵活的Flash来创建，而不用找那些自定义的UI生成工具。

    你可以使用多个不同的Stage3D舞台，每个3D舞台都拥有自己的矩形视图。这意味着你可以在屏幕的一部分有一个矩形3D区域，而且可以添加更多个，然后将Flash 2D对象放在它们之上。所有的Stage3D舞台和StageVideo可以部分（甚至完全）重叠。然而，Stage3D的第一个版本不支持层与层之间的融合，所以，在层与层位置重叠的地方，你只能够看到最上面一层。

用ActionScript访问Stage3D

    为了用ActionScript访问Stage3D，您可以声明一个Stage3D的舞台，这些舞台以数组的形式存在，这些数组是Flash Stage的一部分。

    你可以像这样来编写代码：

var stage3D:Stage3D = stage.stage3Ds[0];

    Stage3D API中的主类并非Stage3D本身，而是一个叫Context3D的类。3D对象的渲染主要由靠它，其包括执行渲染所需的所有方法和属性。使用Stage3D主要是跟Context3D打交道。

    首先像下面代码所示，请求一个Context3D：stage.stage3Ds[0].addEventListener(           Event.CONTEXT3D_CREATE, initStage3D );

stage.stage3Ds[0].requestContext3D();

…

protected function initStage3D(e:Event):void

{

    context3D = stage.stage3Ds[0].context3D;

}

用顶点缓冲（Vertext Buffers）和索引缓冲（Index Buffers）来定义几何图形

    在Stage3D中，渲染的3D场景是由一组几何图形（3D面）组成。每个几何图形由一组三角形定义，而每个三角形又由一组顶点定义。

    描述几何图形的顶点被打包放置在一个叫做顶点缓冲区的结构中，这个结构中包含相关顶点的所有数据。把所有数据放在一块儿是为了接下来用一个脚本把它们上传至GPU的内存中。

    以下是定义顶点缓冲区的一个例子：

var vertices:Vector.<Number> = Vector.<Number>([

    -0.3,-0.3,0, 1, 0, 0, // x, y, z, r, g, b

    -0.3, 0.3, 0, 0, 1, 0,

    0.3, 0.3, 0, 0, 0, 1,

    0.3, -0.3, 0, 1, 0, 0]);

    首先，在一个向量（Vector）中定义所有的顶点。每个顶点除了包含位置信息外，还可以包含其它额外信息。向量中的顶点结构每一个值被称为顶点属性（Vertex Attributes）。顶点属性属性可以包含这样一些相关数据，这些数据指定此几何图形如何在渲染管道中渲染。例如：顶点颜色和纹理UV值坐标通常作为一个几何图形的顶点数据。

    在上面的例子中，vertices向量定义了4个顶点。每一行定义一个顶点，每个顶点包含两个顶点属性：顶点位置（每行的前三个数值）和顶点颜色（每行的后三个数值）。

    定义了这些顶点之后，你可以创建一个VertexBuffer3D实例。Stage3D中的VertexBuffer3D类将顶点缓冲数据包装起来，以便将数据传入GPU内存。

    如以下代码所示：

// 4 vertices, of 6 Numbers each

vertexbuffer = context3D.createVertexBuffer(4, 6);

// offset 0, 4 vertices

vertexbuffer.uploadFromVector(vertices, 0, 4);

    在Stage3D中，指定一个顶点缓冲并不足以定义一个几何图形，这是因为在Stage3D中3D面还没有定义成缓冲面。为了定义一个三角形，你必须指定三角形的3个顶点。所以，你需要额外的结构来索引这些顶点，将顶点缓冲数据组装为三角形，这个结构被称为索引缓冲（Index Buffer）。

    以上的顶点缓冲定义了4个顶点，想象我们用它来定义一个由两个三角形组成的正方形，只有顶点缓冲中的4个顶点不足以定义两个三角形。

    用以下的代码创建额外的顶点缓冲：

var indices:Vector.<uint> = Vector.<uint>([0, 1, 2, 2, 3, 0]);

    在以上的代码中，indices向量中的头三个数值代表第一个三角形由前边顶点缓冲区中的0、1和2顶点组成，接下来顶点2、3和0顶点组成第二个三角形。

    使用索引缓冲，你可以有效定义所需的三角形，进而组成几何图形。

    像顶点缓冲一样，索引缓冲也得包装到一个Stage3D特有的结构中，名为：IndexBuffer3D。用以下代码     将IndexBuffer3D上传至GPU：

// total of 6 indices. 2 triangles by 3 vertices each

indexBuffer = context3D.createIndexBuffer(6);

// offset 0, count 6

indexBuffer.uploadFromVector (indices, 0, 6);

这样，一个几何图形就定义好了

下面该看什么

    到这儿，你已经对Stage3D，一个Adobe发布的在Flash Player11中可以使用硬件3D加速渲染的强大API有了一个基本的了解。这个教程是用ActionScript编写Stage3D教程的第一个。下面的教程将介绍如何使用Stage3D着色器。

    你还可以访问一下在线资源学习Stage3D：

l  Flash Developer Center

l  Flash Builder Developer Center

l  Game development with Flash Developer Center

 

翻译原文：http://uh.9ria.com/space.php?uid=122781&do=blog&id=11911

本文固定链接: http://www.gisthink.com/blog/guoguogis/?p=329 | GUOGUOGIS