Showcase and discover digital art at yex

Follow Design Stacks

Subscribe to our free newsletter to get all our latest tutorials and articles delivered directly to your inbox!

Putting the Pieces Together

Putting the Pieces Together

With all of the classes written, you can now create a FLA that renders a simple 3D scene. In the spirit of my previous automobile examples, I have assembled a set of nodes, lines, and polygons that render the basic shape of a car. Rather than walk you through the code line by line, I have included comments that explain each section:

// import the classes and interfaces for the project
import com.lo9ic.*;

// create the scene movie clip and center it on the stage
var mySceneClip:MovieClip = createEmptyMovieClip("SceneMC", 1);
mySceneClip._x = 275;
mySceneClip._y = 200;
mySceneClip._yscale = mySceneClip._xscale = 250;

// create an instance of the Scene class and set
// the clip and projection factor properties
var myScene:Scene = new Scene();
myScene.clip = mySceneClip;
myScene.f = 200;

// create style objects to be used by lines and polygons
var bodyStyle:Style = new Style();
bodyStyle.fillcolor = "0x660000";
bodyStyle.linecolor = "0x660000";

var grillStyle:Style = new Style();
grillStyle.fillcolor = "0x666666";
grillStyle.linealpha = 0;

var windowStyle:Style = new Style();
windowStyle.fillcolor = "0x000033";
windowStyle.fillalpha = 20;
windowStyle.linecolor = "0x660000";
windowStyle.linealpha = 100;
windowStyle.lineweight = 2;

var antennaStyle:Style = new Style();

var roofStyle:Style = new Style();

var interiorStyle:Style = new Style();
interiorStyle.fillcolor = "0x5F453A";
interiorStyle.linealpha = 0;

var tireStyle:Style = new Style();
tireStyle.fillcolor = "0x333333";
tireStyle.linealpha = 0;

// body panels, grill and trunk nodes
var n0:Node = new Node(-47,20,0);
var n1:Node = new Node(-50,20,15);
var n2:Node = new Node(50,20,15);
var n3:Node = new Node(47,20,0);

var n4:Node = new Node(-47,-20,0);
var n5:Node = new Node(-50,-20,15);
var n6:Node = new Node(50,-20,15);
var n7:Node = new Node(47,-20,0);

// window, hood and trunk lid nodes
var n8:Node = new Node(-22,-20,15);
var n9:Node = new Node(-22,20,15);
var n10:Node = new Node(15,20,15);
var n11:Node = new Node(15,-20,15);

// roof nods
var n12:Node = new Node(14,17,30);
var n13:Node = new Node(-12,17,30);
var n14:Node = new Node(-12,-17,30);
var n15:Node = new Node(14,-17,30);

// the antenna nodes
var n16:Node = new Node(23,20,15);
var n17:Node = new Node(23,20,35);

// the wheel nodes
var n18:Node = new Node(20,20,0);
var n19:Node = new Node(20,20,-10);
var n20:Node = new Node(30,20,-10);
var n21:Node = new Node(40,20,-10);
var n22:Node = new Node(40,20,0);
var n23:Node = new Node(20,-20,0);
var n24:Node = new Node(20,-20,-10);
var n25:Node = new Node(30,-20,-10);
var n26:Node = new Node(40,-20,-10);
var n27:Node = new Node(40,-20,0);
var n28:Node = new Node(-20,20,0);
var n29:Node = new Node(-20,20,-10);
var n30:Node = new Node(-30,20,-10);
var n31:Node = new Node(-40,20,-10);
var n32:Node = new Node(-40,20,0);
var n33:Node = new Node(-20,-20,0);
var n34:Node = new Node(-20,-20,-10);
var n35:Node = new Node(-30,-20,-10);
var n36:Node = new Node(-40,-20,-10);
var n37:Node = new Node(-40,-20,0);

// add the nodes to the scene
for (var i:Number = 0; i<38; i++) {

// create movie clips for the body panels, windows and antenna
var clip:MovieClip;
for (var i:Number = 0; i<17; i++) {
this["clip"+i] = mySceneClip.createEmptyMovieClip("mc"+i, i+1);

// create polygons for the body panels and windows,
// set the clip properties
// and add the polygons to the scene
var poly:Polygon;
for (var i:Number = 0; i<16; i++) {
this["poly"+i] = new Polygon();
this["poly"+i].clip = this["clip"+i];

// apply the bodystyle to the body panels
for (var i:Number = 0; i<5; i++) {
this["poly"+i].style = bodyStyle;

// apply the grillstyle to the grill
this["poly5"].style = grillStyle;

// apply the roof style to the roof
this["poly6"].style = roofStyle;

// apply the window style to the windows
for (var i:Number = 7; i<11; i++) {
this["poly"+i].style = windowStyle;

// apply the interior style to the interior
this["poly11"].style = interiorStyle;

// apply the tire style to the tires
for (var i:Number = 12; i<16; i++) {
this["poly"+i].style = tireStyle;

// add the nodes to the polygons
// right body panel
poly0.addNode(n0); poly0.addNode(n1);
poly0.addNode(n2); poly0.addNode(n3);
// left body panel
poly1.addNode(n4); poly1.addNode(n5);
poly1.addNode(n6); poly1.addNode(n7);

// trunk panel
poly2.addNode(n0); poly2.addNode(n1);
poly2.addNode(n5); poly2.addNode(n4);

// trunk
poly3.addNode(n1); poly3.addNode(n4);
poly3.addNode(n8); poly3.addNode(n9);

// hood
poly4.addNode(n11); poly4.addNode(n6);
poly4.addNode(n2); poly4.addNode(n10);

// grill
poly5.addNode(n2); poly5.addNode(n3);
poly5.addNode(n7); poly5.addNode(n6);

// roof
poly6.addNode(n12); poly6.addNode(n13);
poly6.addNode(n14); poly6.addNode(n15);

// windows
poly7.addNode(n9); poly7.addNode(n10);
poly7.addNode(n12); poly7.addNode(n13);
poly8.addNode(n8); poly8.addNode(n11);
poly8.addNode(n15); poly8.addNode(n14);
poly9.addNode(n8); poly9.addNode(n9);
poly9.addNode(n13); poly9.addNode(n14);
poly10.addNode(n11); poly10.addNode(n10);
poly10.addNode(n12); poly10.addNode(n15);

// tires
poly12.addNode(n18); poly12.addNode(n19, true);
poly12.addNode(n20); poly12.addNode(n21, true);
poly13.addNode(n23); poly13.addNode(n24, true);
poly13.addNode(n25); poly13.addNode(n26, true);
poly14.addNode(n28); poly14.addNode(n29, true);
poly14.addNode(n30); poly14.addNode(n31, true);
poly15.addNode(n33); poly15.addNode(n34, true);
poly15.addNode(n35); poly15.addNode(n36, true);

// interior
poly11.addNode(n8); poly11.addNode(n9);
poly11.addNode(n10); poly11.addNode(n11);

// create a line for the antenna
// and add the line to the scene
var antenna = new Line(n16, n17);
antenna.clip = this["clip16"]; = antennaStyle;

// create quaternion for rotating the car into initial position
var myQuat:Quaternion = new Quaternion();

// set the axis and angle of the quaternion, concatenate it with
// the existing quaternion, and draw the scene
function run():Void {
x = Math.sin(getTimer()/5000);
y = Math.cos(getTimer()/5000);

// set an interval to rotate and draw the scene
var id:Number = setInterval(run, 20);

When you publish the FLA, the resulting movie looks like the one in Figure 1.

Figure 1. A SWF created from 3D classes

I encourage you to download and experiment with this code to create your own 3D scenes or classes. Write a cube or pyramid class that leverages the classes I present here. Hopefully you will find that class-based programming is not only easy to implement but useful in your own projects.