绕着轨迹旋转

文章类别：Flash | 发表日期:2008-9-21 20:11:38

　　 ※闪吧※<a target=_blank href=http://www.flash8.net<img src=../img/flash/20089212073420777801.gif border=0 align=absMiddle height=16 width=16> <a href="www.flash8.net" TARGET=_blank>[ 点击下载 ]</a></a>]

FLASH 4 : 绕着轨迹旋转

http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=4,0,2,0" width="550" height="400"> http://www.flash8.net/file/Tutorials1/1015/29/29.swf";> http://www.flash8.net/file/Tutorials1/1015/29/29.swf"; quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"; type="application/x-shockwave-flash" width="550" height="400">

初看这个范例时,觉得似乎不是那麽的轻易制作，其实实际做过就会知道，原来就是这麽的简单，几乎都是同样的步骤重复多次，如此而已。要注重的地方是排列位置不要用乱掉，还有导引线的地方有一些小技巧....

http://www.flash8.net/file/Tutorials1/1015/29/1.gif"; width="340" height="70">

首先，我们先想好共需要使用到几个元件...

在 " www.pc-net.com.tw" 中共有10个元件，外加一颗圆球，如左图所示。

http://www.flash8.net/file/Tutorials1/1015/29/library.gif"; width="156" height="362">

http://www.flash8.net/file/Tutorials1/1015/29/line.gif"; width="175" height="80">

将它们分别转为图形元件 (F8)，然後新增一个电影元件 ( Ctrl+F8 ) ，我们将在这里完成字母绕着椭圆形导引线跑的动作。

进入新增的电影元件档之後，首先，在图层1中画一个椭圆形，将其性质改为导引线，如上图所示，由於等会儿所要用到的导引线皆在相同的位置上，所以先将此影格拷贝下来，等等用到时直接贴上即可。

http://www.flash8.net/file/Tutorials1/1015/29/line1.gif"; width="242" height="112">

再新增一个图层，从图库中拉出"ball" 图形来，放在影片中的导引线上( 注重中心点的位置，要对在导引线上唷，否则後果可是会......) ，将此图层位置下拉至导引线图层下方，如上图所示，图层名称自定，别乱掉就行了。

http://www.flash8.net/file/Tutorials1/1015/29/line2.gif"; width="243" height="115">

再新增一个图层，在影格中直接按滑鼠右键，贴上影格即可 ( 之前拷贝的导引线影格这时候用到了 ) 。

再新增一个图层，从图库中拉出 ''w'' 图形来，放在影片中的导引线上，同样下拉至导引线图层下方，如左图所示。

http://www.flash8.net/file/Tutorials1/1015/29/pic1.gif"; width="189" height="108"> http://www.flash8.net/file/Tutorials1/1015/29/pic2.gif"; width="259" height="70"> 以下的做法重复上述步骤，最後的排列位置如上图，假如觉得中心点不好对到，可别遗忘了''靠齐格线''这个小工具唷! 还有导引线假如怕不小心动到，也请先上锁!

http://www.flash8.net/file/Tutorials1/1015/29/pic3.gif"; width="467" height="134">

将整个影片绕导引线一圈，影格长度定为30格，而第15影格，图形约略为绕导引线一半的位置，所以在此我们先将所有图层的影格15和影格30插上要害影格，如上图所示。

所以整个影片被分成2个部分来进行，影格1和30皆在同一个位置，我们已经处理好了，接下来只要完成影格15的影片位置就行了.....

依序移动影格15的各图层图片位置至导引线约略另一半位置(不要超过一半位置，要不然图形移动的方向可是会相反唷!) (P.S : 导引线的位置到目前为止都还不需要动到它)。

http://www.flash8.net/file/Tutorials1/1015/29/pic4.gif"; width="266" height="71">

哈哈，位置对了，可是图形方向却不是我们所要的对吧!用 ( 修改---> 变形 ---> 水平翻转 ) 功能，将每个图形转个方向吧!
( 快速键 : Alt+O ---> T ---> H )，最後的结果如左图。

http://www.flash8.net/file/Tutorials1/1015/29/pic5.gif"; width="287" height="221">

现在就来开始进入我们的动画影片了!

依序在各图形图层的第1影格位置按滑鼠右键(内容--->渐变--->移动)，依路径方向旋转打勾，和缓值调整为"-35"，这地方是要让旋转时有快慢的感觉。如左图所示。

完成後移动时间轴跑跑看，是否有正确的移动呢??

(P.S : 导引线的位置到目前为止都还不需要动到它)。如下图所示。

http://www.flash8.net/file/Tutorials1/1015/29/pic6.gif"; width="469" height="121">

http://www.flash8.net/file/Tutorials1/1015/29/pic7.gif"; width="288" height="220">

第15影格至30影格的方式也是同上述步骤，只是将和缓值调整为"100"，如左图所示。时间栏的图形如下图所示。完成後跑跑看哦。

http://www.flash8.net/file/Tutorials1/1015/29/pic8.gif"; width="467" height="121">

http://www.flash8.net/file/Tutorials1/1015/29/pic9.gif"; width="226" height="117">

怎麽会这样，图形又倒退回去了，为什麽没有继续前进呢?

别担心，这不是你的错，还记得每层导引线的第15格要害影格吗??这个位置就是在这里决定生死的要害了。

选取所有图层的第15要害影格，用橡皮擦工具( E )，在最後一个图形旁的导引线地方，如左图所示。用力擦下去，擦开一条小隙缝，嘻嘻....简单吧!

(导引线有上锁的，记得先解锁唷!)
移动时间轴跑跑看，是不是绕得很顺畅呢?! 恭喜你已经成功了!

http://www.flash8.net/file/Tutorials1/1015/29/pic10.gif"; width="216" height="99">

回到场景1，从图库中拉出刚刚做好的影片，接下来要做阴影的部分了!

点取图形( Ctrl+A )，复制图形( Ctrl+D ) ，点选复制的图形，双按滑鼠左键，( 同滑鼠右键--->内容 )，改变颜色效果的 Alpha 值为 20%，如左图所示。

http://www.flash8.net/file/Tutorials1/1015/29/pic11.gif"; width="256" height="174">

最後再移动一下图形位置如左图所示。完成。

以上步骤若有疑问，或是无法完成，欢迎至Flash问题讨论区中发言。

下一课：http://www.flash8.net/file/Tutorials1/1015/28.htm";>涟漪波动

Windows操作 [文]	Word教程 [文]	Excel教程 [文]	PowerPoint [文]	Dreamweaver [文]	Fireworks [文]
Flash教程 [文]	PhotoShop [文]	CorelDraw [文]	C语言教程 [文]	Html教程 [文]	Div+Css布局 [文]
Javascript [文]	ACCESS数据库 [文]	ASP教程 [文]	SQLServer [文]	ASP.NET教程 [文]	FlashAS [文]

Word教程网	Excel教程网	Dreamweaver 教程网	Fireworks教程网	PPT教程网	FLASH教程网	PS教程网
HTML教程网	DIV CSS教程网	FLASH AS教程网	ACCESS教程网	SQL SERVER教程网	C语言教程网	JAVASCRIPT教程网
ASP教程网	ASP.NET教程网	CorelDraw教程网