basics

Cube Inside Faces and Outside Faces

Friday, January 2nd, 2009 | examples | Comments

*updated to address comments


source

package
{
	import flash.display.Bitmap;
	import flash.events.Event;
	import flash.events.MouseEvent;
 
	import org.papervision3d.core.proto.MaterialObject3D;
	import org.papervision3d.lights.PointLight3D;
	import org.papervision3d.materials.BitmapMaterial;
	import org.papervision3d.materials.shaders.CellShader;
	import org.papervision3d.materials.shaders.ShadedMaterial;
	import org.papervision3d.materials.shaders.Shader;
	import org.papervision3d.materials.utils.MaterialsList;
	import org.papervision3d.objects.primitives.Cube;
	import org.papervision3d.view.BasicView;
	import org.papervision3d.view.stats.StatsView;
 
	[SWF(width="640", height="480", backgroundColor="#000000", frameRate="60")]
	public class InsideFacesOfACube extends BasicView
	{
		[Embed(source="assets/back.jpg")]
		private var backAsset:Class;
 
		[Embed(source="assets/bottom.jpg")]
		private var bottomAsset:Class;
 
		[Embed(source="assets/front.jpg")]
		private var frontAsset:Class;
 
		[Embed(source="assets/left.jpg")]
		private var leftAsset:Class;
 
		[Embed(source="assets/right.jpg")]
		private var rightAsset:Class;
 
		[Embed(source="assets/top.jpg")]
		private var topAsset:Class;
 
		[Embed(source="assets/287.jpg")]
		private var environmentAsset:Class;
 
		private var light:PointLight3D;
		private var cube:Cube;
		private var materialsList:MaterialsList;
		private var sides:int = Cube.ALL;
 
		public function InsideFacesOfACube()
		{
			createMaterialsList();
 
			cube = new Cube(materialsList, 500, 500, 500, 5, 5, 5, sides);
			scene.addChild(cube);
 
			startRendering();
 
			stage.addEventListener(MouseEvent.CLICK, stage_clickHandler);
		}
 
		private function createMaterialsList():void
		{
			materialsList = new MaterialsList();
 
			light = new PointLight3D();
 
			materialsList.addMaterial(createShadedMaterial(backAsset), "back");
			materialsList.addMaterial(createShadedMaterial(bottomAsset), "bottom");
			materialsList.addMaterial(createShadedMaterial(frontAsset), "front");
			materialsList.addMaterial(createShadedMaterial(leftAsset), "left");
			materialsList.addMaterial(createShadedMaterial(rightAsset), "right");
			materialsList.addMaterial(createShadedMaterial(topAsset), "top");
		}
 
		private function createShadedMaterial(bitmapAsset:Class):MaterialObject3D
		{
			var bitmap:Bitmap = new bitmapAsset() as Bitmap;
			var bitmapMaterial:BitmapMaterial = new BitmapMaterial(bitmap.bitmapData, true);
			var shader:Shader = new CellShader(light, 0xffffff, 0xaaaaaa, 10); 
			var shadedMaterial:ShadedMaterial = new ShadedMaterial(bitmapMaterial, shader);
			return shadedMaterial;
		}
 
		private function stage_clickHandler(event:MouseEvent):void
		{
			if(sides == Cube.ALL)
			{
				sides = Cube.NONE;
			}
			else
			{
				//you could also specify specific sides you want
				//i.e. - if you want every side but the front do:
				//sides = Cube.ALL - Cube.Front;
				//or if you only want the top and the bottom do:
				//sides = Cube.TOP + Cube.BOTTOM;
				sides = Cube.ALL;
			}
 
			scene.removeChild(cube);
			createMaterialsList();
			var tempRotationX:Number = cube.rotationX;
			var tempRotationY:Number = cube.rotationY; 
			cube = new Cube(materialsList, 500, 500, 500, 5, 5, 5, sides);
			cube.rotationX = tempRotationX;
			cube.rotationY = tempRotationY; 
			scene.addChild(cube);
		}
 
		override protected function onRenderTick(event:Event=null):void
		{
			cube.rotationY += (viewport.containerSprite.mouseX - cube.rotationY) * .1;
			cube.rotationX += (viewport.containerSprite.mouseY - cube.rotationX) * .1;
			renderer.renderScene(scene, camera, viewport);
		}
	}
}

Tags: ,

Cube with different sides – MaterialsList

Saturday, December 20th, 2008 | examples | Comments


source

package
{
	import flash.display.Bitmap;
	import flash.events.Event;
 
	import org.papervision3d.lights.PointLight3D;
	import org.papervision3d.materials.BitmapMaterial;
	import org.papervision3d.materials.shaders.PhongShader;
	import org.papervision3d.materials.shaders.ShadedMaterial;
	import org.papervision3d.materials.shaders.Shader;
	import org.papervision3d.materials.utils.MaterialsList;
	import org.papervision3d.objects.primitives.Cube;
	import org.papervision3d.view.BasicView;
 
	[SWF(width="640", height="480", backgroundColor="#000000", frameRate="60")]
	public class CubeWithDifferentSides extends BasicView
	{
		[Embed(source="assets/back.jpg")]
		private var backAsset:Class;
 
		[Embed(source="assets/bottom.jpg")]
		private var bottomAsset:Class;
 
		[Embed(source="assets/front.jpg")]
		private var frontAsset:Class;
 
		[Embed(source="assets/left.jpg")]
		private var leftAsset:Class;
 
		[Embed(source="assets/right.jpg")]
		private var rightAsset:Class;
 
		[Embed(source="assets/top.jpg")]
		private var topAsset:Class;
 
		private var light:PointLight3D;
		private var cube:Cube;
 
		public function CubeWithDifferentSides()
		{
			var materialsList:MaterialsList = new MaterialsList();
 
			light = new PointLight3D();
 
			materialsList.addMaterial(createShadedMaterial( new backAsset() ), "back");
			materialsList.addMaterial(createShadedMaterial( new bottomAsset() ), "bottom");
			materialsList.addMaterial(createShadedMaterial( new frontAsset() ), "front");
			materialsList.addMaterial(createShadedMaterial( new leftAsset() ), "left");
			materialsList.addMaterial(createShadedMaterial( new rightAsset() ), "right");
			materialsList.addMaterial(createShadedMaterial( new topAsset() ), "top");
 
			cube = new Cube(materialsList, 500, 500, 500, 5, 5, 5);
			scene.addChild(cube);
 
			startRendering();
		}
 
		private function createShadedMaterial(bitmap:Bitmap):ShadedMaterial
		{
			var bitmapMaterial:BitmapMaterial = new BitmapMaterial(bitmap.bitmapData, true);
			var shader:Shader = new PhongShader(light, 0xffffff, 0x333333, 10, bitmap.bitmapData, bitmap.bitmapData);
			var shadedMaterial:ShadedMaterial = new ShadedMaterial(bitmapMaterial, shader);
			return shadedMaterial;
		}
 
		override protected function onRenderTick(event:Event=null):void
		{
			cube.rotationY += (viewport.containerSprite.mouseX - cube.rotationY) * .1;
			cube.rotationX += (viewport.containerSprite.mouseY - cube.rotationX) * .1;
			renderer.renderScene(scene, camera, viewport);
		}
	}
}

Tags: ,

VectorVision Hello World

Monday, December 8th, 2008 | examples | Comments

Since VectorVision was integrated with Papervision3D, it seemed only appropriate to make a Hello World demo for today. Simple, eh?


source

package
{
	import flash.events.Event;
 
	import org.papervision3d.materials.special.Letter3DMaterial;
	import org.papervision3d.typography.Font3D;
	import org.papervision3d.typography.Text3D;
	import org.papervision3d.typography.fonts.HelveticaBold;
	import org.papervision3d.view.BasicView;
 
	[SWF(width="640", height="480", backgroundColor="#000000", frameRate="60")]
	public class VectorVisionHelloWorld extends BasicView
	{
		private var text3D:Text3D;
 
		public function VectorVisionHelloWorld()
		{
			var material:Letter3DMaterial = new Letter3DMaterial(0xcc0000);
			var font3D:Font3D = new HelveticaBold();
			text3D = new Text3D("Hello World", font3D, material);
 
			scene.addChild(text3D);
 
			startRendering(); 	
		}
 
		override protected function onRenderTick(event:Event=null):void
		{
			text3D.yaw(1);
			renderer.renderScene(scene, camera, viewport);
		}
	}
}

Tags: ,

What is BasicView?

Saturday, December 6th, 2008 | how it works, tutorials | Comments

I use BasicView in all of my examples. This post explains why:


1. BasicView is a Sprite

Every ActionScript 3 project requires a “document class“. Since BasicView subclasses Sprite, you can extend BasicView to create your document class:

public class MyAwesomeDocumentClass extends BasicView

*note – You’ve probably heard the terms subclass, inherits, inheritance, extends, or others before. All those terms just mean you take advantage of the variables and functions of a specific class by writing another class that extends it. See Wikipedia’s Inheritance Page.

If you look at the docs, you’ll see the inheritance chain: BasicView->AbstractView->Sprite.


2. BasicView provides a viewport, scene, camera, and renderer

Every Papervision3D project requires a viewport, scene, camera, and renderer which are all classes in the Papervision3D library. If you don’t use BasicView, you have to do something like this:

package
{
	import flash.display.Sprite;
	import flash.events.Event;
 
	import org.papervision3d.cameras.Camera3D;
	import org.papervision3d.objects.primitives.Sphere;
	import org.papervision3d.render.BasicRenderEngine;
	import org.papervision3d.scenes.Scene3D;
	import org.papervision3d.view.Viewport3D;
 
	[SWF(width="640", height="480", backgroundColor="#000000", frameRate="60")]
	public class ImTooCoolForBasicView extends Sprite
	{
		private var viewport:Viewport3D;
		private var scene:Scene3D;
		private var camera:Camera3D;
		private var renderer:BasicRenderEngine;
 
		public function ImTooCoolForBasicView()
		{
			viewport = new Viewport3D();
			addChild(viewport);
 
			scene = new Scene3D();
			camera = new Camera3D();
			renderer = new BasicRenderEngine();
 
			var sphere:Sphere = new Sphere();
			scene.addChild(sphere);
 
			addEventListener(Event.ENTER_FRAME, enterFrameHandler);
		}
 
		private function enterFrameHandler(event:Event):void
		{
			renderer.renderScene(scene, camera, viewport);
		}
 
	}
}

Phew, that was a lot of work! Let’s look at what it looks like when you use BasicView:

package
{
	import org.papervision3d.objects.primitives.Sphere;
	import org.papervision3d.view.BasicView;
 
	[SWF(width="640", height="480", backgroundColor="#000000", frameRate="60")]
	public class SmartGuysUseBasicView extends BasicView
	{
		public function SmartGuysUseBasicView()
		{
			var sphere:Sphere = new Sphere();
			scene.addChild(sphere);
			startRendering();
		}
 
	}
}

Much better!

You probably also noticed that the second example has the handy little “startRendering()” function. StartRendering does the exact same thing as the addEventListener(Event.ENTER_FRAME, enterFrameHandler); line in the first example. The addEventListener line is hidden away in AbstractView:

http://code.google.com/p/papervision3d/source/browse/trunk/as3/trunk/src/org/papervision3d/view/AbstractView.as#29

Hiding functionality like that example is called encapsulation, but who really cares what it’s called as long as it makes it easier :)


3. What’s this override protected function onRenderTick thing in the examples?

onRenderTick is the enter frame event listener called when you use startRendering(). If you look at the code, you’ll notice onRenderTick is a protected function. Using protected allows you to change what the function does by overriding it.

*note – The keyword protected is one of ActionScript 3’s “accessibility modifiers”. You may be familiar with other keywords: public, private, internal, and final. To learn how each of these “control access” to functions, read through adobe’s keyword page: http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/statements.html

By default, you just type startRendering(); and onRenderTick will just do the following each frame (you don’t have to type this out since it’s included in AbstractView):

renderer.renderScene(scene, camera, viewport);

You can change what onRenderTick does by writing it out like this:

override protected function onRenderTick(event:Event=null):void
{
	sphere.yaw(1);
	renderer.renderScene(scene, camera, viewport);
}

When overriding a function, remember that the parameters (event:Event=null) and the return type (void) have to remain exactly the same.


4. I get it! BasicView simply sets up what you need for Papervision3D!

Bingo! But that doesn’t mean you have to use BasicView. In fact, maybe your project requires multiple viewports or cameras and you’ll need to write out the code without BasicView. In the end, use what’s best for you.

As for me and my examples, I’ll be sticking with BasicView. :D

*final note – If you found how BasicView works interesting, I recommend reading up on the Template Pattern and the Facade Pattern.

Tags:

« Previous Entries

 Subscribe to the pv3d.org feed!

Follow me on Twitter

Visit the Papervision3D Forum

Search

Recommended Books

Speaking at FITC Toronto

 

March 2010
M T W T F S S
« Jan    
1234567
891011121314
15161718192021
22232425262728
293031  

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 ...