CanvasView3D

code :: my native papervision3D flex component

after my last post about creating an actionscript project that extends the basic view, i got to thinking... my flex canvas3D is getting a bit outdated. these days i just make canvas then add my viewport3D or a basicView to it. so why not create a new UIcomponent that extends basicView? why not indeed...

introducing my new class, called CanvasView3D! this little flex gem makes setting up papervision3D in an MXML setting simple. by creating the CanvasView3D component, and initializing it to a local variable, you will automatically create a scene3D, camera3D, viewport3D, and a basicRenderEngine, all the core components of any PV3D application! 

first things first, add a new xml namespace to your flex application
in this case, its going to be com.fontvirus.* 

<mx:Application
      xmlns:mx="http://www.adobe.com/2006/mxml" 
      xmlns:xx="com.fontvirus.*"
      layout="absolute"
      applicationComplete="init3D()">
</mx:Application>

now that we have a new custom namespace called "xx", we need to make a new CanvasView3D object.

<xx:CanvasView3D id="paperCanvas" top="0" bottom="0" left="0" right="0"/>

the top, bottom, left, and right properties dictate the placement and size of the CanvasView3D object. in this case it will be stretched to fit the full screen size. but there are other properties you can set here as well (or in your as3 code), such as:

<xx:CanvasView3D autoScaleMode="true" interactivity="false" autoClipMode="true" autoCullMode="true"/>

now that our CanvasView3D is setup and ready in our MXML, we need to instantiate it actionscript code. this step is just as easy as the rest, just declare a new basicView object and set it to your CanvasView3D’s view property.

var view:BasicView = paperCanvas.view;

now we have access to all of the bacicView objects just like if we would have created one then added it to a UIcomponent, etc, etc... now you have a choice to setup new variables for each of your objects or just use them through the basicView.

var cam:Camera3D = paperCanvas.view.camera;
cam.zoom = 10;
cam.focus = 2;
var scene:Scene3D = paperCanvas.view.scene;
scene.addChild(new DisplyObject3D());
var viewport:ViewPort3D = paperCanvas.view.viewport.
var num = viewport.lastRenderList.length;
var renderer:BasicRenderEngine = paperCanvas.view.renderer;
render.renderScene(cam, scene, view);

OR

view.camera.zoom = 10;
view.camera.focus = 2;
view.scene.addChild(new DisplyObject3D());
var num = view.viewport.lastRenderList.length;
view.renderer.renderScene(view.camera, view.scene, view.viewport);

personally i think the second coding style is much more concise and simplistic. but that's just one thing that is so great about object oriented languages, there's 10000 ways to do the same thing. its all about circumstance, and necessity.

i hope this is useful to some one.

download the CanvasView3D class
here's a simple little demo
and some code to get you started