Posts Tagged ‘FIVe3D’

JigLibFlash FIVe3D Dominos

Thursday, October 1st, 2009

JigLibFlash FIVe3D Dominos

So far the only FIVe3D JigLibFlash example I have shown is the Falling Cube Demo. So it was time to create something a little more practical. Dominos.

In this demo you can create, position and rotate dominos, then knock them over. You can also move the camera around the scene to get a better view.

This demo is my first use of flat shading in FIVe3D , which is a new feature in V2.1.2. Flat shading couldn’t be easier to implement, I simply set scene.ambientLightIntensity=.05 and then set all the sides of my dominos to flatShaded=true. I’m impressed with how easy it was to add and how much more visually appealing it made this demo.

This demo is also my first since joining the JigLibFlash team and adding FIVe3D support to the JigLibFlash library. This means the sample source does not contain any JigLibFlash classes, as they are now within the JigLibFlash library itself. Make sure you update your version of JigLibFlash rev 101 or higher.

To check out the demo click here.

To get the demo source click here.

Source Requirements: You will need both FIVe3D 2.1.2 and JigLibFlash to compile the demo source.

JigLibFlash FIVe3D Support and FIVe3D Cube

Monday, August 3rd, 2009

FIVe3D JigLibFlash Demo 1 Screenshot

Last week I spoke at ‘Flash in the Peg‘ – Winnipeg’s Adobe User Group. Here I got the opportunity to show a demo of JigLibFlash FIVe3D support that I have been working on for the last few weeks. After more hours than I would like to admit JigLibFlash FIVe3D support is now available for download. Like both JigLibFlash and FIVe3D these classes are released under the MIT License.

If you have used FIVe3D before you will know that there are no 3D object primitives built into the library, because of this I have also wrote a Cube class primitive for FIVe3D. Even if you do not need to use physics in your project you can still use this new Cube primitive.

Setting up JigLibFlash to work with FIVe3D is not quite as easy as Papervision3D, but it’s not a lot harder. The reason for this is FIVe3D does not allow for direct transformation matrix manipulations. In simpler terms a  few small changes needed to be made to the Sprite3D class within FIVe3D. You can use my modified version of the Sprite3D class to replace your current version, or just add it directly to your project using the same package folder structure. An example of how to do this is in my source below. The modifications to the Sprite3D class are small and should have no impact on your projects (with or without JigLibFlash).

To check out the demo click here.

To get the demo source, including all required files click here.

To just download the required files (JigLibFlash FIVe3D Plugin, modified Sprite3D class and new Cube primitive) click here.

Source Requirements: You will need both FIVe3D 2.1.2 and JigLibFlash to compile the demo source.

Update: As I am now a JigLibFlash contributor, JigLibFlash library now has built-in FIVe3D support. For more information click here.

Multiline WordWrap DynamicText3D in FIVe3D Part 2 (Now with Dynamic Alignment)

Sunday, July 19th, 2009

FIVe3D WordWrap Part 2 Screenshot

For those of you that have not read my original blog post on multiline wordwrap in FIVe3D. You can go read the article here.

I didn’t intend of expanding my DynamicTextMultiline class, but as I was working on another project I ended up adding to it and expanding its feature set. I have now implemented dynamic alignment (left,right,center) and line spacing, as well as fixed a small bug involving multiline text width. I have also updated the package path of the class to a more logical location (almostlogical.five3d.display).

Using dynamic alignment and line spacing is very easy:

var dynText:DynamicText3DMultiline;
dynText = new DynamicText3DMultiline(HelveticaMedium);
dynText.width = 200;
dynText.align =  DynamicText3DMultiline.CENTER;
dynText.lineSpacing = 5; 
dynText.wordWrap = true;

This class has been programmed in such a way that you can use it even if you don’t need to use word wrap because it has almost no additional performance impact when wordwrap=false. Plus now you get the added benefit of being able to dynamically align your text.

This demo is the same as Part 1 except it includes the ability to change the alignment of the text (left,right,center) in real-time.

Note: For performance reasons I recommend setting text.wordwrap=true as the very last property you set.

To play the demo click here.

To get the demo source, including the newest version of the DynamicText3DMultiline class click here.

To just download the newest version of the DynamicText3DMultline class click here.

Source Requirements: You will need both FIVe3D 2.1.2 and TweenMax to compile the demo source.

Note: If you are having problems using word wrapping with generated fonts (not the default Helvetica fonts), please refer to the solution in the previous post.

Multiline WordWrap DynamicText3D in FIVe3D

Tuesday, June 23rd, 2009

FIVe3D Word Wrap Screenshot

For those of you that have never heard of FIVe3D, it is a lightweight vector based 3D library now written in AS3. You can check it out for yourself, http://five3d.mathieu-badimon.com.

In working on a small project using FIVe3D I discovered that while the 3D text part of the library is awesome it did not support multiline word wrap. I had seen examples of people using muliple DynamicText3D objects to fake text being multiline, but I wanted the text to be able to support dynamically word wrapping.

So I created a class called DynamicText3DMultiline which works the exact same way as the normal DynamicText3D class, but adds multiline wordwrap functionality. To use wordwrapping, simply set the width of the object and then set wordwrap equal to true.

var dynText:DynamicText3DMultiline;
dynText = new DynamicText3DMultiline(HelveticaMedium);
dynText.width = 200;
dynText.size = 14;
dynText.wordWrap = true;

There is next to no overhead in using this class instead of the DynamicText3D class when you don’t need the word wrapping feature, so as in my example this is now my standard text rendering class. Also it does have the added benefit have having a textHeight function.

To play the demo click here.

To get the demo source and the new DynamicText3DMultiline class click here.

Source Requirements: You will need both FIVe3D 2.1.2 and TweenMax to compile the demo source.

Update: I have been informed that people have not been able to get this class to work with their own generated typography files. I have discovered the issue, it turns out there is a small bug in the Typography Generator. Luckly the solution is easy. Once you create a new typography AS file, open it up and go to line 15. Change the variable ‘__heights’ to ‘__height’, and word wrapping will work.

Update 2: A new version of the DynamicText3DMultline class has been released with new features. Please check out the new post.