FlashLib – Using Flash Library assets in Flex2 applications

[kml_flashembed movie="http://www.acmewebworks.com/Images/blog/FlashLibDemo/FlashLibDemo.swf" width="600" height="300"/]

Grant Skinner just posted his FlashLib extension for the Flash 9 alpha IDE / Flash CS3 with a great explanation of how it prepares your library for use in Flex2. He calls em’ "Shake n’ Bake SWF’s", I call em’ buiscuits of joy! Ok enough with the Southern references Why do I think this is SO friggin’ cool?? Because it allows me to VERY easily work with my MovieClip textures for my Papervision3D models – THAT’S WHY. The Xwing above, which we’ve seen on several occasions, now uses a MovieClip ( MovieMaterial ) for the skin rather than an externally loaded JPG or embedded bitmap within the compiled Flex2 app. For this demo, you’ll see that I’ve added some really simple animations. Engine Glows on the back and an orange dash that flows along the body in the front. The orange dash also has a Glow filter applied Now the workflow is rediculously cool. Modify the texture as a MovieClip in the Flash IDE like any other day, use the new FlashLib Create command in the commands list and bam – I have a FlashLib.swf and a FlashLib.as class to compile with my Flex2 app. Usage in Flex2 is straight forward: [as] package { import flash.display.DisplayObject; import flash.events.Event; import flash.events.EventDispatcher; import flash.events.IEventDispatcher; import flash.events.TimerEvent; import flash.utils.Timer; import mx.containers.Canvas; import org.papervision3d.core.utils.Collada; import org.papervision3d.events.FileLoadEvent; import org.papervision3d.materials.BitmapFileMaterial; import org.papervision3d.materials.MaterialsList; import org.papervision3d.materials.MovieMaterial; import org.papervision3d.objects.DisplayObject3D; import org.papervision3d.scenes.Scene3D; import org.paperworld.events.ObjectReadyEvent; import org.paperworld.objects.PaperworldCollada; public class ColladaSceneLoader extends EventDispatcher { public static var COLLADA_LOADED:String = “xwingLoaded”; public var container:Canvas; public var file:String; public var scene:Scene3D; public var texture:DisplayObject; public var xwingTexture:MovieMaterial; private var collada:PaperworldCollada; private var matsList:MaterialsList = new MaterialsList(); private var timer:Timer = new Timer(10,0); public function ColladaSceneLoader(target:IEventDispatcher=null) { super(target); } public function getObject():DisplayObject3D { return collada.getObj(); } public function init(p_file:String, p_scene:Scene3D):void { file = p_file; scene = p_scene; FlashLib.eventDispatcher.addEventListener(Event.INIT, handleImageInit); } private function loadCollada():void { collada = new PaperworldCollada(“xwingContainer”,scene, matsList, file, .0012); collada.addEventListener(ObjectReadyEvent.OBJECT_READY, handleColladaLoadComplete); } private function handleBitmapLoaded(e:FileLoadEvent):void { loadCollada(); } private function handleImageInit(e:Event):void { texture = FlashLib.getInstance(“mainSkin”); xwingTexture = new MovieMaterial(texture); xwingTexture.oneSide = true; matsList.addMaterial(xwingTexture, “xwingTexture”); loadCollada(); } private function handleTimerUpdate(e:TimerEvent):void { xwingTexture.updateBitmap(); } private function handleColladaLoadComplete(e:ObjectReadyEvent):void { timer.addEventListener(TimerEvent.TIMER, handleTimerUpdate); timer.start(); dispatchEvent(new Event(COLLADA_LOADED)); } } } [/as] In the init for the class, I call [as]FlashLib.eventDispatcher.addEventListener(Event.INIT, handleImageInit); [/as] When the INIT event fires handleImageInit creates the instance using FlashLib and then goes on normally to create the MovieMaterial object that can be added to the materials list for the COLLADA scene: [as]private function handleImageInit(e:Event):void { texture = FlashLib.getInstance(“mainSkin”); xwingTexture = new MovieMaterial(texture); xwingTexture.oneSide = true; matsList.addMaterial(xwingTexture, “xwingTexture”); loadCollada(); }[/as] And, as usual, this was JUST in time for something I’m cooking up for FITC – Grant’s timing couldn’t have been more perfect as this little gem brought it all together Check it out over on Grant’s blog: http://www.gskinner.com/blog/archives/2007/03/using_flash_sym.html RockOn Rating:

FITC 2007 – Toronto

What do you get when you cross an axe and a wii? splintered white plastic? a happy axe? a psychotic blend of midi/wii joy? a ROCK ON experience you’ll never forget? We’re not talking "wii" like, "I gotta go man, pull over NOW!" We’re not talking about "wii" like, "oh those puppies are soo adorable!" We’re talkin’ about " W\m/ "!! The kind of wii we’re talking about causes involuntary outbursts like: "DO IT AGAIN!!" "RIGHTOUS! RIGHTOUS! RIGHTOUS!" "ELEVEN’S NOT ENOUGH!!" "ROCK ON \m/" If you find yourself at FITC Toronto 2007 this year, catch Red5’s presentation and get yer dose of Rock for the day! I’m planning on trying to find the time to get this all working together, but if it does, we’ll have some people helping out in the audience and get some groove on with their wii’s. Disclaimer: I’m partly insane – i’m not a guitar player, I’m a hack, but I LOVE playing and I figure, why not make a TON of noise with some rowdy Flashers liker yerselves – am I right??!

New Era of Flash gaming article

I just posted on Papervision3d.org some thoughts I’ve had since launching the Obstacle Course game and wanted to direct some attention and comments over there.

The game has received alot of great comments and suggestions! We had SO many hits on Sunday, we had to restart the server!

Anyway, some of the comments on the game prompted the article on Papervision3D’s blog:

New era of Flash gaming? Yeah, I think so.

First Papervision3D Game!

Anyone remember the original 1992 Xwing game? When you first started playing the game, you had to do obstacle courses to learn how to fly the various ships. They all had their strengths and you needed to learn how to navigate using those strengths basically. I couldn’t find a screen shot online of the obstacles, so the ones I created are purely from memory. But they’re fun and they get the job done, so how cares, right? I added a little mutliplayer element with the Leader Board (that added a couple extra days), and I think it really makes it 1000x’s more fun if you see your friend’s times The workflow was incredible on creating this game! All told, i think this is probably about 4weeks work, and that’s with all of the learning curves. I was able to create all courses in 3D Studio Max, export as collada and load at runtime! All I had to do was right a little code around handling the child objects of the collada object (better known as obstacles) and whenever I loaded a new course, it already knows where they are and how many etc. Then, to allow for more obstacles to be used in a course, I only show 10 at a time. Couldn’t be easier to create new corses! I think with this demo, we can see Paperworld taking shape as this uses many of the same features and principles of what we’re putting together for Paperworld.  On my laptop with dualcore2, it smokes at 30fps! The objective is simple: Follow the arrow and get through all of the obstacles as fast as you can. Tips: WATCH YOUR SPEED – DO NOT JUST HOLD DOWN “W” – TAP IT TO SPEED UP AND USE “S” TO SLOW AT THE OBSTACLES TO MAKE YOUR TURNS. Use the roll keys (A, D) to orient yourself to the oncoming obstacle. If you don’t have a fast computer, flying in cockpit view helps give you some extra speed by not rendering the Xwing Go fullscreen and back to gain speed while playing in the browser (remember to go back, otherwise your keys won’t work in fullscreen mode) Check out the videos: Ring Race video Cork Screw video Speed Test video REQUIRES FLASH PLAYER 9.0.28 OR HIGHER – CLICK HERE FOR ADOBE DOWNLOADS Play it here!

Rings Race Speed Test Cork Screw