Home > Dev, Random Picks > Setting up Eclipse for Flash Development

Setting up Eclipse for Flash Development

February 18th, 2010 Leave a comment Go to comments

This guide explains how to set up a Flash and Flex development environment with Eclipse, FDT, Flash Builder and a couple of other editors that you want for ActionScript coding and Flash development with style! This guide is based on Windows because that’s what I’m using but I’m sure you Mac and Linux guys can figure out the parts that differ on your OS! Let’s get started …


INGREDIENTS


  • Java Runtime – In case you don’t have it installed yet. Choose either the Standard Java Runtime from Sun or  – my recommendation – the JRockit Runtime from Oracle. The latter is a highly optimized version of the Java Runtime. It’s free but you have to register an account at Oracle to download it.
  • Eclipse Platform Runtime Binary – We want the bare bones version without all the additional junk. We’re going to add the stuff we need later. Don’t worry! It’ll be a smooth ride if you follow this guide.
  • Powerflasher FDT – The best tool for ActionScript coding … with a price tag! But you don’t want to skimp on professional tools for professional work, do you?! We’re going to install this from within Eclipse later!
  • Flash Builder PlugIn – I’d list this as optional since the only advantage of it over FDT is currently it’s visual editor. You don’t want to code ActionScript in this once you’ve used FDT, believe me!
  • Other Eclipse PlugIns: HTML-, JavaScript-, XML-, CSS- Editors, Apache Ant (via JDT). These are all tools we need every now and then. Gratifyingly, the Eclipse project provides excellent versions of all these.
  • Even more Eclipse PlugIns: Subclipse and Mylyn. Both optional! Subclipse for accessing SVN repositories and Mylyn as a great coding task tool. Both get installed later via Eclipse.

Other Tools you might need/want:

  • Flex SDK – FDT ships with it’s own Flex SDK but they are usually a step behind the latest version so I prefer to use SDKs that stand on their own regardless of what FDT ships. Be sure to pick the ‘Adobe Flex SDK’, not the ‘Open Source Flex SDK’ since that one is missing a few things. Also you might want to have several different SDKs installed like for example Flex 3.x and Flex 4 which you can target individually from FDT. If you want to use Ant build files later to build your projects it’s a good idea to place the SDKs in a clean and easy folder hierarchy, e.g. let’s say I have Flex SDK 3.5 and 4.0 on my system then I would put them under C:\Users\username\Applications\FlexSDK\3.5.0 and C:\Users\username\Applications\FlexSDK\4.0.0. I remember having trouble with spaces in path names when I experimented with Alchemy hence I decided to not put the SDKs into a subfolder in ‘Program Files’.
  • Flash Player Runtimes – Debug versions, release versions, browser plugins and whatnot. I typically disregard all the versions that come with any Flex SDK or Flash IDE and copy the newest version into a folder that always stays the same (for example C:/Program Files/Adobe/Flash Player/Debug/FlashPlayer.exe and C:/Program Files (x86)/Adobe/Flash Player/Release/FlashPlayer.exe) because it can get messy if you have X different SDK versions plus the Flash IDE, plus Flash Builder etc. installed that all come with their own runtimes.
  • Adobe AIR – because Flash development would be only half the fun without it!
  • Adobe Flash – The ol’ Flash IDE. If you code with this you will become impotent but it’s still great for putting visual assets together and use these as SWC’s with FDT.
  • Alcon – My own little debugging and logging tool. There’s a good choice of similar loggers out there but Alcon still serves me well. Suit yourself.

INSTALLATION


  1. Java Runtime
    This should be straightforward! Choose the one you prefer from the links above and install. If you go for the JRockit one, you might want to set an environment variable (under Windows) named JAVA_HOME that points to your JRockit runtime path. For example I have my JRockit installed in C:\Program Files (x86)\Java\jrrt, (under Windows 7) open the Start menu, from there navigate to Control Panel/System and Security/System, click the Advanced system settings link on the left of the window, in the System Properties dialog click the Environment Variables button, then click the New… button under System variables and enter JAVA_HOME as the Variable name and C:\Program Files (x86)\Java\jrrt\jre (in my example) as the Variable value. You might have to reboot or at least relogin for this setting to take effect.
  2. Eclipse
    Download the Eclipse Platform Runtime Binary (currently v3.5.2, ~47MB) and unpack it. Copy the Eclipse folder to where you like, typically something like  C:\Program Files\Eclipse but I prefer to have my installation under C:\Users\username\Applications\Eclipse. The reason for this is that under Windows with UAC turned on Eclipse will create an additional folder in your user location where it stores all your installed PlugIns so you end up with two locations in that things get installed. This led to discrepancies more than once for me before due to ambiguous PlugIn installs. Very, very annoying so eventually I decided to keep it simple and have it in a non-UAC protected location.  The C:\Users\username\Applications folder is my place for all applications that have trouble with UAC.
    Either way, you have your Eclipse where you want it, next step is to edit the eclipse.ini. Your default eclipse.ini will look similar to this:

    -startup
    plugins/org.eclipse.equinox.launcher_1.0.200.v20090520.jar
    --launcher.library
    plugins/org.eclipse.equinox.launcher.win32.win32.x86_1.0.200.v20090519
    -showsplash
    org.eclipse.platform
    --launcher.XXMaxPermSize
    256m
    -vmargs
    -Xms40m
    -Xmx256m

    And this is how it ‘should’ look after you edit it:

    -vm "C:\Program Files (x86)\Java\jrrt\jre\bin\javaw.exe"
    -startup
    plugins/org.eclipse.equinox.launcher_1.0.200.v20090520.jar
    --launcher.library
    plugins/org.eclipse.equinox.launcher.win32.win32.x86_1.0.200.v20090519
    -showsplash
    org.eclipse.platform
    --launcher.XXMaxPermSize
    256m
    -vmargs
    -XX:MaxGCPauseMillis=10
    -XX:MaxPermSize=128m
    -XX:PermSize=64m
    -XX:+UseParallelGC
    -Xms128m
    -Xmx1024m

    If you don’t use JRockit you can skip the first line, if you do use JRockit you need to adapt the first line to point to your JRockit jawaw.exe!
    The -XX:MaxGCPauseMillis=10, -XX:MaxPermSize=128m, -XX:PermSize=64m and -XX:+UseParallelGC lines are not mandatory but they improve performance (or so I’ve heard!). Just be sure to set Xms and Xmx high enough, to at least 128 and 512, but better 1024 (Eclipse and FDT need LOADS of RAM!).
    Next fire up Eclipse and choose your Workspace location. Eclipse will present itself with its nice and warm intro screen …

  3. JDT & Ant
    Click through to the Workbench (the arrow on the right) and from the menu choose Help/Install New Software… then in the Install window  where it says “Work with:” choose the Galileo update site (Galileo – http://download.eclipse.org/releases/galileo) and in the tree list that shows up, unfold the Programming Languages branch and check Eclipse Java Development Tools. Then click the Next button and follow the install procedure. Restart Eclipse when it asks you to do so after the installation.
  4. HTML-, JavaScript-, XML- and CSS- Editors
    This is the exact same procedure as in step 3 with the difference that you unfold the Web, XML, and Java EE Development category and check the Eclipse Web Developer Tools, Eclipse XML Editors and Tools and the JavaScript Developer Tools.
  5. Subclipse
    Next things next! For Subclipse we need to add the update URL to Eclipse. Open The Eclipse Install window again, click the Add… button and enter Subclipse 1.6 as the name and http://subclipse.tigris.org/update_1.6.x as the location (or you might wanna check the official Subclipse site for any newer update URLs) …
    … Hit OK and choose the required Subclipse components from the tree list. You need at least the parts that are marked as required but I also pick Integration for Mylyn, the SVNKit Library, SVNKit Client Adapter and the JNA Library. Can’t hurt to have them on board! After that click Next ansd from there on the procedure is very much the same as before with step 3 and 4.
  6. Mylyn
    We can install Mylyn and all its dependencies again from the Galileo update site just as above under step 3 and 4. You’ll find Mylyn in the Collaboration category. I’ll go for Mylyn Task List, Mylyn Task-Focused Interface, Mylyn WikiText and Mylyn Bridge: Eclipse IDE. There are some other bridges for other Languages if you want them but since FDT has no support for Mylyn yet there’s nothing for ActionScript. However we can still put Mylyn to good use for our ActionScript programming, we just don’t get the same task-focused integration as with Java or C++.
  7. FDT
    Time to install the FDT trial! We need to enter the update site just as with Subclipse in step 5. For the update site enter FDT as name and http://fdt.powerflasher.com/update/ as the location (or check the Powerflasher website in case the URL changed). Pick the FDT version(s) that you want to install from the tree list, hit Next and go drink a coffee! Installing FDT will take a couple of minutes. Don’t forget to restart Eclipse after install!
  8. Flash Builder PlugIn
    At last we install Flash Builder! This step is wholly optional! If you don’t have any use for Flash Builder’s visual editor I actually recommend to skip this step and instead enjoy a more lightweight Eclipse without Flash Builder.
    Head over to Adobe and download the Flash Builder PlugIn trial version (at the time of this writing it’s the Flash Builder 4 beta 2 which can be found at the Adobe Labs). You might be required to register at Adobe to download the trial.
    Next quit your Eclipse and start the downloaded Flash Builder installer. Go through the installation steps and when it asks for the Eclipse install choose Plug into another copy of Eclipse and enter the path to your freshly prepared Eclipse location …
    … continue the installation, then go drink another coffee, installing Flash Builder takes long!
  9. Bonus Step
    Download this slick Splash screen and replace the unlucky default Eclipse Splash screen with it by copying it to your Eclipse/plugins/org.eclipse.platform_x.x.xxx… folder. ;-)

And that’s all for now! With this setup you have your one-stop-shop for Flash and Flex development at your fingertips! In the next part I will try to guide through some configuring of Eclipse, in particular on how to use FDT and Flash Builder on the same project.

  1. February 18th, 2010 at 06:29 | #1

    Wow, a perfect writeup and possibly first few tools to install after installing Windows :)

    Thanks for sharing.

  2. kevin
    February 18th, 2010 at 09:06 | #2

    A co-worker of mine that visits the blog regularly thought the description of “Adobe Flash” was pretty funny…i thought you could have done better and have come to post what i replied back to him with …”if you code with the flash ide, you are a stupid son of a bitch that needs to be drug out into the street and shot”

  3. February 18th, 2010 at 18:23 | #3

    Excellent step by step instructions on a great product!
    The only one problem is price of FDT plugin for Eclipse. It costs a lot of money: around 599 euro (or $813) for FDT v.3.0. It costs more then Adobe Flash ($699). It will be nice if you’ll post the same instructions for some alternative products like FlashDevelop which are free.

  4. February 18th, 2010 at 19:48 | #4

    Actually I think subclipse is a dangerous plugin, especially if you use SVN commands in your ant scripts or any other svn client on the same computer. The versions of the plugins often don’t match and if they do once the svn repository gets brocken.

    FDT is indeed pricey. I am planning to check out IntelliJ Idea (with as3 support) but no schedule for it yet. I think it would be also important to note certain other things that might be useful for programming: like file associations, run targets, etc. but please use that just as a suggestion.

  5. February 18th, 2010 at 20:06 | #5

    @Igor Vasiliev aka The Helsman
    I agree, FDT is very expensive. I’m not sure how they justify the high price for ‘just an editor’. But then I’m not exactly in the position to complain since I have been on their beta program since a long time and therefore got a free license from PF (so such articles are my ‘thank you!’).

    I’m not really using FlashDevelop, sorry. The only reason why I would use it is for haXe. But, yeah, FlashDevelop isn’t bad at all for a free IDE!

  6. February 18th, 2010 at 20:11 | #6

    @Martin Heidegger
    Never had any troubles with (or repo-incompabilities among) subclipse versions. But I don’t use any SVN commands in my build files, maybe that’s why. What else would you recommend?

  7. john
    February 18th, 2010 at 21:01 | #7

    The “Ultimate Flash Development Environment” Does not exist. It would be one piece of software, available on mac, linux and pc, with a quick install and the same price tag on both sides of the atlantic)

    (3 – 7+ pieces of software, some of which I have to pay for, and few of which are available totally cross-platform is not a dev environment, it’s a joke. Sorry, but it is.)

    Thanks for the post though – I have to move over to linux sometime soon and I’m going to have to use java+eclipse+fdt, which means the same price tag and instability of the flash IDE……

  8. February 18th, 2010 at 21:35 | #8

    This is also mine and probably the best development invironment.

  9. February 19th, 2010 at 01:45 | #9

    Interesting article!

    But FDT does not support Flex 4, and therefore this wouldn’t be an option for me I guess. (my main project is in Flex 4)

    As a J2EE/Flex developer my IDE is “Eclipse MyEclipse (excellent Java editor that can be plugged into eclipse, with awesome code generation) Flash Builder 4″ most of the time, though a lot of people who are also hardcore AS3 developers have advised IntelliJ and I must admit allthough it’s not Eclipse based, it does have some very strong features.

    Would love to try FDT too but as I mentioned the lack of Flex 4 support had kept me from trying.

    Kind regards,

    Jochen

  10. kevin
    February 19th, 2010 at 01:50 | #10

    @Jochen Szostek

    You can point FDT to a specific flex sdk to use if necessary. I’m currently using FDT with the 3.4 sdk.

  11. February 19th, 2010 at 02:43 | #11

    @kevin
    I guess what Jochen means is that FDT’s Flex editor doesn’t bode well with the changed API/syntax if Flex 4? I must admit I haven’t delved much into Flex 4 yet. Seems we have to wait until the FDT devs add support for Flex4 and that will only happen after Flex4 went final (although I wish they’d add haXe support rather than all Flex stuff).

  12. Sprog
    March 11th, 2010 at 17:12 | #12

    You should consider checking out SourceMate ($79) for Flash Builder 4 it brings quite some features from FDT I missed in FB like code templates. Also I really like the refactoring features. Now I only need Quick Fixes in SourceMate!

  13. March 12th, 2010 at 15:55 | #13

    @sasha & @jochen check out FDT4 roadmap on http://fdt4comfort.com/ we are going to support both haXe and Flex4 very soon !

    Price wise, no excuses anymore ;-)
    We have an amazing offer this month that beats any price out there !
    http://www.fdt.powerflasher.com/developer-tools/fdt-3/community/promotions/

  14. March 13th, 2010 at 13:39 | #14

    @Bruno Fonzi
    Great to hear that you guys add haXe support after all! Really looking forward to that feature!

  15. Anthony
    August 14th, 2010 at 15:11 | #15

    Hey, when do we get the next part? TIA

  16. August 19th, 2010 at 05:08 | #16

    There’s another open-source start-up platform that is currently in active development: AXDT. I’d recommend it for those just starting with Flash development.

    See AXDT: open-source cross-platform alternative for Flash development for a how-to.

  17. August 19th, 2010 at 19:50 | #17

    Hands down flash develop and flex sdk, even for flex work once you get used to the kinks, it’s still a better environment. and the xml editor is great too. And all free!

    You don’t need flash or flex if you’ve got illustrator and flash develop.

    Haxe looks interesting though.

  18. January 26th, 2011 at 14:32 | #18

    Hey, great article with some nice elements. A little tip I found that might be of use for your guide. For the eclipse ini, if your using JRockit, get rid of the Xms and Xmx values and replace them with this, “Xgc:parallel”. This will enable the parallel GC which does not use these values. It has longer pause times on slower machines so if there are issues switch back but with our modern machines it helps eclipse just scream. Cheers!

  1. February 19th, 2010 at 20:02 | #1
  2. September 30th, 2010 at 06:51 | #2
  3. May 26th, 2011 at 17:30 | #3
  4. September 12th, 2014 at 09:15 | #4
You must be logged in to post a comment.