| 网站首页 | 站内资讯 | 原创图书 | 图文教程 | 视频教程 | 课件下载 | 远程网校 | 留言建议 | 视频教程吧 | 官方微博 | 
>>  您现在的位置: Flash课件吧 >> 图文教程 >> 动画教程 >> 正文
专题栏目
畅销教材
征稿与合作
如果您是计算机方面的专家或对计算机在某方面的应用有一定心得,我们真诚地希望与您合作。请下载作者信息表并认真填写。在邮件主题中注明寻求合作字样,我们将尽快给您答复。
  • 下载作者信息表
  • 邮件联系我们
  • 相关文章
    推荐图书
    [组图]Flash CS6新功能__与Air无关的
            ★★★   
    Flash CS6新功能__与Air无关的
    >>  教程简介: 
    作者:佚名 教程来源:本站原创 点击数: 更新时间:2012/11/23 9:41:25

        这篇关于Flash CS6的新功能与Air无关,所以也就和iOS,和Android无关。新功能主要包括Sprite和PNG序列导出,新的JSAPI,当然也有和HMTL5 Canvas有关的一点新功能。

    1. 图像导出

    CS6可以很方便的将影片剪辑、静态图像以及按钮导出为一张Sprite,或者一系列的png图片。

    首先来看一下导出Sprite。以下面这个怪物钳子的动画为例子。这是一个很简单的补间动画(Motion Tween),两个图层分别是钳子的两半,头尾两个关键帧(keyframe)只是调整了它们的旋转角度。


    实际上这段动画是一个名为LeftClaw的影片剪辑(MovieClip),在资源库(Library)里面可以看到。要将这段动画导出为一张Sprite,可以在库里边找到它,右键选择Generate Sprite Sheet...,便会出现下面这个导出窗口。


    大多数选项都在图片中有了简单的说明,下面只对右下方表明1-3的选项简单解释一下。

    ➀ Data format - 主要是针对不同的游戏引擎之类的会生成对应的文件,方便Sprite图像的导入。对图像本身是没有什么影响的。

    ➁ Trim - 注意到当前预览窗格每一帧图像都是等大的,间距相同,勾选Trim,会使它们的间距变得很紧凑。

    ➂ Stack frames - 如果被导出元件的所有图层在某一个时间段内是静态的,默认情况下这些重复的帧都会一个不漏的添加到导出的Sprite里面,导致Sprite里面有一系列连续的相同图像。勾选这个选项可以将这些一样的帧合并为一个,减小图片体积。 在上面时间轴的截图中,可以看到这个例子每一帧都是不同的,那么这个选项勾选与否不影响结果。

    此外,底部的Border Padding是最边上的图像到Sprite边缘的距离;Shape Padding指的是Sprite里各个图像之间的间距,可以配合Trim选项使用。

    最后只要点击Export,就会导出Sprite了。

    另外,除了在资源库(Library)里面用右键菜单进入到导出Sprite对话框之外,还可以直接在舞台上选中想要导出的元件的实例,右键选择Generate Sprite Sheet...。这个选项和在库里面的区别是,可以对舞台上的实例进行缩放、旋转、滤镜等操作,在导出选项中这些变化都会被记录。

    图像导出功能除了导出Sprite之外,还可以导出一系列png图像序列,每一张png图像都是动画的一个帧。只要在舞台或者库里边选中想要导出的对象,右键选择Export Png Sequence...,选好存储图片的路径,便会出现下面的对话框。


    在库里边操作和舞台上操作,尺寸会有所区别,可以在这个对话框手动调整。当然更直观的是先在舞台上调整好,然后直接点击OK导出。这个例子导出完成之后便可以看到生成的18张png序列图像了。

    2. 新的JSAPIs

    新增的图像导出功能也带来了一些新的JSAPI。

    Flash JavaScript文件主要是在Flash Professional里边自动化工作流的,类似Mac上的Automator。Flash的JSAPI在JavaScript上进行扩展,加入了Flash文档对象模型(Flash Document Object Model)。

    例如document.exportInstanceToPNGSequence方法可以将某个影片剪辑、静态图形或者按钮的实例导出为png序列文件;document.exportInstanceToLibrary方法可以将在舞台上选定的影片剪辑、图形或按钮元件的实例导出到库中的一个位图等。

    像上面讲到的把库里边的元件导出为一张Sprite,也可以通过一个名为Sprite Sheet Exporter的新增JSAPI来实现,例如循环整个库把所有元件导出到同一份Sprite上。

    对于这个功能具体怎么用还是参考文档吧,以前几乎没怎么用过。

    简单来说就是自己写一份扩展名为jsfl的文件,放到指定的位置(Mac上是Applications/Adobe Flash CS6/Common/First Run/Commands),然后就能在Flash的Commands菜单下面找到自己的自动化脚本。

    3. 性能和发布

    首先是性能方面的。当FLA文件包含一个很大的资源库(Library)时,在CS6里边浏览库的时候会更流畅一些。

    其次是关于发布的。

    在CS6里边新增了一个基于LZMA(Lempel- Ziv-Markov chain algorithm)的压缩选项。这个压缩方法对编译ActionScript和矢量图形较多的文件会有一定的优化,最高能够减小40%的swf体积。

    如果要使用这个压缩,可以在舞台上取消所有选择,这时应该能在属性(Properties)面板的发布(PUBLISH)选项卡下面找到发布选项(Publish Settings...)。在打开的发布选项对话框里面,展开高级(ADVANCED)选项卡,就能找到这个压缩选项了。


    需要注意的是,只有Flash Player 11.2+,Air 3.0+才能解压并执行使用LZMA压缩发布的swf文件。

    如果使用了Stage3D API,在CS6里边,当发布对象为Air时,需要到Application Settings里面把渲染模式改为Direct;当发布为HTML时,需要到发布选项(Publish Settings...)对话框的HTML Wrapper一项里面把Window mode改为Direct,才能调用GPU正常渲染。

    4.将Flash动画转换为HTML5 Canvas动画

    最后是关于CreateJS的Flash Professional CS6扩展。可以在这个地址下载到:

    http://www.adobe.com/products/flash/flash-to-html5.html

    这个扩展插件可以将Flash动画导出为HTML5 Canvas动画,只能安装在CS6上,装好之后可以在Window-Other Panels-Toolkit for CreateJS打开相应的控制面板。

    这里仍然使用之前怪物钳子的动画,但是使用了Drop Shadow滤镜制作了阴影效果。在CreateJS控制面板上面直接点击Publish,变可以在FLA所在的文件夹生成HTML和JavaScript文件了。

    不过对于IK动画、Bitmap填充、遮罩、部分滤镜等效果会在转换后丢失。因此这里转换为Canvas动画之后,阴影效果就丢失了。图中左侧是有CreateJS转换的Canvas动画,右侧是原始的SWF动画。


    但是对于一般的动画来说,转换的效果还是挺好的,类似人物的一些复杂动画还是值得一试的。

    与Air无关的大概就是这么一些了。

      >> 教程录入:admin    责任编辑:admin 
    网友评论:(只显示最新8条。评论内容只代表网友观点,与本站立场无关!)
    | 设为首页 | 加入收藏 | 联系站长 | 友情链接 | 版权申明 | 管理登录 | 
    版权所有 课件吧 Copyright ◎2006 - 2013
    如涉及侵权行为请书面告之,本站将立即处理
    站长:cai8net  备案序号:豫ICP备13010258号