制作自己的Flash面板 JSFL扩张FLASH功能面板【转载】

制作 组件面板 其他面板 控件面板

Flash 有很多内置面板，调色面板、对齐面板、元件库面板等等。
有时为了工作方便，我们需要自己编写一些脚本加快处理一些重复性较大的工序，这里所说的“脚本”就是 JSFL。

JSFL 全称 Flash JavaScript，它类似于 Microsoft Word 中的“宏”（虽然我不太懂那东西），帮助用户在创作环境中执行重复性任务、或者生成一些特效什么的，但这并不是我们这次所说的重点。

我们今天制作的Flash面板正是调用了JSFL来处理一项重复性较大的任务：快速替换元件库中所有元件中的特定文本。

首先我们来看看熊猫所写的这一段 JSFL：
var lib = fl.getDocumentDOM().library;for(var i in lib){for(var j in lib[i]){ //遍历所有库元件if(lib[i][j].itemType=="graphic"||lib[i][j].itemType=="movie clip"){ //判断，只有图形元件和影片元件里含有文本for(var k in lib[i][j].timeline.layers){ //遍历图层for(var n in lib[i][j].timeline.layers[k].frames){ //遍历所有帧for(var m in lib[i][j].timeline.layers[k].frames[n].elements){ //遍历所有帧里的可视元素if(lib[i][j].timeline.layers[k].frames[n].elements[m] == "[object Text]"){ //只有文本才执行下面的操作if(lib[i][j].timeline.layers[k].frames[n].elements[m].getTextString()=="愚蠢的熊猫"){ //获取你需要操作的字符lib[i][j].timeline.layers[k].frames[n].elements[m].setTextString("聪明的兔子"); //替换字符}}}}}}}}

这段代码的基本意思就是通过用JSFL把元件库中所有的文本取出来，然后对其内容做判断，进而替换新的内容
（只对元件库中的元件有效）。

01. 现在我们打开Flash，在场景中加入两个输入型的文本框和一个按钮，再加入一些说明文字；

02. 如上图所示，上面的文本框（实例名：ori_txt）我们可以输入查找的字符，
下面的文本框（实例名：new_txt）我们可以输入要替换成的字符，
最下面的按钮（实例名：btn）是用来执行JSFL的。

03. 接下来我们在AS层加入代码。首先为按钮编写侦听点击事件和执行函数：
btn.addEventListener(MouseEvent.CLICK, runScript);function runScript (e:MouseEvent) {var otxt:String = ori_txt.text; //点击按钮后读入文本框的字符var ntxt:String = new_txt.text; //同上var jsfl:String;MMExecute(jsfl);}

大家可以留意到 MMExecute(); 这东西，它就是用来执行JSFL脚本的。
而我们预留了一个叫“JSFL”的字符型变量，这将被用来装载熊猫所写的JSFL脚本。

04. 特别需要留意的是我们的JSFL到了ActionScript必须变成一个字符串，所以我们得对准备好的JSFL做以下事情：

- 把特殊字符用转义字符处理好；
- 双引号变单引号；
- 把所有代码变成一行；

于是我们得到没有换行的代码：
var lib = fl.getDocumentDOM().library;for(var i in lib){for(var j in lib[i]){if(lib[i][j].itemType=='graphic'||lib[i][j].itemType=='movie clip'){for(var k in lib[i][j].timeline.layers){for(var n in lib[i][j].timeline.layers[k].frames){for(var m in lib[i][j].timeline.layers[k].frames[n].elements){if(lib[i][j].timeline.layers[k].frames[n].elements[m] == '[object Text]'){if(lib[i][j].timeline.layers[k].frames[n].elements[m].getTextString()=='愚蠢的熊猫'){lib[i][j].timeline.layers[k].frames[n].elements[m].setTextString('聪明的兔子');}}}}}}}}

05. 这个时候基本上把上面的代码代入JSFL变量就好了，但是那只能把“愚蠢的熊猫”变成“聪明的兔子”，
我们的文本框干嘛去了……

所以我们得把代码断开，断在“愚蠢的熊猫”和“聪明的兔子”处，为了好看，我们用这么几个字符型变量装载着：
var str1:String = "fl.outputPanel.clear();fl.outputPanel.trace('Start replacing text...');var lib = fl.getDocumentDOM().library;"var str2:String = "for(var i in lib){for(var j in lib[i]){if (lib[i][j].itemType=='graphic'||lib[i][j].itemType=='movie clip'||lib[i][j].itemType=='button'){for(var k in lib[i][j].timeline.layers){for(var n in lib[i][j].timeline.layers[k].frames){for(var m in lib[i][j].timeline.layers[k].frames[n].elements){if(lib[i][j].timeline.layers[k].frames[n].elements[m]=='[object Text]'){if(lib[i][j].timeline.layers[k].frames[n].elements[m].getTextString()=='";var str3:String = "'){lib[i][j].timeline.layers[k].frames[n].elements[m].setTextString('";var str4:String = "');fl.outputPanel.trace('---');}}}}}}}}";var str5:String = "fl.outputPanel.trace('All text replaced.');";

上面我加入了 fl.outputPanel.clear() 和 fl.outputPanel.trace()，它们会在输出面板清除和显示文本，用来提醒用户脚本的执行情况。

06. 通过第5步把代码断开以后，我们就在第6步把代码重新组合起来，这时可以把从文本框取得的变量包括进来了：
var jsfl:String = str1 + str2 + otxt + str3 + ntxt + str4 + str5;MMExecute(jsfl);

07. 至此Flash部分就完成了，我们按照FlashPlayer9，AS3输出SWF，然后把这个SWF放到以下路径就完事了：
X:\Documents and Settings\UserName\Local Settings\Application Data\Adobe\Flash CS4\zh_cn\Configuration\WindowSWF
(红色部分按实际情况替换)

08. 终于大功告成了，打开Flash，在菜单“窗口 — 其他面板”下就可以找到你刚才创作的面板，欢呼吧！

09. 请把第7步的SWF文件删掉……

10. 都 2010 了，怎么也得搞点新意思，确保你已经安装了“Adobe Extension Manager”，打开你的记事本，把下面的代码粘贴进去：
<?xml version="1.0" encoding="UTF-8"?><macromedia-extensionname="ReplaceText"version="1.0"type="flashpanel"requires-restart="true"><author name="Libins" /><products><product name="Flash" version="9" primary="true" /></products><description><![CDATA[ Quickly replace text on the Library - miniCG.com ]]></description><ui-access><![CDATA[ Access the Renamer Panel by selecting 'Window > Other Panels > ReplaceText'. ]]></ui-access><license-agreement><![CDATA[]]></license-agreement><files><file source="ReplaceText.swf" destination="$flash/WindowSWF" /></files></macromedia-extension>

这是典型的XML，我不说了…… 直接保存为 UTF-8 编码、扩展名为“mxi”的文件，不会的话面壁去。

11. 运行 Adobe Extension Manager，在文件菜单下找到“封装扩充功能”的选项
（简体中文版的名字可能会有点不同），
点击之后对弹出个对话框，选择刚才保存的 mxi文件点确定（swf必须和mxi放在一起），紧接着会弹出对话框让你保存封包好的 mxp文件。
这个 mxp文件可以通过双击来安装你制作的扩展面板，双击之后 Adobe Extension Manager 会自动运行，
显示一堆法律条文后问你是不是要安装这个扩展面板。这能让用户把第7步那条该死的路径彻底忘掉，
通过一个简单的 mxp文件就可以让更多的用户分享你的作品。