CSS sprites with AS3

CSS sprites is a very convenient way to use images. Graphics are placed into one file and CSS defines which part of the image is shown on mouse over and mouse click. One image could hold all graphics used on a website.

Flash has skins for components and the SimpleButton class is quite close to CSS Sprites. I wanted a simpler way to create buttons and use graphics. My IconButton class extends the SimpleButton and slices the given image and sets those slices as upState, overState and downState. HitState is always the upState. IconButton has one extra state: disabled.

MultiIconButton is an extended IconButton. Like its name implies, it has multiple IconButtons. Well, code-wise it has only one, but it has different phases so one image can have multiple different icons for various uses. The illustration below explains the principle. Jatka lukemista ”CSS sprites with AS3”

The simplest way to send an image from Flash to PHP without user interaction

With the FileReference class, it is quite easy to send an image to the server. But it requires user interaction. What if you need to send an image the user has drawn or captured form the webcam? Then send the data as a ByteArray and let the PHP save the raw data.

The bitmapdata of the image must be encoded to jpg or png and Adobe has classes for that: com.adobe.images.PNGEncoder and com.adobe.images.JPGEncoder. The contentType of the request must be ”application/octet-stream” and if you want to send parameters (file format, username, etc.), add them to the url as parameters: ”simpleSaveImage.php?fileformat=png&filename=cheetach.png”.

In the source files I’m using my ContentLoader to send the data. The sendBytes method  handles everything for you, but here’s also a summary of how to do it without the ContentLoader:
Jatka lukemista ”The simplest way to send an image from Flash to PHP without user interaction”

Versatile content / media loader: ContentLoader.as

ActionScript 3 introduced new ways to load content and new types of content – now Flash can handle raw bytedata. This also increased the complexity of the process. You need a Loader, URLLoader, URLRequest, event listeners…

ContentLoader is a class that simplifies the process into a one class that can fulfill most of the basic needs:

– send and load data

– load bytedata

– load variables

– hande errors

– load images, mp3s, xml, text (JSON too, of course, but parsing is not supported)

Example: Jatka lukemista ”Versatile content / media loader: ContentLoader.as”

Loading and handling external files in Flash: ExternalAssets.as

Here’s another helper class that loads one or multiple file(s) separately or all in a batch. There is one special feature: this class can check the filesize of each file (without fully loading them) and therefore it can show the loading progress of the whole batch not just single file. The loaded data is stored so the file or its size is never loaded twice.

This class uses my ContentLoader as the actual file loader. Read more about the ContentLoader »

Example: Jatka lukemista ”Loading and handling external files in Flash: ExternalAssets.as”

Loading an SWF and getting components from its library

Keeping all assets in one SWF causes problems while updating assests and compiling times are longer. Nowadays only crazy people add everything into a one SWF and the Flash platform has improved a lot to support alternative ways to embed, load and add assets.

The flash.utils.getDefinitionByName allows to load assets from the library of another SWF-file. I’ve simplified the process in my Utils.as and here is an example how to use it.

Main thing is to use the ApplicationDomain to keep the loaded SWF in its own domain. ApplicationDomain allows multiple definitions of the same class to exist and allow children to reuse parent definitions.
Jatka lukemista ”Loading an SWF and getting components from its library”

The ultimate VideoLoader with rtmp support

One of the best Flash production houses in Helsinki/Finland made a quite surprising comment while making a project with us: their own Flash video player can’t handle live streams. That functionality is very easily added and I’ve used my VideoLoader class (now version 4.X) in various video projects over the years.

Maybe someone else is missing a versatile video loader too, so here’s one. And I say Loader, because this class loads, plays, pauses, buffers, sends events, handles errors and does everything you need for handling video files, but it does not have any UI. But that’s what extends VideoLoader is for! Jatka lukemista ”The ultimate VideoLoader with rtmp support”

AS3 MagicWand

In one concept for a webshop I designed a tool where the user could fit clothes on her own image. One problem – images are not transparent, there was always a background, but usually a solid color. Well, the magic wand in Photoshop would be useful, but too many images to go through then and everytime new items are added. So I studied if Flash could be used and voilá: the MagicWand.as was created. Jatka lukemista ”AS3 MagicWand”

Ignoring black frames while starting a webcam

While playing with motion detection with a Webcam, I ran into a surprising problem. First n frames are 100% black. The number of frames vary, so this problem wasn’t solved with ignoring first 10 frames or anything similar. So I used getColorBoundsRect to detect any non-black pixels and when found, the WebCam class would start to send an event. The video will be visible before dispatching events, but it could be hidden until the event is dispatched. Jatka lukemista ”Ignoring black frames while starting a webcam”

My new best friend – describeType

Praise to the flash.utils.describeType – a method that became my number one friend when I was validating parameters set by user and solving how to validate proper data types without knowing what they were.

So, what does flash.utils.describeType do? In a nutshell it converts any class into a xml that describes

What’s in your Utils?

The Utils class is a collection of simple methods that carry out small tasks such as data converting and mathematical calculations. They are very general (and usually static) methods and therefore reusable in multiple projects. Actionscript has an inbuilt utils package (flash.utils).  What’s in your own Utils? Or are you using some other Utils package?

My Utils class includes i.a.:

getAsset – gets a class even from externally loaded SWF-files

convertClassToObject – converts a class into an object by collecting all properties that are readable and writable. Appends also new values if assigned and returns data types of all properties. This method uses the flash.utils.describeType method to convert classes to XML objects. Read my praise to this method!

cloneBitmap – clones a bitmap

HEXtoARGB & ARBGtoHEX – these methods converts an ARGB value to  HEX values and vice versa Jatka lukemista ”What’s in your Utils?”