We're not part of the solution

Month: April 2009

Flash AS3: Sequential loading with BulkLoader

BulkLoader is an open source AS3 Library created by Arthur Debert that enables easy loading of multiple assets. This behavior is exactly what I needed for a recent project. I needed to break a large flash website into multiple swfs so that the site preload remained small. I wanted the remaining site pages (individual SWFs) to load in the background, one at a time, after the initial site load. If a user requested a page that hadn’t loaded yet, the background loading would pause and the requested page would load immediately. BulkLoader is designed for exactly this sort of heavy lifting and it saved me a lot of development time.

I’ve created a picture loading demo below to show exactly how this works:

As you can see, I have used BulkLoader as a sequential loader (loading only one image at a time). After bulk loading has begun, you can request any of the images immediately. At this point, BulkLoader will pause the current download and switch to loading the requested image. As soon as that is complete, it will resume the previous download.

There are a few important caveats when using the BulkLoader library:

  • BulkLoader behaves differently on a web server than in the Flash IDE. When testing BulkLoader, it is important to test it on a web server to get accurate results. The Flash IDE is not able to correctly simulate functions such as pause() and loadNow(), so they should be tested in a browser.
  • BulkLoader behavior also varies slightly between browsers . In Firefox3 and Safari, paused downloads are restarted from the beginning when they resume. Internet Exploder 7 actually pauses and resumes downloads correctly (go figure!).

As always, you can download source files here. The code is fairly straightforward and I have added lots of comments. Please note that this sample is designed as a demo only - I sacrificed a lot of elegance in the code for the sake of simplicity.

You can get the latest version of BulkLoader here. You will also find online docs and a very helpful discussion list moderated by Arthur Debert himself. It's a great place to get help using BulkLoader or just drop in and say thanks to Arthur.

Flash AS3: target vs. currentTarget

While learning Actionscript 3, my button rollovers were not working correctly. The problem was that I didn’t know the difference between target and currentTarget or between MOUSE_OVER and ROLL_OVER. I made an example to demonstrate and I hope to explain it in a way that will save you some time.

AS3 Mouse events use two different properties: target and currentTarget. “target” is the object that fired the MOUSE_OVER (or MOUSE_OUT) event. “currentTarget” is the Movieclip that you applied the listener to. In the example below, the top 2 buttons have MOUSE_OVER and MOUSE_OUT listeners. Each button is made up of 6 different MovieClips. As you rollover the button on the left, the target fades. As you rollover the button on the right, the currentTarget fades. So, you want to use currentTarget right?

WRONG! Watch the output text window at the bottom of the Flash movie as you rollover the button on the right. Even though it appears to be highlighting correctly, it is actually firing a MOUSE_OVER event for every movieclip inside the button! This is not what you want! You want the event to fire once – when you rollover the button. This is where mouseChildren comes in! In the second row of buttons, I have set the mouseChildren property of both buttons to false. This means that none of the internal movieclips will fire an event. Now, when you rollover the buttons, you can see that they highlight correctly and that the target and currentTarget values are the same.

But there is an easier way – use ROLL_OVER and ROLL_OUT! These events automatically ignore the the internal structure of the buttons and register events only on the object that the listener was assigned to (in this case, the button itself). Most of the time, these are the events you will want to use. I rarely use MOUSE_OVER or MOUSE_OUT for anything.

I hope this example helps to clear up some confusion. You can download the source files here and play around with them.

Wasted potential is a blog!

Wasted potential is now a blog! I have had this domain for about 4 years now and I’ve only ever kept it updated when I was looking for a new job. Well, I thought it would be a good idea to do something useful with it, so I’m creating a blog. Mostly what you will find here is tutorials, source code and helpful tips about Flash, Actionscript 3, CSS layout, and other web development issues. I work as a Flash and web developer and my job would be impossible without blogs and forums full of people willing to give their time and expertise to help others. This is my effort to give back. I hope you find something you can use here.

You may find broken links or things that just don’t look right. Please email me and let me know about these problems so I can make the wasted potential experience nicer for everyone.

Thanks,
Andy.

Powered by WordPress & Theme by Anders Norén