Using Flex Builder for Flash CS3 Code Editing
DIGG IT!
19
Comments
Published
Thursday, August 30, 2007
at
3:46 PM
.
Well this morning I jumped back into Flash CS3. I was pretty shocked about the lack of code hinting for custom ActionScript 3 libraries, I am addicted to Flex Builder now. Also I was confronted by the seeming lack of support for using Flex Builder for ActionScript 3 Flash CS3 editing. It looks like you can use virtual files and folders to fix this problem. Here is how to do it:
1. Open Flex Builder 3 (Beta 1)
2. Create a new ActionScript Project, any project name will do!
3. Delete the generated ActionScript base class (Here is where things get virtual).
4. File > New > File or File > New > Folder
5. Select Advanced on the Dialog, Check "Link to file in the file system"
6. Select Browse and select your "Document Class" AS3 class file.
7. Press "Finish"
If you map all your dependent libraries into this project virtually, you will get code hinting for custom classes in Flex Builder for a Flash CS3 Project. The key is to use the ActionScript project to map to all the files and folders you need, including the class paths within your Flash CS3 application. Assuming everything is there, you will get code hinting for all custom classes, properties, and events.
With projects in Flex Builder (Eclipse), it doesn't matter where the files are located. Use virtual files and folders to bring files located all over together in one project. This will simplify development and allow you to organize projects easily regardless if the project is Flex, AS3, or Flash CS3.
I am using this for PV3D development and having code hinting for all these custom classes is invaluable. Shoot even organize imports and refactoring works!
Cheers,
Ted :)
Yeah, using virtual folders is great. What I'm having a difficulty with is being able to use all fl.* classes in Flex.
Sometimes I'm trying to edit an actionscript file which uses one of the utiltity classes in the fl.* package, and the Flex compiler gives me "Definition [fl.class_path:daClass] could not found" Which kinda makes it hard to use flex for CS projects, unless you're just using Flash as fancy component creator. (Yes I'm using the Flex Component Kit for Flash CS3)
But when you've got people on the team, some using Flash CS3 to edit the AS, some using Flex, it makes it hard, cause I don't know if it's a class reference I honestly left out, or if the Flex compiler is just complaining again. So for the time I save coding in Flex Builder, I spend it in Flash double-checking the integrity of the build, which is a waste.
I've tried importing the source path for every AS3 class in the Flash CS3 installation, and no dice. The code hinting works, but not the compiler. I even tried importing every Flash CS3 component into one big swc to see if that would make a difference. Nope.
Maybe it's because the Flex compiler thinks that mx.data.* conflicts with fl.data.* ? Even though I'm not using the Flex Framework?
Is there any way for the Flex compiler to recognize the "missing" fl.* package classes?
Thanks.
I love using FlexBuilder for my AS editing, but it would be awesome if there is could be somewhere to test the FLA from within FB. FlashDevelop has this feature and its very handy.
I agree with John, I want to compile my FLA from within FB. I'm sure it can be done but I don't know how.
What's also funny: Flexbuilder dumps tons of warnings about AS3 classes from the fl* package in Flash. Take Button for example, line 216:
var focusPadding = getStyleValue("focusRectPadding");
(focusPadding has no type declaration)
I got loads of these missing type warnings when I use Flex to work on Flash projects. I know I can ignore these warnings but I think some people may get confused by this.
We just need to package up an SDK for Flash CS3 in SWC form. Assuming we can add "Flash Project" this will automatically configure things against the CS3 SWC containing the AS3 libraries and CS3 components. Compiling with MXMLC is not ideal given there are some minor differences in the ASC implementation on both sides above the raw bytecode output. Ideally this SWC would allow Flex Builder more optimized code hinting and errors while real compilation occurs over in Flash CS3.
If Flash Develop can do it, Flex Builder can. I know there are some ANT tasks or MMC calls to make this work. It will take some exploration and some work but I can see this workflow getting much smoother. With an IDE as good as Flex Builder there is no excuse for this not working with Flash CS3.
Plus come early 2008 everyone will be demanding this. :)
Ted :)
Honestly I prefer to use Flash Develop but not Eclipse(especially Flash CS3 project, no Eclipse). I don't have time to find how to tunning Eclipse, snippet, word wrap, better help panel(not another Java window, I need the Flash CS3 one). I think Adobe should make FB easier to use for us with necessary features that we need quite often. Or, give us design mode of Flex inside Flash CS3 (if we have both license). That's the only thing I need for Flex project together with Flash CS3.
No offence, but it seems like a bit of a hack to get the two products working together considering the effort put in place to get importing across the CS3 apps (PS/AI to Flash).
Now, is there a way to use a Flex Library SWC in Flash CS3? I'm talking about a lib without Flex SDK dependencies. That way you can write code libraries for Flash users without having to distribute the AS files, and without creating two build paths.
I can get a Flash CS3 project to compile against the SWC, but the code isn't actually embedded into the SWF. Any hints?
Derek,
Projects in Eclipse are just maps of file systems and using virtual files and folders is a perfect fit. I wouldn't call it a hack but I agree there are some rough edges. Once inline compilation is there, "Flash Project", and a SWC for all CS3 Classes that works against MXMLC, it will be about as seamless as it can get.
Eclipse is wildly misunderstood. The value in Eclise is the eco-system. In choosing Eclipse you have access to thousands of extensions for every language in existance, every version control system, ANT for automation and much more. Sure it is hard to learn at first but it is a professional IDE and capable of maintaining huge projects. It is battle tested and great once you get the hang of it.
My 2 cents!
Ted :)
Ted,
Sorry if that came off harsh. I should have used "not ideal" instead. I realize Eclipse and Flex Builder are awesome for development - that's why I have such a problem with the Flash IDE, and why I wish there was a better way to integrate them. Being able to use FB to edit AS files instead of the Flash IDE is great.
In order to get code hinting for fl.* and other Flash classes in Flex Builder for a Flash project, right click on the project and select "ActionScript Build Path" and choose the "Source path" tab. Add the following directories (mac version, windows is similar but has a different root)
/Applications/Adobe Flash CS3/First Run/Classes/FP7
/Applications/Adobe Flash CS3/First Run/Classes/FP8
/Applications/Adobe Flash CS3/First Run/Classes/FP9
/Applications/Adobe Flash CS3/First Run/Classes/mx
/Applications/Adobe Flash CS3/Configuration/ActionScript 3.0/Classes
/Applications/Adobe Flash CS3/Configuration/Component Source/ActionScript 3.0/FLVPlayback
/Applications/Adobe Flash CS3/Configuration/Component Source/ActionScript 3.0/User Interface
Just watch out that when you do find and replace, you don't wind up changing the code of your base classes.
At the moment I don't have error detection and the problem panel working, any tips on that that?
I agree that a swc would be great. The ideal setup for me would be the ability to compile using the Flash CS3 compiler directly from Flex Builder, although I don't know of any command line interface other than mxmlc or mtasc.
Overall I much prefer writing code in Flex Builder, however I wind up doing lots of switching back and forth to compile, which slows me down.
Jon Marston
marstonstudio.com
I have been looking into this area of code development as well. The only downside to developing flash on a mac (if you do not use any vmware) is that you lose flashdevelop. Using flex builder as a workaround helped, a pity its a workaround rather than an actual solution
Colin Moock's post today may help...
"HOW TO USE FLASH CS3'S V3 COMPONENTS IN FLEX BUILDER"
I found this and looks like it should help --> Flash CS3 SWC for FlexBuilder
http://labs.thesedays.com/2007/04/16/flash-cs3-swc-for-flexbuilder/
I must be doing something wrong. Setting linked folders as described above just doesn't work for me (builder 3 beta) with respect to code-completion. However adding a source path does work:
Project > Properties > ActionScript Build Path > Source Path > Add Folder
Personally, I can't imagine writing Actionscript for Flash projects without FDT (http://fdt.powerflasher.com/flashsite/flash.htm). The company I work for has actually made this the standard tool for Flash devs and I know we're not alone in that.
It's not free, but it's a damn good tool. I haven't tried FlashDevelop in ages, so I can't compare, but it's well beyond Flex Builder for AS editing. The public beta for v3 (with AS3 support) was just released though I haven't had a chance to check it out, yet.
I'm in agreement with Jeff. FDT is the standard where I work as well, and I can't imagine using anything else. I've been participating in the closed beta and things are really shaping up.
Yep, FDT 3 is in its own class for AS 2.0 and 3.0 code development. And you can bind either a FLA file with the built-in Flash CS3 compiler or .AS file to a Flex framework internal compiler. Not to mention you can add/exclude to source path different folders as packages in the base source folder. FB can;t.
The thing though is FDT does not have a debugger, neither v 1.0, nore v 3.0.
For code editing it;s superior but in the long run, for complicated projects with plenty of trial and error cycles, it's an endless switch between FDT 3.0 for coding and FB 3.0 for eventual debugging.
And why on earth is Flex Remote debugging so limited?
Note that if you want to see compile time errors using this method, you need to set the linked document class as the 'Default Application' of the project (Right click on the document class file in FB Flex Navigator -> Select 'Set as Default Application').
Also note that you cannot debug projects setup this way. If you want to debug your projects (which is incredibly useful), you need to setup a regular AS3 project in FB and load in your assets from a library SWF.
Well I followed Moocks example but now the FB parser does not show errors when I put bad AS code in.