Multi-Material Cube class for Away3d

Quite a common question I see being asked is how to have a cube with a different material on each face. Currently, you can set ’tile6′ to ‘true’ which will map a texture to the UV so that it is split onto each face correctly, but it can be a bit fiddly, and also does not allow for different material types on each face, or to set different eventListeners on each face.

This class takes variables for the dimensions of the cube, and 6 materials, and creates a cube for you, from 6 correctly sized, rotated and positioned faces. At some point I intend to do this the ‘proper’ way (ie by creating a geometry class with 6 submeshes) but for the time being this works fine:


 package
 {
 import away3d.containers.ObjectContainer3D;
 import away3d.entities.Mesh;
 import away3d.primitives.PlaneGeometry;

/**
 * A quick way to create cubes with multiple material
 *
 * @author Mark Sutton
 */
 public class multiMatCube extends ObjectContainer3D
 {

var planesContainer:ObjectContainer3D = new ObjectContainer3D;
 var face1:Mesh;
 var face2:Mesh;
 var face3:Mesh;
 var face4:Mesh;
 var face5:Mesh;
 var face6:Mesh;

public function multiMatCube(width, height, depth, face1Mat, face2Mat, face3Mat, face4Mat, face5mat, face6Mat):void
 {

var faceGeometry:PlaneGeometry = new PlaneGeometry(1, 1, 1, 1 )
 //Top
 face1 =  new Mesh(faceGeometry, face1Mat );
 face1.scaleX = width;
 face1.scaleZ = depth;

face1.rotationX = 0
 face1.y = height / 2;

//Bottom
 face2 =  new Mesh(faceGeometry, face2Mat);
 face2.scaleX = width;
 face2.scaleZ = depth;
 face2.rotationX = 180;
 face2.y = -height/2;

//back
 face3 = new Mesh (faceGeometry, face3Mat);
 face3.scaleX = width;
 face3.scaleZ = height;
 face3.rotationX = 90
 face3.z = depth / 2;

//front
 face4 = new Mesh (faceGeometry, face4Mat);
 face4.scaleX = width;
 face4.scaleZ = height;
 face4.rotationX = 270
 face4.z = -depth / 2;

//right
 face5 = new Mesh (faceGeometry, face5mat);
 face5.scaleX = depth;
 face5.scaleZ = height;
 face5.rotationX = -90
 face5.rotationY = -90
 face5.x = width / 2;

//left
 face6 = new Mesh (faceGeometry, face6Mat);
 face6.scaleX = depth;
 face6.scaleZ = height;
 face6.rotationX = -90
 face6.rotationY = 90
 face6.x = -width / 2;

addChild(face1);
 addChild(face2);
 addChild(face3);
 addChild(face4);
 addChild(face5);
 addChild(face6);

}
 }
 }
 

Using it is simple:


var newMultiCube: multiMatCube = new multiMatCube (cubeWidth, cubeHeight, cubeDepth,  material1, material2, material3, material4, material5, material6);

and you can add eventListeners to each face too:


newMultiCube.face1.addEventListener(MouseEvent3D.MOUSE_DOWN, face1click);

etc..