Using Catalyst with FlashDevelop

Adobe have just released the first version of Catalyst, a great addition to the Adobe suite which addresses the long-standing annoyances of skinning Flex applications.  Basically Catalyst allows you to take a PSD or AI file, chop it up into Flex components, optionally add some interactions and then export the whole shebang info Flash Builder 4 so you can start coding.  However, Catalyst only wants to save a Flash Builder readable FXP file which is no use for the likes of us who use FlashDevelop.  Luckily it turns out that FXP files are just normal zips of the Flash Builder code tree, so we can extract the assets into a FlashDevelop project using a simple script.  Note that you will need to download unzip.exe and put it into your path for this to work.

First of all create a folder called ‘fxp’ in the root level of your FlashDevelop project.  Then save your Catalyst project to this project (you can call it anything as long as it has an fxp extension).  Then create a text file, also in the root of your project called ExtractCatalystProject.bat and put the following code into it:

   1: unzip.exe fxp/*.fxp -x html-template/* .* libs/* src/PrivateData.mxml mimetype

Now to import the Catalyst project into your application right click on the bat file and choose ‘Execute’.  Every time you make a graphical change in Catalyst run the script again to extract.  Obviously you’ll have to be careful not to make any changes to the generated code in FlashDevelop otherwise it will get overwritten next time you extract.

Obviously this is a very simple solution and there are certainly better ways to do this (C# script macro anyone?), but as a first solution this seems to work ok 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *