We finally upgraded to the Adobe CS3 suite at work, so last week I wrote up a recommendation document for importing PSDs into Flash efficiently and to the standard we want to receive our files in. (I will likely post the gist of that document here soon, it’s pretty informative.) Generally speaking, the way I do my Flash development is to keep the stage of my movies completely blank and attach every element through code. The FLA file generally exists more as a library than anything else. However, during the initial graphic production stage, in order to get all of the coordinates for the attachMovie script, I still had to rebuild the entire PSD in Flash.
So now that that rebuilding part of the process is automated, I’ve come up with a quick and simple way to automate the script-writing process that attaches the movie clips to the stage. For this to work, you have to have your movie set up correctly — or modify my script to work within your constraints. My movie clips always have the suffix “_mc” and buttons end with “_btn”. In my library, movie clips have the same linkage name as the instance name that I use, though without the “_mc”. So linkage is “logo”, instance name is “logo_mc”, etc. For buttons, linkage is “logoBtn”, instance name is “logo_btn”. Got it? Great.
So now you’ve got an FLA with your design all laid out just like the PSD, everything is on the stage, everything has an instance name and a linkage name in the library to match. It’s all set up right? Great, run this script:
(Pardon line breaks:)
for(var i in _root){
var linkage = (i.indexOf(”_mc”) != -1) ? i.substr(0,i.indexOf(”_mc”)) : i.substr(0,i.indexOf(”_btn”)) + “Btn”;
trace(’var ‘ + i + ‘ = evtObj.attachMovie(”‘ + linkage + ‘”,”‘ + _root[i]._name + ‘”,evtObj.getNextHighestDepth(),{_x:’ + Math.round(_root[i]._x) + ‘,_y:’ + Math.round(_root[i]._y) + ‘,_alpha:’ + _root[i]._alpha + ‘});’);
}
stop();
That’s going to output a bunch of code that looks like this:
(Again with the line breaks:)
var topnav_mc = evtObj.attachMovie(”topnav”,”topnav_mc”,
evtObj.getNextHighestDepth(),{_x:741,_y:0,_alpha:100});
var footer_mc = evtObj.attachMovie(”footer”,”footer_mc”,
evtObj.getNextHighestDepth(),{_x:284,_y:567,_alpha:100});
var navbar_mc = evtObj.attachMovie(”navbar”,”navbar_mc”,
evtObj.getNextHighestDepth(),{_x:10,_y:24,_alpha:100});
var field_mc = evtObj.attachMovie(”field”,”field_mc”,
evtObj.getNextHighestDepth(),{_x:10,_y:456,_alpha:100});
var sky_mc = evtObj.attachMovie(”sky”,”sky_mc”,
evtObj.getNextHighestDepth(),{_x:10,_y:0,_alpha:100});
var logo_mc = evtObj.attachMovie(”logo”,”logo_mc”,
evtObj.getNextHighestDepth(),{_x:765,_y:556,_alpha:100});
Paste that into your class that builds your ui and stop writing all of that pesky code.
Two things to keep in mind… define or replace “evtObj” with your correct path, and keep in mind that if you’re using components, getNextHighestDepth() don’t work so well. Use DepthManager or bake your own.