我用行为作动画系列教程(三)
点击次数：18 次 发布日期：2008-11-21 23:35:33 作者：源代码网
|
制作非线性交互的动画.对于一个初学者或是一个实现简单控制的动画创作者来说.行为是最佳选择.
只要你看过了上两节的内容.那到这次你应该对行为的应用有了一定的了解了.我们说应用行为也就是通过基于对话框的方式应用AS脚本.因为行为就是预先编制好的AS代码!通过你一系统附加行为的操作过程后.触发对象上就自动附加了AS代码.免去了你不会编写AS脚本的不足或是给你懒的编写AS脚本的机会.
这一节我们应用行为来控制影片剪辑的深度和应用行为来关联一个控制器或是显示组件.从而方便的加载和控制外部的*.FLV(flash视频文件)和*.MP3(声音文件).
应用行为来控制影片剪辑的深度
那什么是影片剪辑的深度?
我们所说的深度其实就是元件实例在场景中的堆叠顺序.
比如同一图层上放置的两个MC.那么深度大的要比深度小的靠前显示(当两个MC有重叠部分时你会看的更明显).
如果是两个图层上分别放置两个MC.那么靠上图层上放置的MC要比靠下放置的MC深度要大.所以它是靠前显示的.如果你交换了图层上下位置.那么图层上放置的MC深度也会相应变化.
我们举个例子简单说明一下.
在主场景中的同一图层上放置两个MC.分别叫MC1和MC2,把它们相位对置重叠一下.此时总有一个是被遮掩着的(比如例子中的MC2被MC1遮掩着).因为它们各自着有不同大小的深度级别.通过AS代码我们输出它们各自深度级别看一下.如图:
 深度是由FLASH自动生成或是由人为的通过AS代码来设定的.从而指定他们在场景中的堆叠顺序(或是称为显示重叠顺序).我们在这里只作一个简要的说明.为的是下面应用行为时你能更好理解.有关深度的更多信息请查看FLASH的帮助.
好了现在我们开始用行为实现MC的深度交换.从而设计一个动态的图片查看效果.(往往也用来制作个性导航栏的.有兴趣的朋友可以学完这个例子自己作一个导航栏)
首先看一下选中MC时.行为面板中关于”影片剪辑”的行为有些什么?~
下在这个效果我们就是完全运用有关”影片剪辑”的行为作出来的.
分析一下这个效果:假设我们有一组图片.当鼠标移上去的时候.位于鼠标下的图片就会放大并显示在所有图片之上.也就是说不会被其它的图片遮掩重叠部分.在鼠标移开这个图片后.图片自动缩小到原来尺寸.如果是鼠标移到了其它的图片上.那么这个图片也做相应缩小动画,新移上去的图片作放大运动.
分析好了我们就开始动手做~~~
先看效果:
 点击浏览该文件
1.新建一个FLASH文档.导入五张图片.在导入这些图片前我们先给它们分别名一个文件名.(比如:1,2,3,4,5).这样在导入的时候就会一次性将它们都导入到文档中的.点主菜单中的”文件”---“导入”---“导入到舞台”(因为我们要对图片进行编辑,所以先导入到舞台)然后在弹出的对话框中选择要导入的图片.我们选名字为1的图片.确定后.有个flash对话框.如图:
 
我们选”是”后就将所有要导入的图片全部导入到了舞台上(主场景中),因为有五张图.所以时间轴被拓展了五个帧.分别放置着这几张图.我们选第一帧.然后按下<F8>将图片转换成一个元件(元件类型选”图形”!因为我们还要对它进行编辑.所以最好还是先转成”图形元件”然后一会儿再作成”影片剪辑”).确定后这个图形被转换成一个”图形元件”并被加到了”库”中.然后按下”Delete”将这一帧上的图形删除.(直接点键盘上的Delete键进行删除.删除的是帧上的图形.不是库中的图形.切记啊.呵呵~~~我是不多余了说这话?呵呵)
源代码网供稿.
按同样的方法将其它帧上的图片转成图形元件.并在转换后直接按下Delete键从主时间轴的帧上删除掉这个图形元件.这是全部转换后并作删除操作后的时间轴和库中内容.
然后我们对主时间轴作一下处理.点中第二帧向后托将25帧全选中后右键”删除帧”.因为它们没用了.
好了,我们开始下一步.
2.打开”库”将里面的”元件1”托到主场景中.然后按下<F8>将其转换成一个”影片剪辑”.并给它起名叫”MC1”.如图:
确定好双击主场景中的MC1.进入到MC1的编辑窗口中.分别在第5帧处和第10帧处右键”插入关键帧”.
然后选中第5帧,并点击一下该帧放置的图形元件.确保选中的是处于第5帧上的图形元件.接着在属性面板里设置这个图形元件的等比例放大;(此时如果属性面板里的小黑锁头不是工作在等比例状态.请点击它让它成为下图所示的样子).设置宽度比原来宽度大一点.原来是180.现在我们设置为260.(具体数值你实习时自定吧).
4.重复第3步将其它的MC3和MC4与MC5重制作出来.
这是最后库是内容,并且我们把它们分类放置一下.看着就不乱了..MC1-----MC5分别是5个图片的缩小放大过程.并且里面的AS代码也不用重复输入.
5.好了,我们再新建一个MC.起名叫”组图”,在组图的编辑窗口中,把MC1MC5全部拖放进来.排列一下位置(先大致调好位置.然后再用键盘上下左右光标键微调)如图:
6.放好位置后,返回到主场景中.把刚才那个”组图”托到主场景中来.并调整一下它在主场景中的位置和大小(比如用变形工具等比例缩放).调整好后就双击这个”组图”MC,再进入到”组图”的编辑窗口.
7.接下来我们就要为这几个MC(MC1---MC5)附加行为了(最好是给它们分别起一个实例名.分别叫做tu1---tu5,这样方便我们以后对它们的操作.).我们只讲给tu1实例附加行为.其它的过程一样.
选中tu1.打开行为面板.在行为面板中增加”影片剪辑”----“移到最前”弹出对话框中直接确定．因为它默认选择的就是tu1,我们也要的就是tu1.确定后把”事件”修改成”移入时”
上面这步就是我们所说有本例核心内容.深度!!当鼠标移入到这个图的时候,将这个图的深度设置成最大.(也就是最前)这样就保证了同时进行的放大运动后的图不会被其它图片所遮掩.
接下来我们继续给tu1附加行为”影片剪辑”---“转到帧或标签并在该处播放”在弹出的对话框中填2(当然此时的默认1也可以,但还是跟着本例走吧).确定后将”事件”也改成”移入时”.
2.选中名为”显示”的MediaDisplay组件,再打开”组件检查器”(主菜单中”窗口”“开发面板”“组件检查器”),将如图所示的对勾去掉.不让他自动加载播放.并在如图所示的参数里设置你想加载的文件类型(flv或是mp3),我们本例就加载个mp3吧.这个mp3名叫”我是猫大哥”(呵呵~~~这可是我唱的哦……才怪~~)所以我们在如图的URL下输入”我是猫大哥.mp3”
3.选中”控制器”,然后打开行为面板附加”媒体”---“关联显示”在弹出的对话框里选中名为”显示”的组件实例.确定后事件为”load”(只有一个)
然后确保选中”控制器”实例,打开属性面板设置里面一些参数:如下
activeplayControl参数设置为play这样.第一次点播放按钮后就会音乐响起…ControllerPolicy参数设置为on.这样一打开那么控制器就全部显示.
如果你选中的是名为”显示”的组件就给它附加”媒体”---“关联控制器”
两种方法实现的效果是一样的.设置也是一样的.
4.好了.万事俱备.只欠”我是猫大哥.mp3”音乐.我们把源文件保存.然后在源文件所在的目录下放一个”我是猫大哥.mp3”的声音文件.测试吧.点播放按钮后……哇~~~猫大哥的音乐哦……
源文件:关联
其实这个例子很简单.如果你会AS脚本还可以作出动态加载多个声音文件的效果.如果你会那么你就自己试试吧~祝愿你成功的作出自己想要的播放器!
你也可以改上面”组件检查器”中的文件类型.换成flv.然后在源文件及SWF影片文件同一目录下放置一个flv的文件测试.(注意:swf文件必须与加载的外部文件在同一个目寻下.这样才能够听到.或是一开始你就指定好加载的外部文件的绝对地址,这样就不一定非的放到同一目录了…)
这里需要讲的一点是:有些触发对象的行为并不是直接通过对话框的方式附加好就可以用的.有时要手工轻微调整一下自动生成的代码.比如:如果将”媒体”行为附加到按钮或是MC上.要经过修改代码才能实现.
在这个”媒体”行为中还有两个就是关于线索点导航的行为.这次内容太多了.下次有机会再讲吧.
感谢大家一直支持着我.所以我才会写到第三节..本来想写的更全面,举一些更多更好的例子给大家.但每次内容都很多.应用行为也有时会涉及到更多的相关知识.所以不能够单单的拿出行为面板就可以作出多么多么好的效果.所以我会再努力.努力把行为能够实现的功能更多的告诉大家.并希望大家能够支持我这样作下去……
下期效果一预览:
点击浏览该文件
再次感谢大家~~下次见~~
哦别忘了记的顶哦.还有带上本节范例
压缩包:(内有编译好的教程.本节范例及效果)
 点击浏览该文件
~猫大哥~预祝大家圣诞节快乐~ |
