Updated Feb 05, 2009 by jwopitz
Labels:	Phase-Implementation, tutorial

as3isolib_tutorial_003

Styling an IIsoPrimitive class

#labels Featured,Phase-Implementation,tutorial

TUTORIAL BEING UPDATED TO REFLECT BETA API

---

tutorial

The as3isolib IIsoPrimitive primitive types have various styling attributes available for customization.

Those attributes are:

render style - determines if the primitive is rendered as a shaded, solid or wireframe model.
face line alphas - polygon edge alphas.
face line colors - polygon edge colors
face line thicknesses - polygon edge thicknesses
face alphas - polygon fill alphas
face colors - polygon fill colors

By default all IIsoPrimitives are rendered as RenderStyleType.SHADED meaning that individual faces are shaded to different colors to add to the perception of depth. RenderStyleType.SOLID will draw all faces with color #FFFFFF. RenderStyleType.WIREFRAME renders all faces as transparent. Rendered as transparent allows mouse events to still be triggered.

In this example the face alphas and face colors have changed from their defaults. As you can see, since each face has a set line thickness, the bolder face edges on the back faces are now present.

code

package 
{
	import as3isolib.display.primitive.IsoBox;
	import as3isolib.display.scene.IsoScene;
	import as3isolib.enum.RenderStyleType;
	
	import flash.display.Sprite;
	
	public class IsoApplication extends Sprite
	{
		public function IsoApplication ()
		{
			var box:IsoBox = new IsoBox();
			box.styleType = RenderStyleType.SHADED;
			box.faceColors = [0xff0000, 0x00ff00, 0x0000ff, 0xff0000, 0x00ff00, 0x0000ff]
			box.faceAlphas = [.5, .5, .5, .5, .5, .5];
			box.setSize(25, 30, 40);
			box.moveTo(200, 0, 0);
			
			var scene:IsoScene = new IsoScene();
			scene.hostContainer = this;
			scene.addChild(box);
			scene.render();
		}
	}
}

While changing the face colors while being rendered as a RenderStyleType.SHADED has visible effects, doing so while being rendered as a RenderStyleType.SOLID does not:

code

box.styleType = RenderStyleType.SOLID;
box.faceColors = [0xff0000, 0x00ff00, 0x0000ff, 0xff0000, 0x00ff00, 0x0000ff]
box.faceAlphas = [.5, .5, .5, .5, .5, .5];

Being rendered as RenderStyleType.WIREFRAME ignores both the faceColors and faceAlphas setting altogether. Notice that the shadow is still being rendered. Shadow rendering is handled by the scene, not the IIsoPrimitive.

code

box.styleType = RenderStyleType.WIREFRAME;
box.faceColors = [0xff0000, 0x00ff00, 0x0000ff, 0xff0000, 0x00ff00, 0x0000ff]
box.faceAlphas = [.5, .5, .5, .5, .5, .5];

Comment by kormanak, Feb 12, 2009

Hey Justin, it seems that faceColors and faceAlpha don't exist in latest SVN version :)

Comment by captain.shaw, Feb 17, 2009

I can confirm that faceColors and faceAlphas seem to be missing

Comment by J04n.toh, Feb 24, 2009

isn't working~

Comment by captain.shaw, Mar 10, 2009

The beta version has been modified so this tutorial isn't valid. Take a look at:

as3isolib.graphics.Ifill as3isolib.graphics.IStroke

Example Code:

http://www.sto-mini.com/PrimitiveFills.as

Feel free to message me if you have any questions.

Comment by krixware, Apr 24, 2009

Here's another hackish way to do it:

Change:

box.faceColors = [0xff0000, 0x00ff00, 0x0000ff, 0xff0000, 0x00ff00, 0x0000ff];
box.faceAlphas = [.5, .5, .5, .5, .5, .5];

To the code below:

box.fills = [
    new SolidColorFill(0xff0000, .5),
    new SolidColorFill(0x00ff00, .5),
    new SolidColorFill(0x0000ff, .5),
    new SolidColorFill(0xff0000, .5),
    new SolidColorFill(0x00ff00, .5),
    new SolidColorFill(0x0000ff, .5)
  ];

And make sure to import:

import as3isolib.graphics.SolidColorFill;

Comment by Orgicus, Oct 09, 2009

I'm having the same issue as kormanak, with the beta zip available in downloads. Alpha doesn't compile.