Flex + Papervision3D 开发3DFlash学习笔记（一）

托经济危机的福，终于可以偷闲学习点3D知识

 

在网上随便搜了几下，3D引擎还真是不少，最后决定使用Papervision3D，主要是因为这个是开源的，并且有很多专门的论坛。

 

Flex Buider下载地址：http://www.adobe.com/cfusion/entitlement/index.cfm?e=flexbuilder3

目前最新版本为：3.0.2

 

Papervision3D 下载地址：http://code.google.com/p/papervision3d/downloads/list

目前最新版本为：2.1

 

今天的目标是：建立一个3D图形

 

看网上大多建立的是ActionScript工程，不是很喜欢，我习惯使用图形界面进行开发，然后使用脚本进行动态处理。

 

首先，建立Flex工程，取名为First3D，点击下一步，默认的输出路径就可以，点击下一步，在Library Path标签下，点击添加SWC，然后选择下载的那个Papervision3D_2.1.920.swc文件，点击完成，工程目录自动创建完成。

 

然后，在src下增加一个MXML Component组件，取名Ball3D，Based On Canvas。

 

在Ball3D.mxml中添加如下代码（注意:开始时的那个initialize属性）：

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300" initialize="onLoad()"> <mx:Script> <!--[CDATA[ import org.papervision3d.objects.primitives.Sphere; import org.papervision3d.materials.WireframeMaterial; import org.papervision3d.objects.DisplayObject3D; import org.papervision3d.core.proto.MaterialObject3D; import org.papervision3d.render.BasicRenderEngine; import org.papervision3d.cameras.Camera3D; import org.papervision3d.scenes.Scene3D; import org.papervision3d.view.Viewport3D; private var _view:Viewport3D = new Viewport3D(500,400); private var _scene:Scene3D; private var _camera:Camera3D; private var render:BasicRenderEngine = new BasicRenderEngine(); private var _material:MaterialObject3D; private var _displayObj:DisplayObject3D; public function onLoad():void { // 创建3D舞台的容器 this.rawChildren.addChild(_view); // 创建3D舞台 _scene = new Scene3D(); // 创建摄像头 _camera = new Camera3D(); _camera.z = -230; _camera.zoom = 5; // 创建一个线框材质 _material = new WireframeMaterial(0x000000); // 创建一个球体 _displayObj = new Sphere(_material, 200, 50, 50); // 将球体放到舞台中 _scene.addChild(_displayObj); // 增加ENTER_FRAME事件，主要是为了能让球动起来 this.addEventListener(Event.ENTER_FRAME, OnEnterFrame); } public function OnEnterFrame(event:Event):void { // 给球体一个角度变化 _displayObj.rotationX += 3; _displayObj.rotationY += 3; // 渲染图形 render.renderScene(_scene, _camera , _view); } ]]--> </mx:Script> </mx:Canvas>
 

接着打开First3d.mxml，在设计模式下将Ball3D拖放到合适的位置，这样就基本完成了。点击执行，看下效果吧~~~

 

以下就是效果图，目标达成！

 

Flash演示地址：http://www.yongyuan5288.com/FlashDemo/First3D.swf