RenderLayers – Selective Rendering

Monday, March 30th, 2009 | examples

I haven’t quite decided where to work yet, but I was getting tired of not blogging :)

After the pop-up launches, make sure to click to give the .swf keyboard focus. Then use the “right” and “left” keys to render the right or left sphere. The important thing to notice here is that the spheres are both in the same scene, but they’re only being rendered when you choose.

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
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
package
{
	import flash.events.Event;
	import flash.events.KeyboardEvent;
	import flash.ui.Keyboard;
 
	import org.papervision3d.core.proto.MaterialObject3D;
	import org.papervision3d.lights.PointLight3D;
	import org.papervision3d.materials.shadematerials.FlatShadeMaterial;
	import org.papervision3d.objects.primitives.Sphere;
	import org.papervision3d.view.BasicView;
	import org.papervision3d.view.layer.ViewportLayer;
 
	[SWF(width="900", height="480", backgroundColor="#000000", frameRate="31")]
	public class RenderLayers extends BasicView
	{
		private var isLeftRendering:Boolean = false;
		private var isRightRendering:Boolean = false;
 
		private var leftSphere:Sphere;
		private var rightSphere:Sphere;
 
		private var rightLayers:Array = [];
		private var leftLayers:Array = [];
 
		public function RenderLayers()
		{
			super(900, 480, false, false);
			var light:PointLight3D = new PointLight3D(true);
 
			var leftSphereMaterial:MaterialObject3D = new FlatShadeMaterial(light, 0xcc0000, 0x111111, 10);
			leftSphere = new Sphere(leftSphereMaterial, 300);
			leftSphere.x = -500;
 
			var rightSphereMaterial:MaterialObject3D = new FlatShadeMaterial(light, 0x00cc00, 0x111111, 10);
			rightSphere = new Sphere(rightSphereMaterial, 300);
			rightSphere.x = 500;
 
			var leftSphereLayer:ViewportLayer = new ViewportLayer(viewport, leftSphere);
			viewport.containerSprite.addLayer(leftSphereLayer);
			leftLayers.push(leftSphereLayer);
 
			var rightSphereLayer:ViewportLayer = new ViewportLayer(viewport, rightSphere);
			viewport.containerSprite.addLayer(rightSphereLayer);
			rightLayers.push(rightSphereLayer);
 
			scene.addChild(leftSphere);
			scene.addChild(rightSphere);
 
			//Render once so the spheres appear
			renderer.renderScene(scene, camera, viewport);
 
			startRendering();
 
			stage.addEventListener(KeyboardEvent.KEY_DOWN, stage_keyDownHandler);
			stage.addEventListener(KeyboardEvent.KEY_UP, stage_keyUpHandler);
		}
 
		private function stage_keyDownHandler(event:KeyboardEvent):void
		{
			switch(event.keyCode)
			{
				case Keyboard.LEFT:
					isLeftRendering = true;
					break;
 
				case Keyboard.RIGHT:
					isRightRendering = true;
					break;
			}
		}
 
		private function stage_keyUpHandler(event:KeyboardEvent):void
		{
			switch(event.keyCode)
			{
				case Keyboard.LEFT:
					isLeftRendering = false;
					break;
 
				case Keyboard.RIGHT:
					isRightRendering = false;
					break;
			}
 
		}
 
		override protected function onRenderTick(event:Event = null):void
		{
			//The spheres are always rotating
			leftSphere.rotationX++;
			rightSphere.rotationX--;
 
			//But they're only rendered if their selected layer is rendered
			if(isLeftRendering)
			{
				renderer.renderLayers(scene, camera, viewport, leftLayers);
			}
 
			if(isRightRendering)
			{
				renderer.renderLayers(scene, camera, viewport, rightLayers);
			}
		}
	}
}
  • John Lindquist

    @Augie - I'd recommend adding MouseEvent handlers to the ViewportLayers. So once you roll over the viewport layer, you could start interacting with it and/or render it.

  • Augie

    @Vico: I have the same exact problem, it seems that you can only interact with objects in the last ViewportLayer that you render. Does anyone know why this is? Vico's workaround does not work for me, as I am stopping rendering on purpose, in order to tween the camera and a new 3d Object only (in order to achieve an "impossible" perspective). I think I might just have to make 2 papervision scenes on top of each other...

  • Vico

    Hello john,
    Thank you for all your tutorials, and congratulations on your new job.

    I have made selective renderer, on one of my projects.
    I have many planes, and I want to make a render only on the selected plane.
    So I have my listeners on all planes (OBJECT_PRESS. ..). When I click on a plane, I select the viewportlayer and render only that layer. It works very well ...
    Except that I lose the interactivity on all my other planes ...
    I found a "temporary" solution, I make a render of all my planes once the animation of the selected plane over.
    Interactivity on each plane returns.
    But it made me a more render...

    I do not understand why listeners disappear when plane does not render ...

    Do you have an idea where this might come?
    maybe I did the wrong way ?

  • RK

    although your question is more than a year old ...
    you can save the renderlist once you've rendered all your planes and assign it back to your viewport after you've rendered your scene with the selective methode.

    this.m_viewport.lastRenderList = this.m_savedLastRenderList.concat();

  • Hey John, glad to see you blogging again!

    So even though you're extending BasicView, this line -
    renderer.renderLayers(scene, camera, viewport, rightLayers);

    is necessary to get to the specified layer? Can't you do-

    startRendering(rightLayers); ?

  • Dan

    Thanks again John. What if I were to want to index sort two viewports, render the back viewport once b/c it doesn't change but not the front viewport? Is that possible with viewport layers or would they have to be two separate viewports rendered differently?

  • Aloïs

    Thanks John !!!

blog comments powered by Disqus

Search

Recommended Books

Speaking at FITC Toronto

 

March 2009
M T W T F S S
« Feb   Apr »
 1
2345678
9101112131415
16171819202122
23242526272829
3031  

Preferred Video Tutorial Resolution

  • 1024x768 (53%, 85 Votes)
  • 1280x1024 (15%, 24 Votes)
  • 1920x1080 (15%, 24 Votes)
  • 800x600 (13%, 20 Votes)
  • 480x320 (4%, 6 Votes)
  • 640x480 (0%, 2 Votes)

Total Voters: 160

Loading ... Loading ...