The last few years have produced some really cool things and one of them has been the ability to create Flash content for the Desktop. Wrapped inside one small Exe. The result is an array of Flash apps with a wide variety of functionality. This opened up a window, an area were I wanted to focus on and find a way to easily Skin and "reSkin" these applications. Using external Png files (used for it's alpha 100% blending) as the visual data and XML files as the references and layout data, the result being the "DynaSkin Library 1.0". For example, a Button with four states - Up,Over,Down and Disabled. Design your states in Photoshop, or your choice of image editor and save them as one Png file. Create an accompanying Xml file defining your states and you have the following:
(Fig: 1)
The following Png file (Fig:2) is used for the skinning of the button, view the Xml sample here. For now the xml needs to be created manually for each Skin Object, but we are working on a Skin xml generator created in AIR.
(Fig:2)
The above is an example of an SkinObject with four states and a general button behavior. This type of skinObject is called "button", other types include, "Single","Double" and "Item". Version 1.0 of this Library only allows you to have these predefined Types. Future release will allow you to setup custom types to be created.
Here is a sample application that uses the "DynaSkin" Library for its components and a small bit of Actionscript code to manipulate the different types of SkinObjects inside its Ui.
(Fig: 3)
Files: DynaSkin Library V1.0 - Zip format. The documentation for this library is still a work in progress, I hope to have full docs for this before the next release. The sample files and Demo app will provide sufficient information on methods and properties available in the Skin Object.
UPDATE: I've added a close button, MICON V1.1 is avaliable, same link as before.
In case you get bored reading this, download the app first :). I've called it MICON, and its a application that allows you to extract system icons used for a file/folder, and save them as a transparent png. Download it here.
Screenshot:
I've used this application as an opportunity to cover aspects of AIR I was interested in. I've implemented custom chrome(transparent), resizing, drag n drop (to and from desktop), fileSystem access amongst other things. I've also implemented multiple windows, just to test performance, and it is amazingly easy, fast, and light on system resources. (I've taken this out, since it's not needed in MICON). I have only tested the app in Windows, so I would be interested to get feedback from Macintosh users.
This is my first official ascoza post, as well as my first AIR application. I've been postponing getting my hands dirty in AS3, mainly because it looked like a massive jump from AS2. It is a big jump, but not as radical as I expected. For those of you out there, contemplating migrating to AS3, I can definitely recommend it. If you are used to implementing 3rd party libraries, it will be easy to pick up AS3. A lot has changed yes, but the documentation is very good, and there are decent samples to work from.
Once I've cleaned up the code, I will release the source. I also plan on updating the application, to add more functionality to it (post suggestions - even it's just related to the current version [1.0] ). I am not sure how hardcore the .ico file format it, but if it's something I can get my head around, I would like to the ablility to package icon files from png's. I don't have much experience with binary data, so I'm not sure how long this will take me. Maybe there is allready a kind of iconEncoder actionscript library (pls let me know if you know of one).
