flash经典实例.docx
《flash经典实例.docx》由会员分享，可在线阅读，更多相关《flash经典实例.docx（67页珍藏版）》请在冰豆网上搜索。
flash经典实例
Flash图标设计实例
核心提示：
目前流行的图标设计软件组合是Illustrator/CorelDraw+Photoshop（本文不讨论象素图标），做出来的图标是静态的，如果要应用于Flash,必须通过位图导入，且不说透
目前流行的图标设计软件组合是Illustrator/CorelDraw+Photoshop（本文不讨论象素图标），做出来的图标是静态的，如果要应用于Flash,必须通过位图导入，且不说透明GIF的锯齿、PNG的大体积，光一个马赛克现象就使得可用性大打折扣了，更不用说做一个动态的图标。
用Flash设计图标的优点是显而易见的:
支持动态图标，无失真放大，移植方便，可以和声音结合等等。
缺点是不适合表现复杂的光影，一看就是卡通的。
先看看我的实验作品：
[点击浏览该文件:
iconMX.swf]
[点击浏览该文件:
iconMX.rar]
如果你对过程感兴趣，那么请继续, 我们先从中间的小球开始
1．新建一个mc，名字就去做icon_ball吧
2．画一个正圆形，设置轮廓和填充的样式，效果如下：
3．用渐变调整工具调整一下：
4．新建一个图层，取名hilight，顺便把原来的帧改名ball
5.再画一个圆，移动到如图位置
6．在ColorMixer面板中修改一下结果如图：
图中黑色表示透明，取消选择看看
7．调整一下渐变方向
8．创建一个阴影层
9．画一个黑色的圆，选中后，使用柔化边缘功能，设置参数
10．选中阴影，按F8,转成元件，取名ball_shadow
11.调节ball_shadow的透明度和大小
12.新建一层，画上标志
通过上面的方法，相信你一定掌握了画立体形体的基本方法，那就是：
依次画基本形状、渐变、高光、阴影。
下面的时钟也是这样的方法，所以我不再详细介绍，这里仅截取几个关键步骤，你可以自己发挥，因为这个不是唯一的方法，相信你会创造出适合自己的方法。
效果预览:
1．面板的制作
2．刻度的制作
我喜欢小而细的刻度，为了方便起见，放大2倍看
画好所有刻度并转成元件（F8）
复制一次这个元件,按Ctrl+Shift+P粘贴，按Ctrl+↓移到下面，然后降低亮度
效果：
3．指针的制作
新建一个mc，画一个指针，主意注册点（十字）的位置
因为指针颜色用了白色，所以我们暂时把文档背景设成黑色
复制3个指针，使他们的注册点都和面板的中心重合
选中这三个指针，按F8，转成元件
效果如图
复制这个mc,同刻度一样,降低亮度处理，
4．稍微修饰一下，加上底座和文字，并将文字打散最后加上代码，看看你的时间对不对:
）
（注：
详细代码请查看源文件）
文件夹制作：
鼠标移到第一个图标的地方，可以看到放大镜会运动，同时阴影也随着运动，而且只在一定的区域中显示，正是Flash让图标充满动感
这是完成后的时间线:
说明：
如果你对Flash一窍不通，建议你先找本入门的书看看，限于篇幅，本文可能无法满足你的需要
元件分解图：
1．文件夹
纯粹的渐变+轮廓，注意轮廓的颜色淡一些
2．阴影
先画出一个圆和一条线，然后转化成填充，最后柔化边缘并转成元件
3．遮罩
实际上只是半透明部分，见源文件
3．放大镜
放大镜主体部分，白色的粗线条已经转化成填充，中间再用墨水瓶工具填上淡淡的轮廓
放大镜手柄，塑料部分用渐变，金属部分直接用线条画出形状，然后上色并删除线条
注意：
放大镜主体和手柄一起转到元件中，这样可以一起运动
下面我们要做的，只是创建最基本的动画了，限于篇幅，本文不再详细介绍，如果感兴趣，可以到经典论坛Flash专栏提问，欢迎光临:
）
具体的ActionScript代码请看源文件
flash制作建筑插上飘动的彩旗
作者：
佚名 日期：
2010年03月02日 来源：
《FlashCS4动画设计与制作208例》浏览：
5次我要评论（0）
核心提示：
飘动的彩旗[前言]1、初学者写的教程面向初学者，让我们一起成为高手吧！
（我写的比较啰嗦，但制作起来却是很简单的）2、我在闪吧论坛发过此贴——请初学者用遮罩做出此效果，很多如
飘动的彩旗
[前言]
1、初学者写的教程面向初学者，让我们一起成为高手吧！
（我写的比较啰嗦，但制作起来却是很简单的）
2、我在闪吧论坛发过此贴——请初学者用遮罩做出此效果，很多如我一样的初学者都很踊跃地跟贴交作业，但效果还是差一点点。
现将我的制作思路写出来。
[效果]
插上彩旗.swf（15.42KB）
下载次数:
527
2007-8-1015:
51
[要求]
1、防止靠近旗杆的旗上下抖动
2、使旗在滚动时畅而不滞
[目的]
熟练掌握引导层和遮罩的使用方法
[步骤]
第一步：
新建图形元件，名称为“静止的旗”；在里面画一个无边框的矩形，宽30像素、高40像素、填充红色、相对于舞台左对齐和上对齐；按下工具栏中的“选择工具”，不选中矩形，把鼠标移到矩形的上边位置，当鼠标下方出现一条黑色的弧线时，按住鼠标往上拖；同样，把矩形的下边也往上拖。
选中变形后的矩形，按住Ctrl键的同时往右拖出一个（即复制一个），选中复制出来的图形，然后选择“修改”菜单下的“变形”中的“垂直翻转”，并把X坐标设置为30、Y坐标设置为0；用鼠标在图形点击选中，按住Ctrl键的同时往右拖出一个，其X坐标设置为60、Y坐标与左边的图形相同（变形后的图形X坐标发生了变化，已经不为0了）。
具体设置和效果如图1：
下载（9.59KB）
2007-8-1015:
51
第二步：
在库中选中元件“静止的旗”，右键选择“直接复制”，在弹出的对话框中将名称改为“遮罩原图”，点击“确定”按钮；在库中双击元件“遮罩原图”，进入“遮罩原图”的编辑场景；选中图形（记住其高度），用“选择工具”删除下部分的波浪形，再把其高度设置为原来的高度（不一定与图中的高度一样）。
具体设置和效果如图2：
下载（9.36KB）
2007-8-1015:
51
第三步：
新建影片剪辑元件，名称为“滚动的旗”，在里面创建两个图层，图层名称从上到下依次为“引导层”、“静止的旗”；把“静止的旗”元件拖入到“静止的旗”图层上，相对于舞台左对齐和上对齐；双击该元件，进入“静止的旗”元件编辑场景中，在工具栏中选择“墨水瓶”工具，给图形描边黑色的边线，选中边线，双击边线按住Ctrl+X键剪切；回到“滚动的旗”的编辑场景中，再按住Ctrl+X键粘贴到“引导层”图层上，删除两边和下边的线，只留下上边线，相对于舞台水平中齐和上对齐，并延长帧至第30帧处，锁定该图层；选中元件“静止的旗”，按下工具栏中的“任意变形工具”，把图中出现的小白圆拖到上边的黑线上，在第30帧处插入关键帧，并创建补间动画，把第30帧的元件X坐标设置为-58，并把元件往上移，直到小白圆在黑线上为止；选中“引导层”图层，右键选择引导层；选中“静止的旗”图层稍稍往上拖（注意引导层图层图标的变化）。
具体设置和效果如图3：
下载（25.14KB）
2007-8-1015:
51
第四步：
新建影片剪辑元件，名称为“遮罩层动画”，把库中的元件“遮罩原图”拖入，相对于舞台左对齐和上对齐；在第30帧处插入关键帧，把第30帧处的元件X坐标设置为-58，并创建补间动画。
具体设置和效果如图4：
下载（8.73KB）
2007-8-1015:
51
第五步：
新建影片元件，名称为“飘动的旗”，创建两个图层，图层名称从上到下依次为“遮罩层动画”、“滚动的旗”;把“遮罩层动画”和“滚动的旗”分别拖入到相应的图层中；把“遮罩层动画”元件顺时针旋转90°，并把各个图层上的元件均设置成为相对于舞台左对齐和上对齐；选中“遮罩层动画”图层，右键选择遮罩层。
具体设置和效果如图5：
下载（11.7KB）
2007-8-1015:
51
第六步：
创建“旗杆”新图形元件，用渐变工具画一细长矩形；把“旗杆”拖入到主场景中，在下层把“飘动的旗”也拖入，分别放到合适的位置上。
[思考与交流]
1、你是否能用形状补间做出飘动的效果？
2、为了防止靠近旗杆的旗上下抖动，你还有其他方法吗？
3、在第三步和第四步中将第30帧处的元件X坐标为何不设置为60？
[源文件]
插上彩旗.fla（63.5KB）
FlashCS4制作轻易翻转扑克牌
作者：
佚名 日期：
2010年03月02日 来源：
《FlashCS4动画设计与制作208例》浏览：
4次我要评论（0）
核心提示：
本例主要在前面所学基础3维编程知识的基础上进一步巩固和熟悉rotation与Z轴的使用，以及它们的结合使用。
通过本例的制作，来加强前面所学知识的的理解，并学习如何配合使用达到更好效果，用简单的方法创作
本例主要在前面所学基础3维编程知识的基础上进一步巩固和熟悉rotation与Z轴的使用，以及它们的结合使用。
通过本例的制作，来加强前面所学知识的的理解，并学习如何配合使用达到更好效果，用简单的方法创作很酷的三维效果，在结合创作中加深理解应用。
本例思路：
<1>创建实例背景。
<2>绘制牌的正面和反面并转换为图形元件。
<3>创建一个牌的容器，转换为元件类“Card”，将正反面牌分别放置于第1、2帧。
<4>创建文档类，控制扑克牌对象的rotationY属性。
实例步骤：
（1）新建一个空白文档，舞台大小设置为500*250，帧频设置为120，绘制一个与舞台大小同样大小的矩形，并填充放射状渐变色，设置第一色标颜色为（R：
0，G：
246，B：
93）Alpha:
100%，设置第二色标颜色为（R：
0，G：
131，B：
49）Alpha:
100%，设置第三色标颜色为（R：
0，G：
62，B：
23）Alpha:
100%，如下图15-1所示。
图15-1 绘制背景
（2）使用“渐变变形工具”进行调整高光位置和渐变分布模式，如下图15-2所示。
图15-2 渐变调整
（3）分别创建两个图形元件，命名为“back”和“9”。
简单绘制扑克牌“9”的正反面，注册点在中心位置且大小必需相同，如下图15-3所示。
图15-3 扑克牌正反面
（4）新建一个影片剪辑，命名为“Card”，命名元件类名也为“Card”，如图3-所示。
将上面步骤中创建的扑克牌“9”的正反面分别放置于第1、2帧处正中心位置，如下图15-4所示。
图15-4创建“Card”对象
（5）创建文档类Main类，如图3-所示，首先创建一个牌的容器“container”，并将其放置于舞台中心位置，如构造函数第20到23行代码所示，然后创建扑克牌容器对象并添加到容器“container”中，如第25、26行代码所示，并将扑克牌容器对象停止播放（也就是停留在第1帧）、启动按钮模式和注册侦听器函数，如第27到29行代码所示。
1.package
2.{
3. importflash.display.*;
4. importflash.events.*;
5. importcaurina.transitions.Tweener;
6. /**
7. *...
8. *@authorlbynet（Tools->CustomArguments...）
9. */
10. publicclassMainextendsSprite{
11.
12. privatevarcontainer:
Sprite;
13. privatevarpane:
MovieClip;
14. privatevarisback:
Boolean;
15. privatevarcurrentPlane:
MovieClip;
16. privatevarcurrentRotationY:
Number;
17.
18. publicfunctionMain（）:
void{
19.
20. container=newSprite（）;
21. container.x=stage.stageWidth/2;
22. container.y=stage.stageHeight/2;
23. addChild（container）;
24.
25. pane=newCard（）;
26. container.addChild（pane）;
27. pane.stop（）;
28. pane.buttonMode=true;
29. pane.addEventListener（MouseEvent.CLICK,onClick）;
30. }
（6）当扑克牌容器对象被单击时调用onClick侦听器函数，为stage注册事件侦听来控制何时切换为正面或是反面，通过判断变量isback来重新设置被单击扑克牌的rotationY属性，如第36到44行代码所示，在第38、42行代码，通过Tweener来切换扑克牌的rotationY值在0与-180度之间，如下原理图15-5所示。
1.privatefunctiononClick（event:
MouseEvent）:
void{
2.
3. stage.addEventListener（Event.ENTER_FRAME,enterFrameHandler）;
4. currentPlane=MovieClip（event.currentTarget）;
5. if（isback）{
6.
7. Tweener.addTween（currentPlane,{rotationY:
0,time:
1}）;
8. //Tweener.addTween（currentPlane,{z:
0,time:
1}）;
9. }else{
10.
11. Tweener.addTween（currentPlane,{rotationY:
-180,time:
1}）;
12. //Tweener.addTween（currentPlane,{z:
-200,time:
1}）;
13. }
14. isback=!
isback;
15. }
16. privatefunctionenterFrameHandler（event:
Event）:
void{
17.
18. currentRotationY=currentPlane.rotationY;
19. if（currentRotationY>=-90&¤tRotationY<=10）{
20.
21. if（isback）{
22. currentPlane.gotoAndStop
（2）;
23. }else{
24. currentPlane.gotoAndStop
（1）;
25. }
26. stage.removeEventListener（Event.ENTER_FRAME,enterFrameHandler）;
27. trace（"已清除事件侦听"）;
28. }
29.
30. }
31.
32.
33.}
图15-5 文档类
（7）当用户单击扑克牌容器对象，在第34行代码中注册的侦听器后，执行侦听器函数enterFrameHandler，并通过时时判断扑克牌容器对象的rotationY的值来判断扑克牌容器对象要切换跳转到哪一帧，如第50到59行代码所示，最后，清除无用的侦听器，如第57行代码所示。
（8）把onClick侦听器函数中第39、43两行代码放开，发布测试，当用户单击扑克牌容器对象后，扑克牌切换翻转并放大（其实际是对象的z轴值减小），如下图3-所示，当再次单击后，扑克牌切换翻转并缩小致原始状态。
格斗动画制作的理论基础
作者：
佚名 日期：
2010年02月20日 来源：
本站原创浏览：
5次我要评论（0）
核心提示：
作者：
justsolo 来源：
闪吧 ■第一课:
理论基础 首先我们要先确立对象,
作者：
justsolo 来源：
闪吧
■第一课:
理论基础
首先我们要先确立对象,我们的对象是格斗的动作设计,以及动作的动画制作,不需要多余的场景,不需要多余的噱头,把握好我们的主体!
!
现在很多人都用着错误的方法在学习研究动作类动画,尽管你依然能从那错误的方法中得到进步,可是那对将来的发展是一种制约!
那么怎样才是正确的?
我还无法肯定,但以我多年的经验,我知道目前怎样才是最合适的,如果看完了有不同意见那最好的了!
!
先来理解
"动作"这个词所具备的属性:
1'姿势
2'平衡
3'速度
4'力度
5'惯性
6'作用力
7'加速度
8'运动轨迹
（不知道还有没有什么要素遗漏的,请补充...）
回忆一下,你作动作设计的时候有没有考虑到以上相关因素,或者在研究动作的时候~不管有没有我先来介绍一下这些属性究竟代表的是什么,与动作设计又有什么样的关联.
■设计要靠创意，动作设计同样要靠创意
动作的姿势就是其中一个表现形式,然而创意的本身不能脱离实际,这里所谓的实际并非我们现实的实际,而是一种假定条件,然而这种假定条件却要建立在力学原理的基础上,所以姿势不能只是一味的好看而已,它可以夸张,比如赋予橡皮的能力,那么就要同时具备弹性学的原理.
■姿势引导出来的就是平衡
问题,平衡并不像它字面上的那么单纯,它包含"静态中平衡"以及"动态中平衡".静态平衡相对简单,一个姿势正确与否看他是否能保持平衡就知道了,与平衡相关的属性就是"重心"以及"支撑点",比如一个侧踢,脚往前,身体自然的往后稍倾,以达到重心平衡.动态平衡就比较复杂,但了解的基本的属性时也很容易理解,动态平衡的属性:
速度,惯性,运动方向,重心,支撑点,但人物悬空的时候是没有支撑点的,但此时重心就尤为重要,你要知道为什么直升机的尾巴要多一个"风扇"...人物跑动的时候手臂自然摆动,方向对应相反...一个右脚侧踢的时候,右手会大幅度的向后方摆动...这都是为了保持动态过程中的一个重心平衡.
■速度
速度分为整体速度和局部速度,整体和局部是紧密关联的,这种关联体现在速度和平衡的问题.移动速度越快,相应的重心会越低;右手出拳的速度越快,相应的左手的回缩越快;右脚侧踢越快,相应的右手回缩速度越快;然而速度快并不代表力道大.
■力度的计算公式是:
速度x质量x重心的位移度
重心的位移度代表的是惯性的问题,比如一个速拳,它本身攻击不大,但若加上身体的重心移动,那么身体的质量就会加到拳头上,力度相应提升.力度会表现在惯性上,速拳容易收回,而重拳就有一个惯性缓冲的过程.
■惯性是一个绝对不能忽视的对象
它能很直接的体现物体的质感,[钢弹]是个在与惯性脱离最大的动画,它可以直接忽视机器人本身的质量然后进行位移.与惯性紧密相连的一个表现手法是"缓冲",至于如何表现请多注意生活中的点滴,或者游戏（主要还是实际生活中的内容,因为很多游戏为了表现手法而忽视的部分的惯性原理,这并非不可取,只是要注意表现的手法,让他达到理想的"实际",比如钢弹的理想实际是机体无限坚固,动力无限大,好比我们玩鼠标跟金刚玩汽车一样轻松.动作也是如此,自己去体会吧,这种东西更多的是一种感觉,如果你没有这种感觉就是没有动作设计的天分,很简单的道理.
■作用力一个大项
它包含:
作用力与反作用力,摩擦力,阻力,这些名词看起来不一样,其实都是一样的,就是作用力与反作用力.作用力作为一个前提的条件下,引导出来的就是对于作用力的表现,这才是重点.跑的多快,跳的多高,一拳能够打出什么反应,这都能引起视觉反应,简单的说,就是攻击究竟有没有力道感,就看你怎么打,用什么姿势打,然后被打的人是什么反映,由于被攻击部位的不同,所作的反应自然要不同,如果都用拳皇那一套,那实际打出来的动作大多是软弱无力的,但是它用表现手法和声音去弥补了这样的一个
flash爆炸动画的制作
作者：
佚名 日期：
2010年02月20日 来源：
本站原创浏览：
7次我要评论（0）
核心提示：
爆炸是突发性的状态，动作猛烈，速度极快．动画影片中表现爆炸场面主要从三个方面进行描绘．1、强烈的散光．2、被炸飞的各种物体．3、爆炸时产生的烟雾．强烈的散光效果一般需求8－12帧画面，表现方法
爆炸是突发性的状态，动作猛烈，速度极快．动画影片中表现爆炸场面主要从三个方面进行描绘．
1、强烈的散光．
2、被炸飞的各种物体．
3、爆炸时产生的烟雾．
强烈的散光效果一般需求8－12帧画面，表现方法归纳为三种．其一是用深浅差别很大的两种色彩的突变来表现强烈的散光效果；其二是放射形散光出现后从中心撕裂也可表现出散光的强烈效果；其三是用扇形扩散的方法表现散光．
下面的示例：
将上面的画好的爆炸过程图导入到flash中进行调整。
flash动画中人物奔跑动作的规律--2
作者：
佚名 日期：
2010年02月20日 来
升级会员 