Papervision3D: understanding Plane object – part 4

Understanding planes has never been so much fun, so here we go with the 4th part.

This is full of new features, such as:

* Making interactive objects

* Giving objects a name

* Changing object colors on the fly

This is the same old script as seen in Papervision3D: understanding Plane object – part 3 and previous tutorials, with some modifications.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
package {
	import flash.display.Sprite;
	import flash.events.Event;
	import org.papervision3d.cameras.Camera3D;
	import org.papervision3d.render.BasicRenderEngine;
	import org.papervision3d.scenes.Scene3D;
	import org.papervision3d.view.Viewport3D;
	import org.papervision3d.objects.primitives.Plane;
	import org.papervision3d.materials.ColorMaterial;
	import org.papervision3d.events.InteractiveScene3DEvent;
	public class papervision extends Sprite {
		public var viewport:Viewport3D=new Viewport3D(500,400,false,true);
		public var scene:Scene3D = new Scene3D();
		public var camera:Camera3D = new Camera3D();
		public var renderer:BasicRenderEngine = new BasicRenderEngine();
		public var back_material:ColorMaterial=new ColorMaterial(Math.random()*0xffffff);
		public var front_material:ColorMaterial=new ColorMaterial(Math.random()*0xffffff);
		public var front_plane:Plane=new Plane(front_material,200,300,4,5);
		public var back_plane:Plane=new Plane(back_material,200,300,4,5);
		public var rotation_speed=4;
		public function papervision() {
			addChild(viewport);
			camera.focus=100;
			camera.zoom=10;
			back_plane.rotationY=180;
			front_material.interactive=true;
			back_material.interactive=true;
			scene.addChild(front_plane);
			scene.addChild(back_plane);
			front_plane.name = "FRONT";
			back_plane.name = "BACK";
			back_plane.addEventListener(InteractiveScene3DEvent.OBJECT_PRESS,on_plane_clicked);
			front_plane.addEventListener(InteractiveScene3DEvent.OBJECT_PRESS,on_plane_clicked);
			addEventListener(Event.ENTER_FRAME, render);
		}
		public function render(e:Event) {
			front_plane.yaw(rotation_speed);
			back_plane.yaw(rotation_speed);
			renderer.renderScene(scene, camera, viewport);
		}
		public function on_plane_clicked(e:InteractiveScene3DEvent) {
			rotation_speed*=-1;
			switch (e.displayObject3D.name) {
				case "FRONT" :
					front_material.fillColor=Math.random()*0xffffff;
					break;
				case "BACK" :
					back_material.fillColor=Math.random()*0xffffff;
					break;
			}
		}
	}
}

Let’s see what’s new:

Line 10: Importing InteractiveScene3DEvent class. It’s the class that will allow us to make objects interactive

Line 12: we also have to declare the viewport in a new way… we need the fourth parameter set to true in order to make the viewport interactive. Interactive objects inside a non-interactive viewport become non-interactive themselves.

Let’s see the four parameters:

viewportWidth:Number (default = 640) — Width of the viewport

viewportHeight:Number (default = 480) — Height of the viewport

autoScaleToStage:Boolean (default = false) — Determines whether the viewport should resize when the stage resizes

interactive:Boolean (default = false) — Determines whether the viewport should listen for Mouse events by creating an InteractiveSceneManager

Lines 16-17: This is the creation of a color material as seen in part 2, but this time I am rendering random colors

Lines 26-27: Making the planes interactive

Lines 30-31: Assigning names to both planes.

Lines 32-33: Adding the listener to planes. InteractiveScene3DEvent.OBJECT_PRESS works in the same way as MouseEvent.CLICK

Now let’s see what happens when I click on a plane:

Line 42: Changing the rotation speed of both planes

Lines 43-50: Retrieving the name of the plane I clicked, and according to its name changing the color of the front or back plane. Please notice I am not changing the plane material, but I am changing the material fill color.

And that’s it:

Click on the rotating plane to see what happens.

Again, just cut/paste the code in the file you can download at Papervision3D for the absolute beginners.

Next time, real gambling cards flipping…

Rate this post: 1 Star2 Stars3 Stars4 Stars5 Stars (5 votes, average: 5.00 out of 5)
Loading ... Loading ...
Flash Templates provided by Template Monster are pre-made web design products developed using Flash technology.
They can be easily customized to meet the unique requirements of your project.
Be my fan on Facebook and follow me on Twitter! Exclusive content for my Facebook fans and Twitter followers

This post has 6 comments

  1. clarklin

    on June 5, 2009 at 1:13 pm

    hi there emanuele thanks for your tutorials, it helped me on my way with papervision, and i used yours as the starting point, went through the tuturials already, is there any other tutorials for papervision that maybe handy?

    regards
    Clark

  2. Pedro

    on June 5, 2009 at 3:02 pm

    Hi Emanuele, I’m sorry for the offtopic comment but did you code this Latest Projects flash banner you have on your blog? is it as3? I was wondering how to use a timer to to show a piechart.

  3. alex

    on June 7, 2009 at 7:13 pm

    please, Im searching a pv3d tutorial using interactive movieclips

  4. Papervision3D: understanding Plane object - part 5 : Emanuele Feronato

    on June 9, 2009 at 12:38 pm

    [...] the uncommented code has been explained from part 1 to 4 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 [...]

  5. kofi addaquay

    on November 7, 2009 at 4:55 am

    wow…thanks was looking for a way to find out which plane was clicked..and i found it here. thank you !!!!

    K

  6. Jorge

    on June 23, 2010 at 2:22 pm

    This is a great intro series, but yeah this lesson doesn’t work. I tried his own logo

    public var bitmap_material:BitmapFileMaterial = BitmapFileMaterial(“http://www.emanueleferonato.com/wp-content/themes/silhouette-3column2/images/emanuele.png”);

    and still get “Type Coercion failed: cannot convert” no matter what I try.

    Oh well, on to lesson 5…