因为看到一篇好文章,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 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,代码如下所示:
package
{
import mx.core.UIComponent;
public class FlexView3D extends UIComponent
{
public function FlexView3D()
{
super();
}
}
}
然后我们需要修改我们的mxml为:
<?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 类修改为:
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();
}
}
}
}
然后我们运行一下,看看是否出现了一个3D的旋转的立方体?(代码中的图片可以放上自己找的图片然后rename it)。