Learn how to draw Five3D 3D shapes at runtime.
Flash Sprites expose a property called graphics, which can be used to draw directly onto the sprite. This is useful for creating simple shapes at runtime like boxes and circles. Five3D objects expose a similar property called graphics3D. Let’s see how this property can be used to create some simple 3D shapes.
ApplicationManager.as
To demonstrate the graphics3D property we will first create a rounded rectangle. The first thing to do is create a new Sprite3D instance. [code]
Just like the Sprite graphics property, before doing any drawing with a Graphics3D object beginFill needs to be called, with the colour that will be used in the drawing operation passed as a parameter. [code]
The Graphics3D object has a number of functions that can be used to draw some simple shapes. Here we use the drawRoundRect function to draw a rectangle with rounded corners. The drawing starts from the position [-75, -50] to place the centre of the rectangle over the origin of the Sprite3D. This ensures that any rotations will rotate the rectangle around its centre, and not its corner. [code]
The endFill function is called to indicate that we are done drawing. [code]
The Sprite3D is then positioned, and added to the scene via a BounceOnClick object. The BounceOnClick class adds some interactivity to the object (see this tutorial). [code]
In addition to the functions exposed by the Graphics3D object, Five3D also has a utility class called Drawing that can be used to draw some more shapes like stars.
A new Sprite3D is created. [code]
We then call the star function on the Drawing class. There is no need to wrap up the drawing calls inside the beginFill and endFill functions when using the Drawing class. [code]
The new Sprite3D is added to the scene via another BounceOnClick object. [code]
The process for drawing other shapes, like the ellipse, is the same as drawing a rectangle. [code]
Using the Graphics3D and Drawing classes is useful when you want to create some simple or standard shapes at runtime, without the need for embedding and loading external resources.
Go back to Five3D Tutorials
Five3D Tutorials - 3D Tag Cloud
Learn how to create a 3D Tag Cloud with Five3D.
Away3D Lite Programming Tutorials - Primitives
Learn how to create the primitive 3D models that are included with the Away3D Lite engine.