OK, if you want to work in AS3 or Flex2 with FlashDevelop, I think I’ve made it about as easy as it can possibly be until we get a new version of the program that has all this built in.
I created two new Ant-based templates. These include a fairly complex build.xml file, and a very simple and easy to read build.properties file. For the most part, you should never have to touch the build.xml, just change your values in the build.properties, which looks like this:
######################################
## project properties
######################################source.file=App.as
output.file=App.swfdeploy.dir=deploy
source.dir=src# values are tab, standalone, or html
launchmethod=html######################################
## output swf properties
####################################### note: no # or 0x on color value!
background.color=ffffff
framerate=31
width=550
height=400######################################
## tools
####################################### where you installed flex:
flex2.dir=C:/Flex_2_sdk# works well with firefox. IE needs some work.
browser=C:/Program Files/Mozilla Firefox/firefox.exe# most of this shouldn’t need to change
compiler=bin/mxmlc.exe
saplayer=player/debug/SAFlashPlayer.exe
flashdevelop=C:/Program Files/FlashDevelop/FlashDevelop.exe
As you can see, you set your input and output files and directories, and choose a launch method, which can be “tab” (launch swf in FlashDevelop), “standalone” (launch swf in standalone player), or “html” (launch your browser with the html file created for your swf – more on that in a moment).
Then you set your output swf properties, such as background color, frame rate, width and height.
Finally, tell it where your programs are: your Flex 2 install directory, browser, and FlashDevelop.exe are the important ones.
Then just open the supplied base source file, add your own code, additional files, etc. and compile using Ant (more on that in a minute, too).
HTML Template.
The project comes with a swfobject based html template. For now, I’ve included the swfobject.js file right in the templates, but I’m checking on whether or not it’s cool to distribute it like that. Compiling your project will also create a custom html file based on the template, and put that in the deploy directory. This is what it launches if you choose “html” as a launch method.
Installation.
0. Install the Flex 2 sdk. This is kind of a given, but I’ll mention it.
1. Download the templates and unzip them into your projects template directory in FlashDevelop. (I’m sure you can find it if you dig around.)
2. Install Ant if you haven’t already. Here’s some data on that if you need it.
3. Install the RunCommand plugin, which you can find here:
http://www.flashdevelop.org/community/viewtopic.php?p=3496
One thing I didn’t realize about this at first is that when using this plugin, FlashDevelop automatically changes the directory to the project dir. So no more hacks needed for that!
4. Add the following line to your ToolBar.xml file in the FlashDevelop installation folder (you can find that too). You’ll probably want to choose your own shortcut key, as I’ve messed with mine a bit, and F7 does something else by default.
< button label="ANT Build" click="PluginCommand" image="54" tag="Run;SaveAll;ant" shortcut="F7" />
5. Restart FlashDevelop, create a new project, choose one of the new ones, tweak your build.properties, add some code, hit F7 (or whatever) or the new button on the toolbar, and behold the Flash 9 goodness!
Just checked, and it’s cool to distribute the swfobject.js file. It’s just been updated, and the updated version is included, but you might want to keep an eye on it, so you can replace it in your project templates when a new version comes out:
http://blog.deconcept.com/swfobject/
Very nice, Keith. Works like a charm. Now we’ve just gotta get the code completion working 🙂
One question: I prefer my launch shortcut to be Ctrl + ~, but it doesn’t seem to like me entering Ctrl~ into the shortcut attribute. Any suggestions?
Thanks!
Ben
Great job Keith!
Ben, shortcuts are limited to the .NET Shortcut enumeration:
http://www.flashdevelop.org/community/viewtopic.php?p=79
Hi Keith,
I am having trouble getting it to work using files originally created in Flex Builder. My guess is that the compilation is failing because I keep getting this error: D:\_projects\Flex\FD\PSA\build.xml:38: Warning: Could not find file D:\_projects\Flex\FD\PSA\PSA.swf to copy.
Is there any way to capture the output of the compile command to see why the swf isn’t being created?
Thanks,
Ben
You should be getting compile output in the output panel.
You are right, if it’s not finding the swf, it’s because the compilation of that swf failed usually.
The output was in the output panel, I just didn’t notice it because it gets scrolled all the way to the bottom and there is no text visible. You have to click on the scrollbar twice to go to the top to see error messages.
I am noticing a timing issue when launching the swf in ‘tab’ mode. My app loads a local xml file on startup, and when launching inside FD it seems to run the swf while it is still in the project directory because I get a ‘file cannot be found’ type of error. Switching to html mode fixes the issue. Is there any reason not to compile the swf straight into the deploy directory?
Thanks,
Ben
There seems to be something fishy with the code generated using this process. If I run the generated html file in IE (manually), one of my web service calls errors out every time. The same files work flawlessly in Firefox.
for message #6, is it a file not found error? or something else? I’m getting a security sandbox error when i try to load a local file, which I don’t quite get. Digging into the security docs now.
for #7, I wonder if it’s a problem with the swfobject tag I made. Does it work if you just use a normal object/embed tag? Or does the swf work if you compile it with the command line compiler directly? I don’t see how the project could be messing up anything in the swf, because all it’s really doing is running a command line saying:
mxmlc.exe [options for bgcolor, framerate and size] input.as -o=output.swf
Hi,
Is there any way I can use trace() command with AS3 Projects? When I place a trace command, it is not listing in the FD Output Panel. Please help on this issue…
Thanks
Regards
Elan
Elango, that’s a good question. Just came up with an answer too!
http://www.bit-101.com/blog/?p=843
Hey Keith,
For #6 I am getting this: Error #2032: Stream Error. URL: file:///D|/%5Fprojects/Flex/FD/config/config.xml
This is really weird. It seems as if the swf is being run from the parent directory of my project directory (FD) rather than the deploy directory (FD/Test/deploy), but I don’t quite understand how that is possible considering the structure of the build.xml file. What is even stranger is that it happens (same error msg) when I compile directly to the deploy directory.
For #7, the problem persists even if I replace the swfobject call with an object/embed tag generated by Flex Builder. The problem is only in IE though, everything is fine in FF. Very strange. And disconcerting.
for #7, what if you compile in flex builder? does the error go away?
for #6, I’m not sure what’s going on, but i’ll keep trying to figure it out.
I don’t currently have access to FB (trial ran out, waiting to purchase) but all the code came straight from a working FB project that was always viewed in IE.
Make sure in your build paths you use forward slashes and not back slashes, compiler chokes it as a character. I did this for the flex sdk path and it wouldn’t compile. 😉