第一次使用stage3D创建一个图形流程

stage3D成像的具体流程一般我们分为：准备阶段和在每一帧中的渲染阶段

一、准备阶段：

1、初始化stage3D

2、对舞台进行一些简单的设置

3、准备模型数据（通过数组形式存储）

• 准备存放顶点信息的数组
• 准备存放顶点的索引数组

4、把模型数据上传给显卡(通过顶索引缓冲IndexBuffer3D和顶点信息缓冲VertexBuffer3D上传)

5、把纹理上传给显卡

6、创建着色器

• 创建顶点着色器
• 创建片段着色器
• 合并着色器提交给显卡

7、准备摄像机

8、启动主循环进行对模型数据在每一帧中的渲染

二、渲染阶段

1、清空缓冲区

2、给着色器传入参数，调用着色器

• 调整模型的transform
• 把主矩阵传给顶点着色器的vc0（主矩阵即为存放包括模型矩阵、摄像机矩阵、视场矩阵，vc0为顶点着色器的常量寄存器，编号自己取）
• 将顶点位置和大小等信息传给顶点着色器的特殊寄存器va0
• 将顶点的颜色信息（rgba）传给顶点着色器的特殊寄存器的va1
• 将顶点的UV信息传给顶点着色器的特殊寄存器的va2
• 将模型的颜色的指定的信息传给片段着色器的常量寄存器的fc0
• 将材质上传给片段着色器的特殊寄存器fs0

3、画三角形

4、准备下一个缓冲区

以上步骤代码实现如下：（黄色背景的为准备阶段的操作、红色背景的为渲染阶段的操作）

需注意在传入的图片的大小必须是2的幂次

package
{
    import com.adobe.utils.AGALMiniAssembler;
    import com.adobe.utils.PerspectiveMatrix3D;
    
    import flash.display.Bitmap;
    import flash.display.BitmapData;
    import flash.display.Sprite;
    import flash.display.Stage3D;
    import flash.display3D.Context3D;
    import flash.display3D.Context3DProgramType;
    import flash.display3D.Context3DTextureFormat;
    import flash.display3D.Context3DVertexBufferFormat;
    import flash.display3D.IndexBuffer3D;
    import flash.display3D.Program3D;
    import flash.display3D.VertexBuffer3D;
    import flash.display3D.textures.Texture;
    import flash.events.Event;
    import flash.geom.Matrix;
    import flash.geom.Matrix3D;
    import flash.geom.Vector3D;
    
    public class Stage3DTest002_Texture extends Sprite
    {
        //纹理所需的图片
        [Embed(source="Delicious.png")]private var Img1:Class;
        [Embed(source="meinv.jpg")]private var Img2:Class;
        /******核心3D引擎*********/
        private var context3D:Context3D;
        
        /******模型数据**********/
        private var vertexIndexData:Vector.;
        private var vertexData:Vector.<Number>;
        
        /******顶点索引的缓冲（通过这个东西上传给GPU）**********/
        private var indexBuffer:IndexBuffer3D;
        private var vertexBuffer:VertexBuffer3D;
        
        /**定义自己的着色器*/
        private var shaderProgram:Program3D;

        /**摄像机所需的矩阵**/
        private var modelMatrix:Matrix3D = new Matrix3D();//用于描述模型的变化transform
        private var viewMatrix:Matrix3D = new Matrix3D();//用于描述摄像机的transform
        private var vohMatrix:PerspectiveMatrix3D = new PerspectiveMatrix3D();//视场矩阵
        private var mainMatrix:Matrix3D = new Matrix3D();//上述三个矩阵的合并
        
        /**********颜色***************/
        private var col:Vector.<Number> = new Vector.<Number>();
        /************纹理************/
        private var texture1:Texture;
        private var texture2:Texture;
        public function Stage3DTest002_Texture()
        {
            /*******************************************1初始化stage3D*********************************************************************/
            var stage3D:Stage3D = stage.stage3Ds[0];
            stage3D.addEventListener(Event.CONTEXT3D_CREATE,onContext3DCreated);
            stage3D.requestContext3D();
        }
        
        protected function onContext3DCreated(event:Event):void
        {
            //3D引擎创建完成
            //进行相关的设置
            /********************************************2进行一些简单的设置******************************************************************/
            var stage3D:Stage3D = event.target as Stage3D;
            //或得context3D，因为所有实际功能，比如上传、渲染全部都是调用的context3D的方法
            context3D = stage3D.context3D;
            //启用错误检查(以牺牲效率为代价，在控制台打印出AGAL的运行信息)
            context3D.enableErrorChecking = true;
            //开启一块缓冲区
            context3D.configureBackBuffer(stage.stageWidth,stage.stageHeight,1);//
            /********************************************3准备模型数据************************************************************************/
            initData();
            /********************************************4把模型数据上传给显卡******************************************************************/
            indexBuffer = context3D.createIndexBuffer(vertexIndexData.length);
            indexBuffer.uploadFromVector(vertexIndexData,0,vertexIndexData.length);
            vertexBuffer = context3D.createVertexBuffer(vertexData.length / 9,9);
            vertexBuffer.uploadFromVector(vertexData,0,vertexData.length /9);
            /********************************************5把纹理上传***************************************************************************/
            texture1 = uploadTexture(new Img1());
            texture2 = uploadTexture(new Img2());
            /*********************************************6创建着色器**************************************************************************/
            initShader();
            
            /**********************************************7准备摄像机**************************************************************************/
            initCamear();
            
            //设定颜色
            col.push(1,1,1,1);//红色
            modelMatrix.appendRotation(-90,Vector3D.Z_AXIS);
            /***********************************************8启动渲染循环***********************************************************************/
            stage.addEventListener(Event.ENTER_FRAME , update);
        }
        
        /**上传纹理*/
        private function uploadTexture(img:Bitmap):Texture
        {
            var texture:Texture = context3D.createTexture(img.width,img.height,Context3DTextureFormat.BGRA,true);
            //上传纹理
            texture.uploadFromBitmapData(img.bitmapData);
            //mip映射
            var w:int = img.width;
            var h:int  = img.height;
            var level:int = 0;
            var matrix:Matrix = new Matrix();
            //创建一个bitmapData来绘制每个级别的mip映射像素
            var bmd:BitmapData = new BitmapData(w,h,true,0);
            while(w > 1 && h > 1){
                bmd.draw(img,matrix,null,null,null,true);
                texture.uploadFromBitmapData(bmd,level);
                trace(bmd.width+" "+bmd.height+" "+level);
                
                w >>= 1;
                h >>= 1;
                
                matrix.scale(0.5,0.5);
                level++;
                //清空，然后创建一个原来的一半大小的bitmapdata
                bmd.dispose();
                bmd = new BitmapData(w,h,true,0);
            }
            return texture;
        }
        
        protected function update(event:Event):void
        {
            /********************************************1清空当前的缓冲区***************************************************************/
            context3D.clear();
            /********************************************2给着色器传入参数，调用着色器****************************************************/
            context3D.setProgram(shaderProgram);//指定着色器，（着色器可能有多个，一个负责。。。，另一个负责..）
            
            this.mainMatrix.identity();//单位化此矩阵，去掉所有的transform信息，转化为单位矩阵
            mainMatrix.append(this.modelMatrix);
            mainMatrix.append(this.viewMatrix);
            mainMatrix.append(this.vohMatrix);
            
            //让图形动起来

            modelMatrix.appendRotation(1,Vector3D.Z_AXIS);            modelMatrix.appendRotation(1,Vector3D.Y_AXIS);            modelMatrix.appendRotation(1,Vector3D.X_AXIS);
            
            //把这个矩阵传给顶点着色器的vc0(第0个常量寄存器)
            context3D.setProgramConstantsFromMatrix(Context3DProgramType.VERTEX,0,mainMatrix,true);
            //va0传值.给顶点着色器的第0个传入定点数据
            context3D.setVertexBufferAt(0,vertexBuffer,0,Context3DVertexBufferFormat.FLOAT_3);
            //给顶点着色器的第1个va寄存器
            context3D.setVertexBufferAt(1,this.vertexBuffer,5,Context3DVertexBufferFormat.FLOAT_4);
            //给顶点着色器的第2个va寄存器传入UV值
            context3D.setVertexBufferAt(2,vertexBuffer,3,Context3DVertexBufferFormat.FLOAT_2);
            //给片段着色器的fc0传值
            col.splice(0,4);
            col.push(Math.random(),Math.random(),Math.random(),Math.random());
            context3D.setProgramConstantsFromVector(Context3DProgramType.FRAGMENT,0,col);
            //上传纹理fs0
            context3D.setTextureAt(0,texture1);
            //上传纹理fs1
            context3D.setTextureAt(1,texture2);
            /*************************************************3画三角形*********************************************************************/
            context3D.drawTriangles(indexBuffer,0,vertexIndexData.length/3);
            /*************************************************4准备下一个缓冲区**************************************************************/
            context3D.present();
        }
        
        /**
         * 初始化摄像机
         * */
        private function initCamear():void
        {
            //让摄像机向后移
            viewMatrix.appendTranslation(0,0,-10);
            //利用voh对场景进行裁剪
            vohMatrix.perspectiveFieldOfViewRH(Math.PI/4,stage.stageWidth/stage.stageHeight,0.01,100);
        }
        
        /**
         * 创建一个简单的着色器
         * 1.创建顶点着色器
         * 2.创建片段着色器
         * 3.合并为一个着色器提交给显卡
         * */
        private function initShader():void
        {
            /**汇编语言
             * 操作码  目标寄存器，源寄存器，.......源寄存器
             * 常用操作码：mov nul add sub sin cos 
             * 特殊操作码：m33 m44 m34(矩阵乘法) tex(纹理采样)
             * */
                    
            //1.创建顶点着色器
            var vertaxShader:AGALMiniAssembler = new AGALMiniAssembler();
            vertaxShader.assemble(
                Context3DProgramType.VERTEX,
                "m44 op,va0,vc0\n"+    //"m44 vt0,va0,vc0"+
                                    //"mov op,vt0\n"这两句就相当于下面一句
                                     //让第0个va着色器和第0个vc着色器进行m44运算（4*4矩阵乘法 ）
                                        //va寄存器：传入顶点的位置
                                        //vc寄存器：传入一些全局变量，比如矩阵
                                        //op顶点寄存器的最终目的地
                "mov v0,va1\n"+
                "mov v1,va2"
            );
            //顶点着色器，每个顶点都会执行一次，也就是说，在每次执行时，va0就是当前正在处理的这个顶点的位置
            //1.创建片段着色器
            var fragmentShader:AGALMiniAssembler = new AGALMiniAssembler();
            fragmentShader.assemble(
                Context3DProgramType.FRAGMENT,
                "tex ft0,v1,fs0<2d,repeat>\n"+  //添加纹理
                "mul ft1,v1,fc0\n"+
                "tex ft2,ft1,fs1\n"+
                "mul ft3,ft0,fc0\n"+
                "mul oc,ft2,ft3"
               );
            //片段着色器为每个像素都执行一次
            //合并为一个着色器提交给显卡
            shaderProgram = context3D.createProgram();
            shaderProgram.upload(vertaxShader.agalcode , fragmentShader.agalcode);
        }
        
        /**
         * 准备模型数据
         * 包含两个部分，定点数据和定点索引数据，在实际开发中，这些数据是来自于3Dmax工具到处 
         * */
        private function initData():void
        {
            //存放顶点的数据
            vertexData = new Vector.<Number>();
            vertexData.push(
                //x   y   z     u   v    r   g   b   a 
                /**
                 * 三角形
                 * */
//                  1 ,1 ,0,    1 ,0,   0, 0 ,0 ,1,   //0
//                  -1,1 ,0,    0 ,0,   0, 0 ,0 ,0,   //1
//                  -1,-1,0,    0 ,1,   0, 0 ,0 ,0    //2
                /**正方形*/
                  -3 , 5 , 0,    0 , 0,   1 , 0 , 0 , 1,     //0
                   5 , 3 , 0,    0 , 1,   0 , 1 , 0 , 1,     //1
                   5 ,-3 , 0,    1 , 1,   0 , 0 , 1 , 1,     //2
                  -3 ,-5 , 0,    1 , 0,   0 , 0 , 1 , 1         //3
                  /**正方体*/
//                  -1 , 1 , -1,    1 , 0,   1 , 0 , 0 , 1,     //0
//                  1  , 1 , -1,    0 , 0,   0 , 1 , 0 , 0,     //1
//                  -1 ,-1 , -1,    0 , 1,   0 , 0 , 1 , 0,     //2
//                  1  ,-1 , -1,    1 , 1,   0 , 0 , 0 , 0,     //3
//                  1  , -1 , 1,    1 , 0,   0 , 0 , 0 , 1,     //4
//                  1  , 1 ,  1,    0 , 0,   0 , 0 , 0 , 0,     //5
//                  -1 , 1 ,  1,    0 , 1,   0 , 0 , 0 , 0,     //6
//                  -1 ,-1 ,  1,    1 , 1,   0 , 0 , 0 , 0      //7
            );
            //存放索引
            vertexIndexData = new Vector.();
//            vertexIndexData.push(0,1,2);
            vertexIndexData.push(
                /**正方形**/
                0 , 1 , 2,
                0 , 2 , 3
                /**正方体*/
//                0 , 1 , 3,
//                0 , 3 , 2,
//                1 , 3 , 4,
//                1 , 4 , 5,
//                1 , 0 , 6,
//                1 , 6 , 5,
//                4 , 5 , 6,
//                4 , 6 , 7,
//                0 , 2 , 7,
//                0 , 7 , 6,
//                2 , 3 , 4,
//                2 , 4 , 7
            );
        }
    }
}

转载于:https://www.cnblogs.com/xhz-blog/p/3409609.html