Alternativa3D – Hello World(2)

liu 撰写  

ok,上期讲到了怎么导入Alternativa3D上的例子,现在我们继续学习Alternativa3D的开发。

我将会依照http://docs.alternativaplatform.com/display/TDEN/Home中的 Tutorials 来继续我们这个专题。

你需要的开发环境是

  • Flex Builder 3
  • Alternativa3D的开发包(现在我用的版本是5.5.0,可能有些函数在不同的版本会有变化,因此请确保你的版本和我一样♥)

———————————————————低调的分割线——————————————————

(本文参照http://docs.alternativaplatform.com/display/TDEN/Home中的 Hello, Alternativa3D而写。)

在这个教程中,我们将一步一步学习如何在Alternativa3D中创建一个简单的3D场景。

第一步,在Flex Builder(Flash也是可以作为开发环境的)中创建一个名为HelloAlternativa3D的新项目。

注意两点

  • 项目为Action Script项目
  • 项目名称为“HelloAlternativa3D”,大小写不要错否则拷贝后面的代码可能会报错。

新建一个名为“HelloAlternativa3D”的Action Script工程

第二步,导入Alternativa3D的库文件,在工程属性中设置。也可以在创建工程师就设置好。

导入Alternativa3D的库文件

导入Alternativa3D的库文件

第三步,拷贝下面的代码到项目根目录的HelloAlternativa3D.as

HelloAlternativa3D.as
package {
 import alternativa.engine3d.controllers.CameraController;
 import alternativa.engine3d.core.Camera3D;
 import alternativa.engine3d.core.Object3D;
 import alternativa.engine3d.core.Scene3D;
 import alternativa.engine3d.display.View;
 import alternativa.engine3d.materials.WireMaterial;
 import alternativa.engine3d.primitives.Box;
 import alternativa.utils.FPS;

 import flash.display.Sprite;
 import flash.display.StageAlign;
 import flash.display.StageScaleMode;
 import flash.events.Event;

 [SWF(backgroundColor="#000000", frameRate="100")]

 public class HelloAlternativa3D extends Sprite    {

 private var scene:Scene3D;
 private var view:View;
 private var camera:Camera3D;
 private var cameraController:CameraController;
 private var box:Box;

 public function HelloAlternativa3D()    {
 addEventListener(Event.ADDED_TO_STAGE, init);
 }

 public function init(e:Event): void {
 removeEventListener(Event.ADDED_TO_STAGE, init);

 stage.scaleMode = StageScaleMode.NO_SCALE;
 stage.align = StageAlign.TOP_LEFT;

 // Creating scene
 scene = new Scene3D();
 scene.root = new Object3D();
 box = new Box(100, 100, 100, 3, 3, 3);
 box.cloneMaterialToAllSurfaces(new WireMaterial(1, 0xFFFFFF));
 scene.root.addChild(box);

 // Adding camera and view
 camera = new Camera3D();
 camera.x = 100;
 camera.y = -150;
 camera.z = 100;
 scene.root.addChild(camera);

 view = new View();
 addChild(view);
 view.camera = camera;

 // Connecting camera controller
 cameraController = new CameraController(stage);
 cameraController.camera = camera;
 cameraController.setDefaultBindings();
 cameraController.checkCollisions = true;
 cameraController.collisionRadius = 20;
 cameraController.lookAt(box.coords);
 cameraController.controlsEnabled = true;

 // FPS display launch
 FPS.init(stage);

 stage.addEventListener(Event.RESIZE, onResize);
 stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
 onResize(null);
 }

 private function onResize(e:Event):void {
 view.width = stage.stageWidth;
 view.height = stage.stageHeight;
 }

 private function onEnterFrame(e:Event):void {
 // User input processing
 cameraController.processInput();
 // Scene calculating
 scene.calculate();
 }
 }
}

先运行看看效果:)

3

试试 键盘上的“W、A、S、D”和“上、下、左、右”,还有空格和鼠标滚轮,别忘了加上Shift键。
—————————————————-朴素的分割线————————————————–
下面介绍一下代码:
  1. 创建场景

    首先我们传建一个场景并且添上一个方盒:

    // Create scene object. Scene is a container which have everything else inside.
    scene = new Scene3D();
    // Set root object for scene hierarchy. Root object coordinate system becomes scene global coordinate system.
    scene.root = new Object3D();
    // Create cube primitive
    box = new Box(100, 100, 100, 3, 3, 3);
    // Set material which draws primitive edges
    box.cloneMaterialToAllSurfaces(new WireMaterial(1, 0xFFFFFF));
    // Add primitive to a scene
    scene.root.addChild(box);
    
  2. 添加摄像机
    摄像机是必不可少的东东,这一步也是不可缺少的,初学Flash 3D时,最容易出现的错误就是模型或者场景没问题,但是摄像机方向有问题或者缩放比率有问题,导致找不到错误点

    // Create camera instance and set it's coordinates
    camera = new Camera3D();
    camera.x = 100;
    camera.y = -150;
    camera.z = 100;
    // Add camera to the scene
    scene.root.addChild(camera);
    // Create a view and connect it to the camera
    view = new View();
    addChild(view);
    view.camera = camera;
    

  3. 控制摄像机
    在Alternativa3D中,已经提供了很多控制控制摄像机的类(这里有介绍),现在我们先挑一个 alternativa.engine3d.controllers.CameraController
    用法如下

    // Create controller and connect camera
    cameraController = new CameraController(stage);
    cameraController.camera = camera;
    // Set default control keys
    cameraController.setDefaultBindings();
    // Turn on camera collision detection
    cameraController.checkCollisions = true;
    // Set collision detection radius for camera
    cameraController.collisionRadius = 20;
    // Aim camera at the cube primitive
    cameraController.lookAt(box.coords);
    // Activate camera controls
    cameraController.controlsEnabled = true;
    
  4. 最后的工作
    现在场景、摄像机、控制全都有了,我们把他们组装在一起
    public function HelloAlternativa3D() {
    
     //...
    
     // Initialize FPS display
     FPS.init(stage);
     // This function is for view size changes during player window changes
     addEventListener(Event.RESIZE, onResize);
     // This function enables user input processing and scene calculation every frame
     stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
     // Initial view size
     onResize(null);
    }
    
    private function onResize(e:Event):void {
     // Set view size equal to player window size
     view.width = stage.stageWidth;
     view.height = stage.stageHeight;
    }
    
    private function onEnterFrame(e:Event):void {
     // User input processing
     cameraController.processInput();
     // Scene calculating. Scene will be recalculated and all changes will be redrawed in camera.
     scene.calculate();
    }
    
最后附上我的工程文件:)
PS:建议你的Alternativa3D库文件放在D盘,就像下面这样,这样就不用修改工程文件里面的库文件配置了
D:\alternativa3d_5.5.0\
D:\alternativa3d_5.5.0\alternativa3d_fp9
D:\alternativa3d_5.5.0\alternativa3d_fp10

5 条评论

  1. 发表了 2009年09月16日 在 10:47 下午 | 永久链接 |

    看上去很爽,国庆研究一下

    • Daniel Yang
      发表了 2009年09月17日 在 10:07 上午 | 永久链接 |

      如何在flex project下用?

      • liu
        发表了 2009年09月17日 在 8:50 下午 | 永久链接 |

        可以的,这里有例子
        http://blog.ityao.com/archives/415

        • Daniel Yang
          发表了 2009年09月17日 在 9:51 下午 | 永久链接 |

          我感觉这块不太好理解:

          			// Creating scene
          			scene = new Scene3D();
          			scene.root = new Object3D();
          
          			// Adding camera and view
          			camera = new Camera3D();
          			camera.x = 100;
          			camera.y = -150;
          			camera.z = 100;
          			scene.root.addChild(camera);
          
          			view = new View();
          			addChild(view);
          			view.camera = camera;
          

          scene为什么不加到view上,中间偏偏要一个camera对象?
          Object3D—>Scene—->Camera—->View—->UIComponent…
          似乎有点多。

          • liu
            发表了 2009年09月18日 在 8:00 上午 | 永久链接 |

            可能是把scene当作MVC中的M,View当作MVC中的V,Camera当作MVC中的C。
            看不到源代码,只有瞎猜了:)

发表评论

你必须在 登录 后才能发表评论.