After having created our first little box, now I'll explain how to make it look better.

To do that you can use the Skin classes. Skins can be applied to objects to change and customize their appearance.

Sandy already provides some skins, but you would need a custom skin to realize a specific effect. In order to do that, you can create your own class, implementing the ISkin interface. Another tutorial will explain how to do that.

Here I create a SimpleColor skin, which needs a fill color, an alpha value, and a thickness (equivalent to the MovieClip.lineStyle parameters)

Here is the necessary code :

var my_skin:Skin = new SimpleColorSkin( 0xFF0000, 80, 2 );

Now that the skin instance is created, we need to apply it to the object. Each object has a setSkin method that takes a Skin object as a parameter (Be careful with Sprite2D/3D because they are a little bit different).

Here is the code :

myObject.setSkin( my_skin );

Here is a list of all the existing skins in Sandy, with their prototypes :

• SimpleLineSkin( t:Number, c:Number, a:Number )

Default skin for Object3D. This skin displays the edges of faces. You can change the thickness, color, and alpha values.

• SimpleColorSkin( c:Number, a:Number )

Allows you to fill the faces with a specific color and an alpha.

• MixedSkin(cb:Number,ab:Number,cl:Number, al:Number,tl:Number )

Mix between SimpleLineSkin and SimpleColorSkin, this skin allows you to fill the faces and to display the edges.

• ZLightenSkin( col:Number )

Wonderful skin that allows you to give a Gouraud-like lighting effect. It is obtained by a color gradient. But be careful, this skin has some strange behaviors with certain colors. This problem needs to be fixed later.

• TextureSkin( t:BitmapData )

This skin is certainly the most interessting for you It allows you to map a bitmap onto your Object3D. But there are some conditions to be able to do that : the object must have at least 3 vertices per face, and each face must know its UV coordinates. UV Coordinates are the relationship between the 3D vertex and the 2D position in the bitmap.

Sandy primitive objects generate those coordinates automatically to help you, but if you want to use your own object and texture it, you must know those values. More often those values are given by the modelization software.

• VideoSkin( video:Video )

Allows you to map the objects with a video stream, for example from a webcam.

• MovieSkin( mc:MovieClip, b:Boolean )

Allows you to map a MovieClip onto the object faces. Very nice when you want to display animations on your faces. BUT BE CAREFUL, it is very CPU intensive. You really have to consider the second argument! If you don't need the skin to be updated each frame, set this value to true. Otherwise the skin texture will be updated every rendering frame.

If you take a good look at the documentation, you might see that the setSkin method has a second argument ( a boolean ). You certainly don’t need it at the beginning, but I’ll explain its use right now.

An object is composed of a certain number of faces, and each face has a skin (so it is not the object that has a skin, but its faces!). When you set a skin to the object, the engine will set this skin to all its faces. But sometimes you might want to apply the new skin, but not on all the faces. An example to illustrate : You have a wall with two windows. You apply a texture skin to the whole wall and a specific skin to the windows (something with an alpha). Now if you want to change the wall skin, you don’t want to change the skins of the faces corresponding to the windows! So you have to pass a true value as the second argument of the Object3D::setSkin method.

It will change the skin of faces that is equivalent to the object one. Every modified face skin between two Object::setSkin calls will be not modified anymore. False is the default value, and it resets all the faces skins with the new one.

And now here is the code to realize a skinned box :

import sandy.core.data.*;
import sandy.core.group.*;
import sandy.primitive.*;
import sandy.view.*;
import sandy.core.*;
import sandy.skin.*;
import sandy.util.*;
import sandy.core.transform.*;
import sandy.events.*;
 
function init( Void ):Void
{
	// screen creation, the object where objects will be displayed.
	var screen:ClipScreen = new ClipScreen( this.createEmptyMovieClip('screen', 1), 600, 600 );
	// we create our camera
	var cam:Camera3D = new Camera3D( 700, screen);
	// we move the camera backward to be able to see the object placed at 0,0,0
	cam.setPosition(0, 0, -500);
	// we add the camera to the world
	World3D.getInstance().addCamera( cam );
	// we create the root node.
	var bg:Group = new Group();
	// and set it as the root node of the world.
	World3D.getInstance().setRootGroup( bg );
	// and we lauch the scene creation
	createScene( bg );
	// and now that everything is created, we can launch the world rendering.
	World3D.getInstance().render();
}
 
function createScene( bg:Group ):Void
{
	// We create our object. It is a cube of 50 pixels
	var o:Object3D = new Box( 50, 50, 50 );
 
        // We create the skin to change the box's appearance.
	// Here we are using the SimpleColor skin which requires a fill color, an alpha, and a thickness.
        // I choose to make it a little bit transparent and red
	var skin:Skin = new SimpleColorSkin (0xFF0000, 80, 2);
	// Now we just have to apply the skin to the object, and all its faces will automatically  update their skin
	o.setSkin (skin);
 
	// Now we simply link the Object leaf to the root node, and finish the tree creation
	bg.addChild( o);
}
 
// We lauch the animation creation.
init();

Source :
fla source file
Demo :