Creative Technologist and User Experience Consultant

Setting up FDT for Away3D and Flash Player 11 (Beta)

Posted on 2011-08-13

FDT and Away3D

Recently I had been approached to develop an interface for a huge interactive wall. The company has its own engine, but the interface runs as a Flash Player piece within that environment. I am not talking about Scaleform, which allows game developers to integrate interfaces built in AS3 into their projects, but the logic is pretty much the same.

So the idea was to use some simple 3D shapes and let users interact with it via a touch screen. The project did not go through, however I had done some research on the latest Flash Player beta developments and the latest alpha release of Away3D. As expected, I had to do a lot of searches in Google, I cursed at my computer once or twice, but I did learn a lot. I think it would be nice to share my discoveries.

Setting up FDT to publish onto Flash Player 11 Beta

I have to say a lot of people wrote blog posts already on how to do that. Although their posts explained more on how to use the incubator version of Flash Player, it's pretty easy to do a parallel. I'll just list the steps here and provide the sources to my information further down.

  1. Get the latest available Flash Player debugger, Flex SDK and playerglobal.swc (by the way, since the IDE is now called Flash Builder, why is the SDK still called "Flex SDK " rather than "Flash SDK"?)
  2. Uninstall whatever version of the player you have on your computer and install the latest one you have downloaded
  3. Replace the playerglobal.swc in the SDK with the separate playerglobal.swc you have downloaded
  4. Set up the SDK in FDT
  5. When creating a new project, make sure to add the -swfversion=13 compile argument (I hope this will be dropped when the release is no longer in beta)
  6. In your HTML page, do not forget to set wmode="direct" so the rendering can be done on the GPU

Now these steps are really well explained here, although since the release of the beta version (rather than the incubator version), it is no longer necessary to remove the flex.swc.

Now, all this is a bit of work to get running, and just recently, FDT released a template that sets up a lot of that stuff already. This template includes the compiler argument and an HTML template that presets the wmode, it even includes the M2D library, which is supposed to help creating 2D elements with the Stage3D API to enjoy the benefits of GPU rendering. Thanks guys! I guess now I want to look into creating templates.

Setting up Away3D

Away3D sources and libs

I have been reading good comments here and there about Away3D, and the running examples I have seen were quite convincing, so I decided to look into it. Getting started is quite simple.

  1. Download the Away3D 4.0 alpha release
  2. Add the provided source files to your classpath
  3. Add the provided Apparat LZMA decoder library as well

Logically, this should be it and you should be able to go, but nooo! Have you ever seen a development project work properly on the first try? Especially not a project that uses both an alpha release and a beta release! After a bit of research, I found an article on DisturbMedia's wiki that basically explained the situation:

Most errors come from I'm not sure why, but I found that if I split the multiple classes nested in the single file into multiple files that fixes most of the errors. At the end of the process you should have 3 additional classes: Sampler, Register and OpCode.

Once the split classes are added, some errors remain in the Away3D sources, however it is possible to compile an empty project at this point.

Next, you would expect to be able to use some Away3D classes already, so did I. The base requirement is to add a View3D, which contains a container that can be used as some sort of stage. Let's try:

ActionScript 3.0:

  1. package
  2. {
  3. import away3d.containers.View3D;
  4. import flash.display.Sprite;
  5. import flash.display.StageAlign;
  6. import flash.display.StageScaleMode;
  8. public class Main extends Sprite
  9. {
  10. private var _view3D :View3D;
  12. public function Main()
  13. {
  14. // set the stage
  15. stage.align = StageAlign.TOP_LEFT;
  16. stage.scaleMode = StageScaleMode.NO_SCALE;
  18. // create the View3D
  19. _view3D = new View3D();
  20. addChild(_view3D);
  22. //
  23. addEventListener(Event.ENTER_FRAME, enterFrameHandler);
  24. }
  26. private function enterFrameHandler(event:Event):void
  27. {
  28. // render the View3D at every frame (or other update of your choice)
  29. _view3D.render();
  30. }
  32. }
  34. }

Try and run that with the explanations I have given so far, you'll most probably run into the same situation I did: an error. Why? I mean, nothing seems wrong.

Here again, it took me a bit of research, but it turns out that a class needed a correction to handle a change made by the beta release of Flash Player. As I understand, this library was mostly written while the player was still an incubator release. Simply get that updated Stage3DProxy class with the one provided in the forum thread, and you're good to go.

From this point on, you can head to minute 2:30 of John Lindquist's tutorial to see how to add an awesome cube to your project, or look into the Away3D examples. Enjoy!

4 Responses to “Setting up FDT for Away3D and Flash Player 11 (Beta)”

  1. [...] that your environment is set up to play with Away3D, let's create something! In my previous post, I concluded that you can now experiment, and so I did [...]

  2. [...] un exemple sous FDT [...]

  3. [...] FDT All links were found on website [...]

  4. [...] FDT 以上所有链接都可以在Regart.net上找到 [...]

Leave a Reply