Your message has been sent.
This article has been saved to your account.
Go to my account
This article has been emailed to your Kindle.
Send this article
Complete the form below to send this article, Away3D 3.6: Applying Animated and Composite materials, to a friend (or to yourself). We will never share your details (or your friend's) with anyone. For more information, read our Privacy Policy.
In this article by Matthew Casperson, author of Away3D 3.6 Essentials we will explore Animated and Composite materials. A number of materials can be used to display animations on the surface of a 3D object. These animations are usually movies that have been encoded into a SWF file. You can also display an interactive SWF file, like a form, on the surface of a 3D object. Composite materials are used to display a number of effects like shading, bump mapping, environment mapping, and lighting. The reader will comprehend this article better by referring the previous articles on:
- Materials, Lights and Shading Techniques with Away3D 3.6.
- Away3D 3.6: Applying Basic and Bitmap Materials.
- Models and Animations with Away3D 3.6.
| Read more about this book |
(For more resources on 3D, see here.)
Animated materials
As mentioned above a number of materials can be used to display animations on the surface of a 3D object. These animations are usually movies that have been encoded into a SWF file. You can also display an interactive SWF file, like a form, on the surface of a 3D object.
MovieMaterial
The MovieMaterial displays the output of a Sprite object, which can be animated. The sprite usually originates from another SWF file, which in this case we have embedded and referenced via the Bear class. A new instance of the Bear class is then passed to the MovieMaterial constructor.
protected function applyMovieMaterial():void
{
initCube();
materialText.text = "MovieMaterial";
var newMaterial:MovieMaterial =
new MovieMaterial(new Bear());
currentPrimitive.material = newMaterial;
}

The MovieMaterial class extends the TransformBitmapMaterial class. This means that in addition to those parameters in the following list, the init object parameters listed for the TransformBitmapMaterial are also valid for the MovieMaterial.

AnimatedBitmapMaterial
The AnimatedBitmapMaterial class displays the frames from a MovieClip object. In order to increase performance, it will first render each frame of the supplied MovieClip into a bitmap. These bitmaps are stored in a cache, which increases playback performance at the cost of using additional memory.
Because of the memory overhead resulting from this cache, the AnimatedBitmapMaterial cannot be used to display movie clips longer than two seconds. If you pass a movie clip longer than two seconds an exception will be thrown.
The MovieClip object, passed to the AnimatedBitmapMaterial constructor, usually originates from another SWF file. This source SWF file needs to be implemented in the ActionScript Virtual Machine 2 (AVM2) format, which is the format used by Flash Player 9 and above. This is an important point, because a large number of video conversion tools will output AVM1 SWF files.
If you need to display a SWF movie in AVM1 format, use MovieMaterial class instead.
If you try to use an AVM1 SWF file with the AnimatedBitmapMaterial class, an exception similar to the following will be thrown:
TypeError: Error #1034: Type Coercion failed: cannot convert flash.display::
AVM1Movie@51e8e51 to flash.display.MovieClip.
FFmapeg is a free, cross-platform tool that can be used to convert video files into AVM2 SWF files. It can be downloaded from , and precompiled Windows binaries can be downloaded from http://sourceforge.net/projects/mplayer-win32/files/FFmpeg/. The following command will convert a WMV video into a two second AVM2 SWF file with a resolution of 320 x 240 without any audio.
ffmpeg -i Butterfly.wmv -t 2 -s 320x240 -an -f avm2 Butterfly.SWF
protected function applyAnimatedBitmapMaterial():void
{
initCube();
materialText.text = "AnimatedBitmapMaterial";
var newMaterial:AnimatedBitmapMaterial =
new AnimatedBitmapMaterial(new Butterfly());
currentPrimitive.material = newMaterial;
}
The AnimatedBitmapMaterial class extends the TransformBitmapMaterial class. This means that in addition to those parameters in the following list, the init object parameters listed for the TransformBitmapMaterial are also valid for the AnimatedBitmapMaterial.

Interactive MovieMaterial
By setting the interactive parameter to true, a MovieMaterial object can pass mouse events to the Sprite object it is displaying. This allows you to interact with the material as if it were added directly to the Flash stage while it is wrapped around a 3D object.
protected function applyInteractiveMovieMaterial():void
{
initCube();
materialText.text = "MovieMaterial - Interactive";
var newMaterial:MovieMaterial =
new MovieMaterial(new InteractiveTexture(),
{
interactive: true,
smooth: true
}
);
currentPrimitive.material = newMaterial;
}

Refer to the previous table for the MovieMaterial class for the list of constructor parameters.
| Read more about this book |
(For more resources on 3D, see here.)
Composite materials
Composite materials combine two or more base materials to achieve their final appearance. Composite materials are used to display a number of effects like shading, bump mapping, environment mapping, and lighting.
DepthBitmapMaterial
The DepthBitmapMaterial is similar to the BitmapMaterial in that it applies a bitmap texture to the surface of a 3D object. In addition, the DepthBitmapMaterial will shade the surface according to its distance from the camera. This can be used to apply a fog-like effect.
protected function applyDepthBitmapMaterial():void
{
The effect produced by the DepthBitmapMaterial class is best demonstrated on a 3D object that is moving relative to the camera. Setting the bounce parameter to true for the initShpere() function will cause the onEnterFrame() function to bounce the sphere along the Z-axis.
initSphere(true);
materialText.text = "DepthBitmapMaterial";
var newMaterial:DepthBitmapMaterial =
new DepthBitmapMaterial(Cast.bitmap(EarthDiffuse),
{
Here, we define the distances from the camera over which the base bitmap texture is shaded. When the material is closer to the camera than the minZ parameter, it takes on the color defined by the minColor parameter. When it is further from the camera than the maxZ parameter, it should take on the color defined by the maxColor parameter.
There is a bug in Away3D 3.6 that causes the DepthBitmapMaterial class to interpret the maxColor parameter incorrectly. As it stands, supplying any color other than 0 to the maxColor parameter is required for the DepthBitmapMaterial object to apply a shade of black to its underlying bitmap material as it moves further from the camera. Leaving the maxColor parameter as its default value of 0x000000 (which is the same as 0) will cause the DepthBitmapMaterial object to completely ignore the base bitmap texture and only display the black shading.
As you can see in the following example, we supply a black color with the alpha component defined. This value does not equal zero, and so it is sufficient to work around this bug.
The actual value assigned to the maxColor parameter is incorrectly consumed by one of the classes contained in the DepthBitmapMaterial class.
The fix for this is quite simple. Change line 122 in the DepthBitmapMaterial.as file (download code: ch:5) from:
_depthShader = new DepthShader({minZ:_minZ, maxZ:_
maxZ, color:_maxColor});
to:
_depthShader = new DepthShader({minZ:_minZ, maxZ:_
maxZ, shadingColor:_maxColor});
Also change line 208 of the DepthShader.as file from:
color = ini.getNumber("color", 0x000000);
to:
color = ini.getNumber("shadingColor", 0x000000);
Let us complete the function we started above:
minZ: 400,
maxZ: 500,
maxColor: 0xFF000000
}
);
currentPrimitive.material = newMaterial;
}
DepthBitmapMaterial is a composite material, meaning it uses two or more base materials to achieve its final appearance. One of the base materials is the BitmapMaterial, and the init object supplied to the DepthBitmapMaterial is also passed along to the BitmapMaterial constructor. This means that in addition to those parameters in the following list, the init object parameters listed for the BitmapMaterial are also valid for the DepthBitmapMaterial.


EnviroBitmapMaterial
The EnviroBitmapMaterial class achieves the appearance of a reflective surface by applying a second bitmap as an environment map over a base BitmapMaterial.
protected function applyEnviroBitmapMaterial():void
{
initTorus();
materialText.text = "EnviroBitmapMaterial";
var newMaterial:EnviroBitmapMaterial =
new EnviroBitmapMaterial(
Cast.bitmap(Bricks),
Cast.bitmap(Marble)
);
currentPrimitive.material = newMaterial;
}

Like the DepthBitmapMaterial material, EnviroBitmapMaterial is a composite material that passes the init object to a contained instance of the BitmapMaterial class. This means that in addition to those parameters in the following list, the init object parameters listed for the BitmapMaterial are also valid for the DepthBitmapMaterial.

EnviroColorMaterial
The EnviroColorMaterial is similar to EnviroBitmapMaterial, with the exception that it uses a solid color instead of a bitmap as the base texture.
protected function applyEnviroColorMaterial():void
{
initTorus();
materialText.text = "EnviroColorMaterial";
var newMaterial:EnviroColorMaterial =
new EnviroColorMaterial(
"sandybrown",
Cast.bitmap(Marble)
);
currentPrimitive.material = newMaterial;
}

The EnviroColorMaterial class indirectly extends the ColorMaterial class, which means the init object parameters listed for the ColorMaterial class also apply to the EnviroColorMaterial class.

Further resources on this subject:
- Away3D 3.6 Cookbook [Books]
- Away3D 3.6: Applying Basic and Bitmap Materials [Articles]
- Models and Animations with Away3D 3.6 [Articles]
- Materials, Lights and Shading Techniques with Away3D 3.6 [Articles]
- Away3D 3.6: Applying Light and Pixel Bender materials [Articles]
- Creating and Warping 3D Text with Away3D 3.6 [Articles]
About the Author :
Matthew Casperson
Matthew Casperson has worked in IT for nearly a decade in a variety of roles including development and support, and in his spare time loves nothing more than to experiment with the latest web and multimedia technologies. Many of these experiments can be found on Matthews personal website at http://goo.gl/2Hgr.
Away3D Essentials is Matthews first book, but hopefully won't be the last!



Post new comment