• 使用JSFL高效率做Flash
    时间:2012-03-21   作者:佚名   出处:互联网

    JSFL指Flash JavaScript,是JavaScript脚本文件,是用来扩展Flash IDE的重要工具。学会它、熟练使用它之后你会惊讶的发现,哇,原来可以这么高效率的做Flash啊!下面我们来看一看怎么使用JSFL。

             不知道各位朋友有没有使用过Flash IDE中的“历史记录面板”?如果没有用过的话,赶紧Ctrl+F10调出来看一看吧,因为本文的内容将从它身上开始。
             在Flash IDE中(本人使用Flash CS3 Professional)按下R键(矩形绘制工具的快捷键),在舞台上拖动鼠标绘制出一个矩形。观察“历史记录面板”,你会发现面板中添加了一个名为“矩形”的动作。选中“矩形”动作,“历史记录面板”右下角那个磁盘图标按钮将被激活,点击该按钮保存命令为“DrawRect”。 接下来,删除刚刚在舞台上绘制的那个矩形,然后选择Flash菜单栏的 “命令”菜单,你会发现弹出菜单中多了一个名为“DrawRect”的选项,点击“DrawRect”选项看看效果吧。
             如果你以前从来没接触过JSFL,你肯定会疑问:“DrawRect”选项是怎么跑到“命令”菜单中去的?点击它后舞台上立即绘制出了一个矩形,这是什么原理?下面我们就来探索一下其中的奥秘。
             打开C:\Documents and Settings\Brant\Local Settings\Application Data\Adobe\Flash CS3\zh_cn\Configuration\Commands (注意,Local Settings文件夹默认是隐藏的,你需要显示隐藏文件才可以看到)。在这个文件夹中你会发现一个名为“DrawRect.jsfl”的文件,用文本编辑工具打开它(本人使用FlashDevelop或UtrlEdit打开),看看里面的内容,看不懂没关系,先了解一下里面的代码可以在舞台上绘制一个矩形就OK,这个东西就是jsfl。接下来,你该在Flash IDE中按F1输入“jsfl”查看一下相关帮助文档了。首先看一下有关JSFL的作用说明,然后重点关注“扩展Flas -> 对象”里的内容,看得差不多了之后,在帮助里输入“library” (或Document、Item、outputPanel等等词汇),仔细认真的看一看“扩展Flas -> 对象”里的东西。不要惊讶“居然有如此多的内容!”。嗯,这部分知识点的内容的确挺多的,都是Flash IDE的JavaScript API,使用这些API可以实现Flash IDE环境中的所有动作。要完全研究透它,需要学习一下JavaScript,不过不用紧张,很简单,因为JS跟AS基本上一样,关键字、语法、结构都是统一遵循ECMA Script标准的,跟据AS习惯,你猜着写也能写出JS代码来,学习曲线会比较平滑。好了,那些内容你自己慢慢研究吧,这里我就不等你看完,下面我将写两个简单的例子来示范一下怎么使用JSFL:
             【注】 下文中目录C:\Documents and Settings\Brant\Local Settings\Application Data\Adobe\Flash CS3\zh_cn\Configuration\Commands统一简称为Commands
    示例一,BitmapBatRename(给库中的图片批量命名):
    第一步:新建一个文本文档,粘贴如下代码到文档中,保存到Commands目录下,保存名字为“BitmapBatRename.jsfl”。注意扩展名是jsfl而不是txt哦。
    var doc = fl.getDocumentDOM();
    var uxi = doc.xmlPanel(fl.configURI + "Commands/Rename.xml");
    if(uxi.dismiss == "accept")
    {
             var items = doc.library.getSelectedItems();
             for(var i = 0; i<items.length; i++)
             {
                      items[i].name = uxi.prefixName + i;
             }
    }
    第二步:新建一个文本文档,粘贴如下代码到文档中,保存到Commands目录下,保存名字为“Rename.xml”。注意扩展名是xml哦。
    <?xml version="1.0" encoding="utf-8"?>
    <dialog buttons="accept,cancel" title="Bat Rename Tool" >
             <label value="请输入名称前缀"/>
             <textbox id="prefixName"/>
    </dialog>
    第三步:新建一个Flash文档,导入一组图片到库里,选中库中的一张、几张或者全部图片,选择“命令-> BitmapBatRename”,在弹出的对话框里输入一个想要的名字,然后点击确定,看一看库中的图片的名字有什么变化。OK,示例一结束。
    示例二,GetLibraryItemProperty(将库中的元件的属性输出到输出面板,并允许保存为xml):
    第一步:新建一个文本文档,粘贴如下代码到文档中,保存到Commands目录下,保存名字为“GetLibraryItemProperty.jsfl”。
    var doc = fl.getDocumentDOM();
    var lib = doc.library;
    var items = lib.items;
    fl.outputPanel.clear();
    fl.trace("<?xml version=\"1.0\" encoding=\"utf-8\"?>");
    fl.trace("<list>");
    for(var i = 0; i < items.length; i++)
    {
             var type = items[i].itemType;
             var name = items[i].name;
             var className = items[i].linkageClassName;
             fl.trace("    <item type=" + "\"" + type + "\"" + " name=" + "\"" + name + "\""+ " className=" + "\"" + className + "\"" + "/>");
    }
    fl.trace("</list>");
    var xui = doc.xmlPanel(fl.configURI + "Commands/saveOutputPanel.xml");
    if(xui.dismiss == "accept")
    {
             fl.outputPanel.save(xui.url);
    }
    第二步:新建一个文本文档,粘贴如下代码到文档中,保存到Commands目录下,保存名字为“saveOutputPanel.xml”。
    <dialog buttons="accept, cancel"  title="保存输出面板信息" >
             <hbox>
                      <label value="URL:" />
                       <textbox id = "url" size="30" multiline="false"/>
                       <buttons="accept, cancel"/>
             <hbox>
    </dialog>
    第三步:新建一个Flash文档,导入一组图片到库里,先给它们都取上名字,添加好导出Action类,然后选择“命令-> GetLibraryItemProperty”。 在保存文件的对话框中填入文件路径,点击保存之后在指定的路径下就可以看到一个xml了, 它记录了库中所有元件的“元件类型”、“元件名称”和“链接类名”。【注意】保存文件的时候填入的文件路径的写法哦:例如,你想将生成的xml保存到F盘下的myxml文件夹中,保存的文件名为“list.xml”,则路径如下填写:file:///F|/myxml/list.xml。OK,示例二结束。
             JSFL功能很强大,更多功能请各位自己去慢慢探索,本文仅仅作为不懂的朋友入门之用。在学习JSFL的过程中有一个窍门——在IDE中随意操作,保存历史记录,然后观察生成的JSFL代码来学习。Over!

    ***********************************************************************

    作为一个有些经验的FLASH开发者,想必都会形成一些自己的开发习惯,比如很多人都喜欢把主时间轴第一层命名为:“AS”,第二层命名为“Label”,类似这样的劳动都是重复的,我们有办法可以简化它们么?答案是肯定的,于是jsfl隆重登场了。

    什么是jsfl?

    如果说AS是用来在SWF运行时运行的脚本,而jsfl则是在Flash编辑环境下运行的脚本。在这里我不想用太多专业的术语打击新手继续学习的信心,我想先带大家做一个非常简单的实验,实验环境:操作系统(Win XP2),FLASH开发环境(FLASH 8 简体中文版)。

        首先把你的文件后缀名显示出来:→工具→文件夹选项→查看→把“隐藏已知文件类型的扩展名”选项取消。
        随便在那里右键新建一个空的TXT文本文件。
        打开FLASH8,然后新建一个fla,这时候你会看到时间轴上已经自动产生一个图层“图层 1”。
        在FLASH中打开“历史记录”面板。
        然后将时间轴“图层 1”改名为“AS”,这时观察“历史记录”面板,你会发现多了一条“层命名”。
        然后右键点击“层命名”,在弹出菜单中选择“复制步骤”。
        打开你的TXT文件,然后粘贴,这时你会看到TXT文件中出现一段代码:
        fl.getDocumentDOM().getTimeline().setLayerProperty('name', 'AS');
        保存你的TXT文件,并重命名为:“把图层命名为AS.jsfl”。
        将你的“把图层命名为AS.jsfl”放到类似下面路径的文件夹下:
        C:\Documents and Settings\Administrator\Local Settings\Application Data\Macromedia\Flash 8\zh_cn\Configuration\Commands
        其中,Administrator是你的系统用户名。
        这时候点击FLASH主菜单栏中的“命令”,你会发现在“运行命令”的横线下面多了一条“把图层命名为AS.jsfl”的选项。
        再新建一个fla,然后选择“图层 1”,并执行“命令”菜单中的“把图层命名为AS.jsfl”,你会发现,“图层1”被自动命名为“AS”了。

    上面的实验告诉我们什么?


    相信大家已经能简单的体会到jsfl的作用了,它可以通过一些jsfl脚本自动完成对应的FLASH编辑操作。另外我们还应该了解到如下知识才算阶段性毕业:

        jsfl是一种脚本语言。
        jsfl文件应该放在那里。
        如何运行一个jsfl命令。

    jsfl脚本只能从“历史记录”面板中生成么?

    当然不是,“历史记录”面板所能生成的jsfl非常有限,要想实现复杂的功能,就必须自己手动写Flash JavaScript代码了。至于jsfl的官方专业解释,大家可以去查看FLASH 8帮助文档中的《扩展 Flash》一书,书中还有jsfl的应用示例和程序字典,我就是看着这本书自己研究的。

    jsfl到底有多强大?我们有必要学jsfl么?

    jsfl多强大我还不能确切的告诉你,因为我也没深入学习呢:)但用过ASV5的朋友应该都知道,ASV5能把SWF中的所有元素都分离出来,并产生一个jsfl文件,然后运行这个jsfl文件就可以把那些分离出来的元素组合为一个fla源文件了,由此可见jsfl的强大能力了吧?至于有没有必要深入学jsfl,那要看你的兴趣和工作需要,火山目前的工作可能需要批量生产一些结构复杂却类似的SWF,于是对火山来说,jsfl就比较重要了。

    个满足火山日常开发习惯的综合例子:

    火山开发习惯:目前我在开始一个面向过程的项目之前,以下三个工作是必不可少的。

        时间轴最上层建立“AS”层和“Label”层
        AS” 层第一帧写如下注释:
        //================系统设置================//
        //——————变量初始化
        //——————数组初始化
        //——————对象初始化
        //——————系统初始化
        //——————界面初始化
        //================功能逻辑================//
        //================函数模块================//
        库里建立三个文件夹:“0-image”,“1-sound”,“2-公用元件”。
        →好了,需求有了,我们就开始写代码吧,前面我们已经知道jsfl文件应该放的位置了,这次就直接在那里建立一个“火山习惯.jsfl”,然后写下面的代码:
        //第一步:自动产生AS层和Label层
        fl.getDocumentDOM().getTimeline().addNewLayer("AS");
        fl.getDocumentDOM().getTimeline().addNewLayer("Label");
        //第二步:在“AS”层第一帧上添加注释
        var layerIndex = fl.getDocumentDOM().getTimeline().findLayerIndex("AS");
        fl.getDocumentDOM().getTimeline().layers[layerIndex].frames[0].actionScript = '//================系统设置================//\n//——————变量初始化\n//——————数组初始化\n//——————对象初始化\n//——————系统初始化\n//——————界面初始化\n//================功能逻辑================//\n//================函数模块================//\n';
        //第三步:在库里自动创建文件夹
        fl.getDocumentDOM().library.newFolder("0-image");
        fl.getDocumentDOM().library.newFolder("1-sound");
        fl.getDocumentDOM().library.newFolder("2-公用元件");

    新建一个fla,在“命令”菜单里运行“火山习惯”,看一下效果吧:)

    网友留言/评论

    我要留言/评论

    相关文章

    每个程序员都应读的书 - 首推《代码大全》:“如果能时光倒流,回到过去,作为一个开发人员,你可以告诉自己在职业生涯初期应该读一本,你会选择哪本书呢?我希望这个书单列表内容丰富,可以涵盖很多东西。” 很多程序员响应,他们在推荐时也写下自己的评语。以前就有国内网友介绍这个程序员书单,不过都是推荐数 Top 10的书。其实除了前10本之外,推荐数前30左右的书籍都算经典,笔者整理编译这个问答贴,同时摘译部分推荐人的评语。下面就按照各本书的推荐数排列。
    JavaScript中的基本数据类型介绍:大家经常可以见到javascript中的一些数据类型,比如“undefined”、“boolean”、“string”等等,但是ECMAScipt中的变量又是松散类型的,所谓松散类型就是可以用来保存任何类型的数据。所以javascript中用var关键字来定义变量,所以无法确定变量一定会存储什么值,也就不知道变量到底会是什么类型,因为可以随时改变变量的类型。今天这篇文章就和大家一起来学习javascript中的类型,这个问题虽然简单,但是还是有很多童鞋在很多时候没办法真正掌握它,其中不正确的地方请大家指出来,共同学习,共同进步。
    使用jQuery控制图片的hover效果:本文介绍如何网站中应用添加超酷的hover效果
    极其实用 10 款 jQuery 日历插件:以下日历插件都非常棒,非常实用,下面分享给开发者们。
    6个强大的JavaScript日期操作插件:我们必须承认,JavaScript内建的Date方法实在是太基础了,远不够我们来处理日期。总有人会开发自己的JavaScript日期操作库,为何在能够使用已经开发并测试好的日期插件时还要再自己造个轮子呢。我已经碰到过很多次需要操作日期格式的情形,这些插件将节约大把的时间。
    Memcached 真的过时了吗?(Redis和Memcached比较):这两年Redis火得可以,Redis也常常被当作Memcached的挑战者被提到桌面上来。关于Redis与Memcached的比较更是比比皆是。然而,Redis真的在功能、性能以及内存使用效率上都超越了Memcached吗?
    UI端编程的22个问题 - 经验之谈:以下是结合了我这些年来从事UI端编程的经验,我将用一系列文章来搭建用户界面(UI)的底层框架,这里我使用的技术实现是Silverlight,但是,你将会发现,我所介绍的都是UI端的设计思想,所以是超越于语言,是不局限于技术实现的,所以,它将适用于Windows Form, WPF, FLEX, HTML5,以及所有手机编程领域Phone7, IOS, Android。
    vim 中替换命令的技巧汇总:VIM无疑是非常强大的,学会其中的命令会使你事半功倍,下面本文列举一下替换命令的一些技巧。