因为看到一篇好文章,Getting Started with Adobe Flex and Away3D,按照他的步骤,做出一个away3D的例子。下面介绍一下。
要谈到Flex上的3D开发,away3d是个不错的选择,可以看一下下面的这个例子:
好的,如何能实现这个例子呢?
一开始,我们需要得到一个最新的Away3D的版本,我们可以到http://www.away3d.com/download 上去下载她,在FlexBuilder3环境中,新建一个 Flex Project ,起一个名字,例如:Away3D,然后我们点击Finish。
然后,我们将下载之后的zip文件解压缩,里面会有一个叫做away3d的文件和一个nochump的这两个文件,我们把上面提到的那两个文件拷贝到这个Away3D的src目录底下。
然后,我们要将我们的mxml代码修改为如下的形式:
Xml代码
- <?xml version="1.0" encoding="utf-8"?>
- <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
- width="500" height="400" >
- <mx:Panel width="100%" height="100%" title="Our 3D Canvas"
- backgroundColor="#D1F0FF">
- </mx:Panel>
- </mx:Application>
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="500" height="400" > <mx:Panel width="100%" height="100%" title="Our 3D Canvas" backgroundColor="#D1F0FF"> </mx:Panel> </mx:Application>
然后我们需要新建一个flex类,他叫做FlexView3D,代码如下所示:
Java代码
- package
- {
- import mx.core.UIComponent;
-
- public class FlexView3D extends UIComponent
- {
- public function FlexView3D()
- {
- super();
- }
- }
- }
package { import mx.core.UIComponent; public class FlexView3D extends UIComponent { public function FlexView3D() { super(); } } }
然后我们需要修改我们的mxml为:
Java代码
- <?xml version="1.0" encoding="utf-8"?>
- <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:local="*"
- layout="absolute" width="500" height="400">
- <mx:Panel width="100%" height="100%" title="Flex 3D View"
- backgroundColor="#D1F0FF">
- <local:FlexView3D width="100%" height="100%" />
- </mx:Panel>
- </mx:Application>
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:local="*" layout="absolute" width="500" height="400"> <mx:Panel width="100%" height="100%" title="Flex 3D View" backgroundColor="#D1F0FF"> <local:FlexView3D width="100%" height="100%" /> </mx:Panel> </mx:Application>
然后我们将我们将之前的那个FlexView3D 类修改为:
Java代码
- package
- {
- import away3d.core.material.BitmapFileMaterial;
- import away3d.core.math.Number3D;
- import away3d.core.scene.View3D;
- import away3d.objects.Cube;
-
- import flash.events.Event;
-
- import mx.core.UIComponent;
-
- public class FlexView3D extends UIComponent
- {
- private var view:View3D;
-
- private var sotcCube:Cube;
-
- public function FlexView3D()
- {
- super();
- this.addEventListener(Event.ENTER_FRAME, onFrameEnter);
- }
-
- override protected function createChildren():void
- {
- super.createChildren();
-
- if(!this.view)
- {
- this.view = new View3D();
-
- this.view.camera.moveTo(new Number3D(0, 0, -1500));
- this.view.camera.lookAt(new Number3D(0, 0, 0));
- }
- this.addChild(this.view);
-
- if(!this.sotcCube)
- {
- this.sotcCube = new Cube({name: "cube", size: 250});
- this.sotcCube.material = new BitmapFileMaterial("sotc.jpg");
- }
- this.view.scene.addChild(this.sotcCube);
- }
-
- override protected function updateDisplayList(
- unscaledWidth:Number, unscaledHeight:Number):void
- {
- super.updateDisplayList(unscaledWidth, unscaledHeight);
-
- if(this.width / 2 != this.view.x)
- this.view.x = this.width / 2;
- if(this.height / 2 != this.view.y)
- this.view.y = this.height / 2;
- }
-
- private function onFrameEnter(event:Event):void
- {
- if(this.view && this.view.stage)
- {
- this.sotcCube.rotationX += .7;
- this.sotcCube.rotationY += .5;
- this.sotcCube.rotationZ += .4;
-
- this.view.render();
- }
- }
- }
- }
评论