FlashLabWeb Experiments by Brian Wiltshire

I want to share a really nice resource on the Adobe site called The Adobe cookbook. Find, share, and comment on code with the developer community. It basically covers most of their apps. Although still in the startup stage, there’s really a lot of helpful code snippets. So head over and start creating some snippets.

I found this very cool 3D app, built with Papervision3D and using Tweener for animation.

Go have a skate at www.paperskate3d.com

Get the Source files here (this time under CC license, not MIT).

Sandy is an intuitive and user-friendly 3D open-source library developed in Actionscript 2.0 and now Actionscript 3.0 for Adobe Flash.

This 3D engine main features are :

Viewing volume clipping for perfect rendering.

Advanced shading effects such as (Phong, Gouraud, CelShading, flat shading).

Material system to easily change your objects appearance. Several material are available allowing to create transparent faces, bitmap texture and video texture as webcam video stream.

Advanced and easy object management allowing some fantastic possibilities during your creations (scaling, rotation, translation, tween, etc.)

Advanced camera management ( rotation, motion on linear or bezier-curve path, movements, etc.)
Complex object loading thanks to the .ASE and .WRL files parser , but also Collada and 3DS files for AS3, (files generated by several 3D object modeling packages such as 3D Studio Max or Blender)
Flash player 7 to 9 compatibility.

Both MTASC and Macromedia compilers compliant for AS2 and Flash CS3 and FlexBuilder for AS3 versions.

Several 3D primitives, allowing fast and parameterized object creation without any 3D modelisation knowledge.

Away3d 2.1 bring some welcome assistance to getting starting with the engine – a revamped documentation section (now included in the svn) and a brand new demos download containing code examples which will continue to be updated as more are written.

As well as this, there are some updates to the engine that should help with general use, including:

• Simplified events model – listeners can be added using the supplied methods or with the standard addEventListener method of the EventDispatcher.
• Event types listed as static classes.
• Simplified BitmapRenderSession use.
• Object primitives have dynamic property setters that can be adjusted after instantiation.
• Merged AlphaBitmapMaterial class (all bitmapmaterials now support alpha and color properties).
• Dot3 and Enviro materials take the bitmap for shading maps as a required argument.
• Improved material access on individual sides of the cube primitive

plus the usual bug fixes and housekeeping updates.

As usual there is a new tag in the googlecode svn, and a new download zip in the downloads section.

Something else that is probably worth drawing attention to is the issues section of the googlecode repository. Our mailing list has been very successful at being used for bug reports in the past, but to prevent any future reports from being accidentally overlooked, we would urge everyone to start logging their bugs in this list.

Also, for those wanting to find a few more tutorials for Away3d, be sure to have a look at the External Site section of the tutorials page.

Enjoy the new release!

As you probably know, Flash is a 2D program. However, there are a handful of open source 3D engines written in actionscript that allow real time 3D environments to be rendered within the flash player. Among these, is Papervision3D, which is probably the most powerful and widely adopted of the engines available.

In this tutorial, we will create a simple 3D gallery for a few photos. Before you get started, you will need to download Papervision3D, and make sure you have a class path within flash pointing to it’s location on your computer.

1. Import Papervision

The first step is to include all of the necessary Papervision3D classes in our file.

import org.papervision3d.scenes.*;
import org.papervision3d.cameras.*;
import org.papervision3d.objects.*;
import org.papervision3d.materials.*;

2. Create a container

In order to properly set up our scene, we need to first create a Sprite that will contain our 3D objects. And since we want our group of photos to be in the center of the stage, we set the x an y properties to half of the stage width and height.

var container:Sprite = new Sprite();
container.x = stage.stageWidth * 0.5;
container.y = stage.stageHeight * 0.5;
addChild(container);

3. Set up the scene

Here we will use two of Papervisions’s classes, one to create the scene and the other to create a camera. The zoom property of the camera is self explanatory…the higher the number, the tighter the zoom.

var scene:Scene3D = new Scene3D(container);
var camera:Camera3D = new Camera3D();
camera.zoom = 6;

4. Create the material

Import three photos into the Flash library and make sure to enable “Export for ActionScript” on each. Then assign each one to a material.

var mat1:BitmapAssetMaterial = new BitmapAssetMaterial("cake1");
mat1.smooth = true;
mat1.oneSide = false;

var mat2:BitmapAssetMaterial = new BitmapAssetMaterial("cake2");
mat2.smooth = true;
mat2.oneSide = false;

var mat3:BitmapAssetMaterial = new BitmapAssetMaterial("cake3");
mat3.smooth = true;
mat3.oneSide = false;

5. Make our photos

Papervision has several built in objects. For our photos we are going to use the plane. When creating a new instance of the Plane object, you need to pass in several parameters. The first is the material, which we created in the precious step. The second and third is the width and height. The final two parameters are the horizontal and vertical spans of the object. Use at least 3 for this. Anything less will cause your photo to slightly warp as it moves.

var photo1:Plane = new Plane(mat1, 246, 370,3,3);
scene.addChild(photo1);
photo1.x =-190;
photo1.y =-10;
photo1.z =-150;

var photo2:Plane = new Plane(mat2, 370, 253,3,3);
scene.addChild(photo2);
photo2.x =190;
photo2.y =-150;

var photo3:Plane = new Plane(mat3, 370, 253,3,3);
scene.addChild(photo3);
photo3.x = 190;
photo3.y = 150;
photo3.z =-90;

6. Render the scene

The final step is to render our scene. We could just call scene.renderCamera(camera); but that would only render the scene one time and nothing would be animated. So instead, we create an ENTER_FRAME event that changes the position of the camera based on the mouse position, and renders the scene.

addEventListener(Event.ENTER_FRAME, render);

function render(e:Event):void
{
  camera.x += (((stage.mouseX-(stage.stageWidth * .5))*2)-camera.x )*.05;
  camera.y += (((stage.mouseY-(stage.stageHeight*.5))*2)-camera.y )*.05;
  scene.renderCamera(camera);
}

Papervision is a High performance 3D engine for Flash 8 and Flash 9. Papervision3D is licensed under the MIT open source license. With Flash Player 10 in Beta release you can only imagine the performance Papervision will have on the final release.

What is Papervision3D?

Papervision3D is an open source 3D engine for the Flash platform.

Who are the developers?

Papervision3D is written and maintained by a small core team, and contributed to by its ever-growing community. Papervision3D entered Public Beta on July 7th, 2007.

You can download the latest revision from the SVN repository.

Check out http://blog.papervision3d.org for more information. I will post some updates and examples as soon as i get a chance. This will definitely be a major player in the world of Flash3D.