If you have used custom classes in flash before, you will already be familiar with importing and utilizing those classes. One of the these classes is called Papervision and it allows you to code 3D features in Flash using ActionScript3. You can download the classes necessary to run Papervsion from their google code site. DOWNLOAD
Once you have downloaded the zip file, extract it. Then create a new folder anywhere outside that zip folder, to store your custom ActionScript classes. Inside of the zip folder copy the “org” folder (inside “src”) into the new folder you created for classes. Now open up Flash CS3. Before you begin the project go to “Edit” and then “Preferences”. Choose the category ActionScript and the ActionScript 3 Settings. Then click the crosshair (browse) and choose the folder that you created (it should be one level above the “org” folder.)

IPB Image

Now comes the fun part. Create a new ActionScript 3 document and open up your web browser or “My Pictures” folder. Bring about 10 or so images onto the stage of your project and make sure that you scale them down to fit on the stage.
Once you are satisfied with the images that you have chosen, arrange them however you like, then select them all. Convert to symbol(F8) and make sure that the registration is set to the top left and that Movie Clip is chosen. Name it anything that you want and click “OK”. Now click the instance of the symbol that you created and, for the purpose of this tutorial, name it “imageGallery”.

IPB Image

Now that “imageGallery” has been set up you should move it all the way off the stage. OK, lets code. Open up the actions panel by selecting any frame and pressing F9. In the actions panel we need to import our Papervision3D classes. which will give us the ability to access the objects, methods and properties within Papervision3D.

CODE
import org.papervision3d.cameras.*;
import org.papervision3d.objects.primitives.*;
import org.papervision3d.materials.*;
import org.papervision3d.render.*;
import org.papervision3d.view.*;
import org.papervision3d.scenes.*;



Next we initialize a viewport which is basically a 3D MovieClip, which we will add to our stage. We will also need a scene where we will add objects and a camera to focus on a specific part of our scene. Last we need a rendering engine to make the scene viewable.

CODE
var viewport:Viewport3D = new Viewport3D(0,0, true,true);
var render:BasicRenderEngine= new BasicRenderEngine();
var scene:Scene3D = new Scene3D();
var camera:Camera3D = new Camera3D();
addChild(viewport);
camera.zoom = 10;
camera.focus = 100;


Now that our scene is initialized we can add a plane which will hold our “imageGallery” MovieClip. To create a plane simply type.

CODE
var picPlane:Plane = new Plane(picPlaneMaterial, imageGallery.width, imageGallery.height,10,10);


This will create define a plane but what will the plane hold? To give that plane a visual we must create a material which will be our “imageGallery” so paste this code above the previous line.
CODE
var picPlaneMaterial:MovieMaterial = new MovieMaterial(imageGallery);

We will also want the material to be visible on both sides so enter

CODE
picPlaneMaterial.oneSide = false;


Now all we have to do is add the plane to the scene and render the scene.

CODE
scene.addChild(picPlane);
render.renderScene(scene, camera, viewport);


Run the movie (ctrl-enter) and you should see your pictures in the center of the stage. This is good but the real benefit of using Papervision is to allow the user to view content in 3D space, so we are going to let the end user rotate the plane. Replace the render scene with a function the runs every frame and evaluates the users mouse position in relation to the center of the stage in order to rotate the plane.

CODE
stage.addEventListener(Event.ENTER_FRAME, positionAndRender)
function positionAndRender(evt:Event) {
    var rateOfChange:uint = 100;
    picPlane.rotationY += ((stage.stageWidth/2) - mouseX)/rateOfChange;
    picPlane.rotationX += ((stage.stageHeight/2) - mouseY)/rateOfChange;
    render.renderScene(scene, camera, viewport);
}


Test your movie and you should see something like this.

IPB Image

So thats it, but you don't have to be done yet. Try changing the frame rate or even try to display the “imageGallery” on a cylinder, sphere or cube. To get more help consult the documentation for Papervision3D at http://www.flashbookmarks.com/PV3D-GreatWhite-DOC/.
Feel free to contact me with any questions.