Txt3D for Away3D

Away3D 3.6 is great but one thing that is a bit of a hassle is working with text. In a recent project I needed some very simple text to display in 3D space but not necessarily have rotational properties. That sounds like a fantastic case for using Sprite3D. The Sprite3D has properties for x, y, z but none for rotationX, rotationY, rotationZ because a Sprite3D always faces the camera.

Unfortunately a Sprite3D doesn’t support text. All you can do with a Sprite3D is give it BitmapData to display. My solution was to create a class called Txt3D which is exceedingly simple to use. Here is all you have to do to display some text:

var txt3D : Txt3D = new Txt3D( 'I love Away3D' );
_view.scene.addSprite( txt3D );

That’s all there is to it. But there are also parameters for font-size, color, and font. This is a work in progress so it’s fairly simple right now. But I’ll be adding features as I need them and updating here.

Here is how the txt3Ds are being created in the example below:

for ( var i:int = 0; i < 20; i++ ) {
	var txt3D : Txt3D = new Txt3D( 'Away3D', 32, 0xFFFFFF * Math.random(), Txt3D.SANS );
	txt3D.timerInterval = 50;
	txt3D.x = Math.random() * 500 - 250;
	txt3D.y = Math.random() * 500 - 250;
	txt3D.z = Math.random() * 500 - 250;
	_view.scene.addSprite( txt3D );
}

How it works
Txt3D extends Sprite3D and works by creating a regular old Flash TextField with the settings you define: text, color, size, font. Then it creates a BitmapData instance and draws() the TextField to it. Finally it creates a BitmapMaterial and uses the BitmapData from the TextField.

Done and done.

Along the way I apply just a tiny bit of a BlurFilter to the TextField because when capturing the BitmapData it doesn’t grab the anti-aliasing with it. ( If anyone knows a way to do this I’d appreciate you dropping me a comment on the matter. ) So the BlurFilter acts as a poor man’s anti-aliasing.

I’ve also added – out of need – the ability to blur and fade the Txt3D out until it disappears. You should be able to see that happening in the example above. To initiate that just call the zongy() method on your Txt3D instance. ( Read more about Zongy. )

I’m also using my MPC class to dispatch an event when the fade out is complete. That way I can remove it from the _view.scene, or whatever. If perchance you’re using Txt3D and don’t need the event dispatcher then just remove that one line of code that refers to MCP and you’re set. Otherwise you can grab MPC and add it to your library.