网站动画设计课件2014

1、网站动画设计网站动画设计主讲：徐鹥主讲：徐鹥64411Flash1、什么是动画？、什么是动画？2、在、在Web中都有哪些动画技术？中都有哪些动画技术？3、为什么在网页中能播放、为什么在网页中能播放Flash动画？动画？什么是动画什么是动画l动画的英文有很多表述，如animation、cartoon、animated cartoon、cameracature。其中较正式的 Animation 一词源自于拉丁文字根anima，意思为“灵魂”，动词animate是“赋予生命”的意思，引申为使某物活起来的意思。所以动画可以定义为使用绘画的手 法，创造生命运动的艺术。l动画技术较规范的定义是采用逐帧拍摄

2、对象并连续播放而形成运动的影像技术。不论拍摄对象是什么，只要它的拍摄方式是采用的逐格方式，观看时连续播放形成了活动影像，它就是动画。网页中的动画技术介绍：网页中的动画技术介绍：1、GIF动画2、JavaScript动画（JQuery）3、Java Applet小程序动画（Java FX）4、Flash动画动画（Flex/Flash Builder）5、WPF/SilverLight6、HTML57、其他（SVG、VRML）网页中播放网页中播放Flash动画动画l网页中要播放Flash动画，必需安装Flash插件，即Flash player。lFlash player也有本地版本，本地机器上安装

3、以后，可以直接在计算机中播放动画。1、动画制作的原理与概念、逐帧动画与补间动画动画制作的原理与概念、逐帧动画与补间动画 2、元件、元件、形状补间动画、动作补间动画形状补间动画、动作补间动画；3、绘图工具的使用；、绘图工具的使用；4、遮罩技术、滤镜效果应用；、遮罩技术、滤镜效果应用；5、素材的使用：文字、图片、声音；、素材的使用：文字、图片、声音；6、Actionscript学习学习，控制时间轴与，控制时间轴与MC；7、鼠标事件应用；核心类使用初步；、鼠标事件应用；核心类使用初步；8、网站类应用；、网站类应用；XML数据驱动动画；数据驱动动画；9、小游戏开发与设计实践。、小游戏开发与设计实践。本

4、门课程的主要教学内容本门课程的主要教学内容本门课程的考核方式本门课程的考核方式 本门课程以实践考核为主，课程结束后2周内，每位同学必需上交一份综合的作品，作品要求如下：1、作品应该独立完成，要有自己的创意；2、题材不限，内容健康向上，有故事情节，有主线；如果作品是反映五邑地区的历史文化五邑地区的历史文化或是反映江门职业技江门职业技术学院的校园文化术学院的校园文化的，可加分。3、作品上交的时候要交源文件，原则上源文件不大于50MB，创作过程必需自己独立完成，不得复制他人作品充数，一经发现，取消考核资格。4、评判标准将从作品的创意、内涵、技术、美工四个方面综合评价，具体情况详见考核要求具体情况详见

5、考核要求。一、一、Flash的发展状况的发展状况对应播放器版本为FlashPlayer 8.0对应播放器版本为FlashPlayer 9.0目前最新播放器版本是目前最新播放器版本是Flash player 12 1997年，Macromedia公司从一个名为FutureWave的公司得到了一个小的Web图形程序FutureSplash，它可以生成紧凑的基于矢量的图形和动画，并能将它们用于Web传输。FutureSplash就是Flash的前身，如今Flash已经普遍存在，绝大多数主要的浏览器和操作系统上已经安装了Flash动画播放插件。1、Flash的由来的由来对于Flash动画的描述，定义为

6、“交互性矢量多媒体交互性矢量多媒体2D动画动画”。1、Flash动画是以矢量图矢量图为基础的，矢量图的最大特点就是它能无限缩放，并且在缩放的时候图像的质量不会改变，生成的动画文件体积小，适合于在网络上传输；2、什么是、什么是Flash2、Flash的产品往往是有声有色的动画，集成了文字、图片、声音、视频等多种媒体元素；3、Flash动画不再是一个演示型的动画，利用ActionScript脚本语言，它可以实现观众与动画之间的交互。3、Flash的行业应用的行业应用1、Flash已经成为互联网动画的标准已经成为互联网动画的标准 用Flash不仅能够制作网站动画、广告片头动画、甚至可以制作专业的交互

7、性商业网站，Flash动画是随着互联网的兴起而发展起来的，它非常适合在互联网环境下发展，其动画文件体积小、支持颜色数位高、能集成多种媒体元素、支持交互性等特点已经成为众多2D动画制作软件中的首选。2、Flash在影视传媒行业的应用在影视传媒行业的应用 用Flash可以制作出一流的卡通电影、卡通电视剧（动画片）、广告短片、视觉展示产品等。 在影视行业，越来越多的制片公司使用Flash进行动画片的制作，与传统的动画制作对比，用Flash制作动画可以大大缩短制作的周期，减小开发复杂度，从而大大降低制作成本。 制作相同质量的2D动画长片，用传统的方法大概需要30个月，需要400多名员工；而使用Flas

8、h来做只需要15个月，需要的人数一般不会超过100人。左图为作品Ninjai中的场面。3、Flash在教学中的应用在教学中的应用 由于Flash动画的多媒体集成性与交互性的特点，可以用来制作教学课件。 在很多教学环境下，把抽象的生产力生动化、具体化，需要很强的表现能力，Flash动画正好能很好地做到这一点，将课程内容制作成为一个活泼生动的动画式教学产品，无疑能取得非常好的教学效果。 在很多中、小学，都需要许许多多的多媒体课件，其中的动画表现方面，基本上都是用Flash来制作的。4、Flash在在移动平台移动平台/车载系统车载系统/嵌入式系统嵌入式系统 的用途的用途（1）Flash Lite F

9、lash Lite是 Macromedia公司为了行动电话开发的 Flash Player。于2003年2月发布，Flash Lite 1.0支持 Flash 5的对象和Flash 4 ActionScript， 也能够播放MIDI音乐。 2004年初Flash Lite 升级到1.1版，加强了网络连接、数据交换能力，支持的声音格式包含MP3、 PCM、ADPCM 和 SMAF，使其更适合发展多媒体应用程序。 （2）AIR多种平台的应用支持多种平台的应用支持5、Flash在在Web开发中的应用开发中的应用Web 1.0时代的技术HTML4.0、CSS、CGI、ASP、JSP、PHP、Flash

10、。 这个时候的Flash动画主要是增加网页的视觉效果，增强客户端的用户交互操作。Web 2.0时代的技术XHTML/XML、CSS、Ajax、RIA、RIA的是Rich Internet Application的缩写，意思是“丰富互联网网络应用”，RIA是一种开发技术，而不仅仅是一种客户端应用。其中，所谓的Rich的意思就是因为以前的网络体验太Poor了，RIA的出现是为了让网络用户获得更为丰富的体验。未来的互联网是朝着RIA的方向发展的。 目前在RIA开发的市场上主要有三方阵营：Silverlight、JavaFX、Flex/Flash，目前来看，这三种技术各有优势，但Flex/Flash先

11、入为主，目前已经有了一个很大的市场，占有先机。 用Flash来做动画，可以最大限度地发 挥制作者的想像力与创作力。“只有你想不到的，没有你做不到的！只有你想不到的，没有你做不到的！”二、二、Flash动画的优点与不足动画的优点与不足Flash动画的优点动画的优点：色彩丰富、基于矢量、动画文件体积小、支持流式下载；多媒体整合能力强、交互性强、平台兼容性好；制作动画方便，能有效减小开发的复杂度；Flash动画的不足之处动画的不足之处：世界上没有完美的软件，Flash也一样，实际上这也不能称作软件的缺点，对于制作动画方面，目前Flash的不足之处如下：对3D方面的支持还不够、播放器性能受限、比较难做

12、出大型游戏、不支持骨骼系统动画。随着Adobe公司对Flash技术的大力发展，在未来推出的升级软件中会逐一解决这些问题，如Flash CS4将支持3D与骨骼系统。好的学习网站推荐好的学习网站推荐1、闪吧 http:/ http:/ http:/ 19世纪20年代，英国科学家发现了人眼的“视觉暂留”现象（物体被移动后其形象在人眼视网膜上还可有约0.1秒的停留），揭示了连续分解的动作在快速闪现时产生活动影像的原理。 比如要制作一只鹰飞行的动作动画，要制作出整个动作分解图，如下图所示共有6帧，按一定的速度连续播放出来则形成动画。 所有的动画，包括Flash动画都是一个原理快速连续播放静止的画面，给人

13、眼产生的错觉就是画面会连续动起来。那些静止的画面叫作“帧帧”；播放速度越快，动画越流畅。 播放的速度一般用每秒播放的帧数即帧数率帧数率（fps）表示，Flash 8中默认的帧速率是12fps，帧速率的范围是0.01120。 电影胶片的播放速度就是24帧/秒，电视是25帧/秒，大多数游戏的帧频都是在30帧/秒以上。 这种传统的动画制作方法在Flash中也叫“逐帧动逐帧动画画”，就是把每一帧要表现的内容都做出来，这样可以表达最细致的动画。1、帧与帧频、帧与帧频 关键帧关键帧（Key Frame）是Flash动画设计中一个重要的概念，它表示一个“有真实内容有真实内容”的帧，只有关键帧上的内容才可以被

14、修改； 除了使用“逐帧动画”的方式画做动画，在Flash中用得更多的制作动画的方式称为“补间动画补间动画” 。补间动画就是把对象变化的开始和结束的状态做成关键帧，中间变化过程由Flash自动计算生成，“补间”的含义就是中间过程自动生成的意思。 以下图示展示了补间动画的原理： Flash动画设计中有三种类型的帧：关键帧关键帧、普通帧、空白关键帧，其中关键帧关键帧是最重要的。2、关键帧与补间动画、关键帧与补间动画在Flash中制作小球从左移动到右的动画产生过程解释：解释： 在Flash的补间动画制作中，我们只需要设计好开始开始和结束结束两个关键帧关键帧上对象的不同状态（在这里是位置不同），就可以产

15、生从开始状态变化到结束状态的动画，其中间变化过程由Flash软件自动计算出，这就是补间。开始关键帧结束关键帧中间过程帧普通帧普通帧： 普通帧常用于将前面关键帧内容在时间轴上延长显示延长显示，普通帧上显示的内容是它前面那个关键帧上的内容。空白关键帧空白关键帧： 就是没有任何内容的关键帧，或是把原先有内容的关键帧上的对象删除了变成的帧，它上面显示的是一片空白，不管它前面有没有其它关键帧。设置帧的快捷键：设置关键帧：设置关键帧：F6设置普通帧：F5设置空白关键帧：F73、普通帧与空白关键帧、普通帧与空白关键帧4、舞台与场景、舞台与场景舞台舞台（Stage） ，舞台就是指整个动画输出以后能够看到的范围

16、，其大小是可以修改的，在Flash中支持最大的输出舞台尺寸为28802880像素。 场景场景（Scene），对于一段较长的影片，或是由有明显分界的几个段子组成的影片，可以将它们分到不同的场景里，避免时间轴拉得太长，也方便管理。 可以将整个动画片看成是一篇文章，一个场景就好场景就好像一个段落像一个段落，场景与场景之间是连续的，上一个场景播放完后自动从下一个场景开始播放。可以用场景面板场景面板来编辑场景。 想要添加多个场景，可以点击菜单“窗口”“其他面板”“场景”，将弹出场景面板，在场景面板上可以对场景进行编辑，如增加场景、删除场景、复制场景、移动场景等，在动画中使用多场景时要注意，流式声音不能跨

17、跃场流式声音不能跨跃场景景。5、图层、图层图层（图层（Layer） 在很多设计软件中都有图层图层的概念，可以把图层看成是一张透明的胶片一张透明的胶片，在每张透明胶片上都可以绘制一些内容，图层是按顺序遮盖的，上面的图层上的内容会盖住下面图层上的内容。 养成一个良好的习惯养成一个良好的习惯：把动画中不同的对象放在不同不同的对象放在不同的图层上的图层上，这样在制作复杂动画时，可以避免出错。五、形状补间动画（五、形状补间动画（Shape） 形状补间动画是Flash中最简单的补间动画。使用形状补间动画能做到的动画效果主要有：1、几何形状变化，几何形状变化包括了线条变化（直线、曲线互变）、外形扭曲变化以及

18、不规则形状变化；2、颜色变化，包括了纯色纯色的的色相变化、颜色透明度变化；渐变色的色相、透明度变化等；3、其他，如位移变化、缩放变化、旋转角度变化等。创建形状补间的步骤：（1）新建文档，选中第1帧，用直线工具画出一条直线；（2）在时间轴上选中第20帧，然后按下F6将其设置为关键帧，接下来在工具箱中选“选择工具”，在文档空白处单击鼠标以取消直线的选中状态，将鼠标移至直线的边缘，当光标旁边出现弧线的时候表示可以修改直线的外形，拖动鼠标将直线拉弯曲为曲线，此时红色播放指针处于第20帧的位置；（3）选中第1帧（或是1到20帧中间任何一帧），打开属性面板，在“补间”下拉列表中选择“形状”，可以看到在时间

19、轴中120帧的区域变成了黄绿色，并出现一个从左到右的箭头；（4）按Enter键可观看动画，或是使用Ctrl+Enter测试影片，弹出一个新窗口播放动画，动画会反复播放。 形状补间动画的要点：形状补间动画的要点：1、关键帧上的对象必需是矢量形状必需是矢量形状，不能是组、元件、普通文本、外部导入的图片等，如果要用这些对象来做形状补间动画，必需用分离的命令（快捷键为Ctrl+B）将其变为矢量形状；2、做一个最基本的变化至少需要两个关键帧，每一个关键帧中只放置一个对象，不建议在同一个关键帧中有多个对象；3、必需在属性面板“补间补间”下拉列表中设置为“形状形状”。4、可以使用添加形状提示点的功能来改进补

20、间的变化过程。综合实例制作综合实例制作1、弹力线条实例；2、流体效果；3、进度条效果； 六、元件与图形对象六、元件与图形对象元件/组件（Symbol），也叫符号，它是构成影片的基本组成部分，它分三种类型：1、图像（静态）Graphic：用来定义一些静止的图像对象。2、按钮（Button）：主要用于与用户的交互，有时也用来制造一些特殊的效果（与鼠标相关）。3、电影剪辑（MovieClip)，简称MC，是一段独立的影片，拥有独立的时间轴和坐标系，可以是动态或静态。用于那些需要重复自动播放的动画元素。养成良好的习惯养成良好的习惯：把产生动画的对象制成元件把产生动画的对象制成元件，如果要在动画中用角本

21、语言控制某对象，应该把此对象制作成MC。屏幕左上角是坐标原点（0,0）Windows屏幕坐标系+图形以图形左上角的点来标记图形的坐标图形图形的外接矩形左上角群组（群组（Group）是将若干个对象组合在一起而不改变他们各自的属性。快捷键是Ctrl+G可以用快捷键Ctrl+Shift+G取消群组。分离（打散，分离（打散，Break Apart）除了可以将群组打散之外，还可以将文字和导入的位图打散，使其变为分散式分散式的对象。Ctrl+B注：使用Flash绘图工具绘制出的图形默认方式就是分散式的对象。一般而言，用分散式的对象做为形状渐变动画分散式的对象做为形状渐变动画（Shape）的元素，而非分散式

22、的对象做为运动渐变动画非分散式的对象做为运动渐变动画（Motion）的元素。1、图形的组合与分离、图形的组合与分离2、Flash中常见的对象中常见的对象 在制作flash动画的时候，可以在关键帧中使用很多种类型的图形对象来制作动画，常见的对象有分散式图形分散式图形、组组、可编辑文字可编辑文字、导入的位图和矢量图导入的位图和矢量图、元件元件等。1、分散式图形分散式图形：就是最简单基本的矢量图形，比如直接在flash中绘制出的图形；或者使用分离的命令（Ctrl+B）对组、文字、导入的图形和元件进行分离的操作后产生的新的图形对象。这一类图形主要用于制作形状渐变动画主要用于制作形状渐变动画。2、组组：

23、就是对一些图形对象进行了群组（Ctrl+G）的操作后产生的新对象，它是多个对象的组合体，可以使用取消群组的命令或是分离命令把组合体再分成独立的各个部分。 被群组的对象会保持其原有的一些特性（如颜色、大小、透明度、按钮的可点击性、影片剪辑的可播放性等）。3、可编辑文字可编辑文字：就是直接用文本工具输入的文字，可编辑的意思是指可以再次修改文字内容。如果使用了分离的命令把文字变成分散式图形，文字就不可以再编辑了。4、导入的位图和矢量图导入的位图和矢量图：flash可以从外部导入不同格式的位图和矢量图（由其他软件生成的），可以把导入的位图或矢量图作为一个图形对象来处理，通常将外部的图片导入到一个元件中

24、来处理。 5、元件元件：可以把动画中要表现的各种对象对象制作成元件的方式，元件的特点是，无论动画中出现多少次这样相同的对象，在生成的动画文件中始终都只会有一个对象的存储空间，这样可以减缩动画文件的体积。并且，元件是用于制作运动渐变动画用于制作运动渐变动画必不可少的。元件包含三种类型：七、运动补间动画（Motion）运动补间动画是Flash中最常见的一种动画，也是Flash中默认的一种补间动画形式。 运动补间动画是基于元件的补间动画，尽量使用元件来制尽量使用元件来制作运动补间动画！作运动补间动画！运动补间动画可以生成的效果有：位置移动位置移动、沿着一条路径移动（沿着一条路径移动（引导线动画引导线

25、动画）缩放变化缩放变化、倾斜变化、倾斜变化、旋转变化旋转变化亮度变化、色调变化、亮度变化、色调变化、透明度变化透明度变化、高级颜色变化、高级颜色变化复杂缓动效果复杂缓动效果 滤镜效果滤镜效果 关于使用元件、组、可编辑文字制作运动补间动画的说明关于使用元件、组、可编辑文字制作运动补间动画的说明 如果是使用组、可编辑文字来直接制作运动补间动画，那么Flash会自动将动画的起始关键帧中的对象转换成为一个元件，本质上还是由元件来生成动画的。 如果制作的动画包含了很多关键帧，Flash会为每个关键帧都自动生成一个内容相同但名字不同的元件，如“补间补间1”、“补间补间2”、“补间补间3” 这样很容易造成资

26、源的浪费造成资源的浪费，即表示相同的对象用了有多个不同的元件，造成不必要的资源开销。 所以，一个好的建议是一个好的建议是，在制作运动补间动画的时候，先把要产生动画的对象制作成为元件先把要产生动画的对象制作成为元件，再使用元件来制作动画，不管有多少个关键帧，动画中始终都只有唯一一个元件。运动补间动画的特点：1、放置在关键帧中的对象必需是元件元件；2、制作一段动画时只需要编辑开始开始和结束结束的两个关键帧上的内容，其中间变化过程由Flash软件自动计算完成；3、可以在动画的关键帧中设置加速加速和减速减速效果；4、运动补间动画是旋转、引导线动画的基础；5、可以用曲线编辑的方式为动画添加复杂的变速效果

27、。完成练习：制作出演示实例的各种Motion动画，重点在于旋转动画旋转动画、Alpha变化变化、沿路径变化沿路径变化（引导线动画） 。关于运动补间的“缓动”参数设置：做好运动补间动画以后，可以选择动画起点关键帧，在属性面板中可设置“缓动”，即用曲线变化的方式来调整对象运动的加速度变化，以得到更多的加速减速变化效果 。实例制作：弹力小球1、绘制元件：小球、阴影；2、将小球和阴影置于两个图层上，小球在上层；3、在小球层上设置三个关键三个关键帧分别表示出小球的不同位置，在这里可以使用一些设计技巧设计技巧*复制帧复制帧/粘贴帧粘贴帧4、产生运动补间动画（Motion），做出小球上下跳动的效果，设置下落

28、为加速，上跳为减速。注：加、减速的设置加、减速的设置只需要设置在每一小段动画开始的关开始的关键帧上键帧上，负值为加速，正值为减速负值为加速，正值为减速。5、在阴影层上设置相应的变化，同样是三个关键帧，并且在小球落下时阴影应该更小一点，颜色更深，小球上跳时阴影应该稍大些，颜色浅一点，所以阴影的变化是缩放变缩放变化化、颜色深浅变化颜色深浅变化（用用Alpha透明度实现透明度实现），为保持与小球的同步，阴影的变化也设置加速与减速效果也设置加速与减速效果，并且注意小球与阴影的关键帧的对应。6、测试动画，观察效果。注：不同层上的动画都是按照统一的时间轴播放的按照统一的时间轴播放的，这样就可以制作出复杂的

29、动画效果，让多个对象同时表现不同的动画。八、引导线动画步骤：1、先制作一段运动补间动画；2、添加引导层，在引导层上制作引导线；（注：引导线可以是闭合的或是非闭合的，如果是闭合的，只会走最短的路径。）3、将运动补间动画的对象的旋转中心点（可用任意变形工具来调整）对齐到引导线的两端。4、在测试影片的时候引导层的内容是不可见的。制作引导线动画的注意事项：制作引导线动画的注意事项：1、选中引导线动画的起始关键帧，在属性面板中有一项参数为调整到路径调整到路径，勾选这个功能可以让元件在沿曲线路径运动时始终能沿着曲线的方向。2、对象沿引导线运动是对象的旋转对称点对象的旋转对称点沿着引导线移动的过程，可以更改

30、对象的旋转对称点的位置更改对象的旋转对称点的位置来制作不同风格的引导线动画。 3、在闭合路径的引导线动画中，Flash会自动走两点间的最短路径。4、引导层中的内容在动画输出时是不可见的。实例制作：飞行的导弹实例制作：飞行的导弹1、制作好导弹的图形元件；2、使用导弹图形元件制作一段运动补间；3、添加引导层，在引导层上绘制导弹飞行的路径；4、让导弹元件沿路径运动；5、设置“调整到路径”参数；6、将导弹的起点与终点关键帧上的方向旋转，让其与路径的方向一致；7、测试影片，观看效果。时间差动画技术时间差动画技术将相同对象的动画（或是相同规律的动画）进行复制，粘贴到多个图层上，让其运动时间按某种有规律的差

31、距排列，形成时间差组合效果。九、创建素材九、创建素材制作图形素材常用的工具有：1、绘图类工具、绘图类工具：选择工具选择工具、直线工具、椭圆工具、矩形/多边形工具多边形工具、墨水瓶工具（填充轮廓）、颜料桶工具（填充内部区域）、刷子工具刷子工具、滴管工具、钢笔工具钢笔工具、部分选部分选取工具取工具、套索工具；2、绘图辅助类工具、绘图辅助类工具（功能）：标尺、网格网格、辅助线、对对齐功能齐功能；3、调整优化类工具、调整优化类工具：任意变形工具任意变形工具、填充变形工具、变变形面板形面板、混色器面板、对齐面板；4、图形处理类工具图形处理类工具：位图转换为矢量图位图转换为矢量图、优化曲线优化曲线、转换线

32、条为填充、伸直与平滑、扩展填充、柔化填充边缘。选择工具选择工具：有一个“对齐对象对齐对象”的开关选择项，用于移动对象的时候可以让对象的中心对齐到另一个对象上。选择工具还用于任意改变形状的外观。矩形矩形/多边形工具多边形工具：可以设置矩形的圆角度来绘制圆角矩形。绘制正方形正方形可以在拖动的同时按住按住Shift键键。制作多边形或星形，要先在属性面板设置好其参数。椭圆工具椭圆工具：按住Shift可绘制正圆。1、绘图类工具、绘图类工具对象绘制模式选项对象绘制模式选项：使用此项功能以后，绘制出来的图形以组的形式出现，各图形相互独立，在重叠时不会相互影响，此功能是Flash 8中的新功能。铅笔工具铅笔工

33、具：绘制线条，通常使用“平滑平滑”选项。墨水瓶工具墨水瓶工具：给没有轮廓的图形填充上轮廓，可以在属性面板中选择所用的轮廓线线型轮廓线线型。颜料桶工具颜料桶工具：用来填充图形的内部区域，如果要填充的是渐变色，可以结合“混色器混色器”面板来完成。填充的时候要注意填充选项，（填充区域的闭合程度填充区域的闭合程度）。选择一种渐变方式（线性渐变、放射渐变、多重线性线性渐变、放射渐变、多重线性渐变、位图填充渐变、位图填充）填充以后可以选中所填充的对象，在混色器面板中颜色用滑块可以改变渐变中的各种颜色，并且可以设置颜色变化的深度；更改填充渐变方更改填充渐变方式式；设置所用颜色的色相和透明度设置所用颜色的色相

34、和透明度。注：选中某些工具后在属性面板中有相关参数选择选中某些工具后在属性面板中有相关参数选择。刷子工具刷子工具：用一定的笔刷来绘制线条形状。通常用来制作类似纸带、书法笔触的图形。滴管工具滴管工具：用来选择已经有图形中的颜色做为当前填充的颜色，如果选择的是打散的点阵图（从外部导入的），则将该位图信息做为填充内容。钢笔工具钢笔工具：用来绘制精确的直线和曲线。 使用钢笔工具的时候可以辅助以显示网格、对齐网格来绘制，以达到精确的效果；或者打开对齐对象的功能，以便更好地定位结点的闭合；如果绘制出的是闭合曲线，会自动填充上颜色； 钢笔工具的作用如下： （1）绘制直线：单击鼠标即可； （2）绘制曲线：按住

35、鼠标拖动； （3）将曲线点变为直线点：将钢笔移到曲线点上，当鼠标光标出现“”时单击； （4）在曲线上添加结点：移到曲线上，出现“+”时单击可添加结点。部分选取工具部分选取工具：部分选取工具主要用来移动曲线上的结点、调整曲线的形状、转换直线点为曲线点等。用此工具在曲线上单击，可以显示出曲线上的结点，选中一个结点后，如果显示的是正方形，则该结点为直线点直线点，如果显示的是圆形，则该结点是曲线点曲线点；选中曲线点后，会显示出这个曲线点的调节线，调节线末端是一个圆点，拖动调节线的末端可以改变曲线的外观。部分选取工具的作用：（1）编辑结点与曲线：移动结点位置、选择结点、调整曲线点的调节线来改变曲线的外观

36、；（2）将直线点转换成曲线点：移至选中的直线点上按住按住Alt拖动拖动，则可将直线点变为曲线点，同时拖拉出曲线的调曲线的调节线节线；（3）将平滑点变为尖突点：在平滑点一方的调节线末端按住Alt拖动拖动，则可以使此调节线单方向调整单方向调整（默认情况下平滑点两端的调节线是同时被调整的。曲线是由结点和线段构成，要改变曲线的形状，可以调整曲线的调节线，复杂的曲线由简单的曲线构成，下图显示了由两个结点可以生成的两种基本的曲线：套索工具套索工具：用于选取一个范围（选区）； 1、自由模式：可以自由绘制出一个范围（可以是不闭合的）围住所需要选择的范围进行选取； 2、多边形模式：可以单击以确定结点，绘制出一个

37、多边形范围，在任何地方双击鼠标由自动形成闭合。 3、魔术棒模式魔术棒模式： （首先设置参数）颜色阈值颜色阈值（0200），即相邻颜色的幅宽，数值越大，选择的范围越大；如果要选的颜色值为55，设置了颜色阈值为20的话，那么选择范围变为3575；但在Photoshop中的魔术棒，选取范围将是4565；这两个软件对于这个处理形式是不一样的，这一点要区分！平滑度平滑度：决定了选区边缘平滑程度，“像素像素”最为精确，“平滑平滑”是产生光滑的边界。2、绘图辅助类工具、绘图辅助类工具标尺、网格网格、辅助线、对齐功能对齐功能： 主要用于将图形对象对齐，以网格、辅助线为参考线，并且设置相应对齐功能并且设置相应对

38、齐功能，在移动对象和绘制对象的时候，对象的结点会对齐到相应的网格、辅助线上。 可以从“视图”菜单下选择使用网格和标尺，在标尺上拖动鼠标点舞台可以拖动出辅助线； 显示了网格和辅助线之后，应该要在“贴紧”一项中选择相应的贴紧选项，才能打开相应的对齐功能。 打开了对齐功能之后，在移动对象的中心点中心点、曲线结曲线结点点靠近网格交叉点或辅助线的时候，对象的相应点会自动吸附到网格交叉点或辅助线上。任意变形工具任意变形工具：可以实现对图形变形，放大放大/缩小缩小、旋转旋转、倾斜、扭曲、封套封套、调整图形的旋转中心点调整图形的旋转中心点等工能。填充变形工具填充变形工具：只能用于渐变填充只能用于渐变填充，对单

39、色填充无效。选择此工具后单击填充了渐变色的对象，可以出现控制点，调整渐变色的分布和样式。3、调整优化工具、调整优化工具变形面板变形面板：可以把选中的对象按比例放大、缩小，旋转，水平翻转，垂直翻转，所有变化依据一个确定的数字参数。除此以外，还有一个很重要的功能，复制并应用变形复制并应用变形，可以用来制作对称图案。复制并应用变形使用的方法使用的方法：要先对对象进行变化（缩放、旋转度、倾斜度的设置），再点击此按钮，可以不断地复制对象，同时应用所设置的变化。混色器面板混色器面板：用于调整填充区域的颜色。填充可分为纯色、渐变色（线性、放射状）、位图几种方式。对于渐变色，可以颜色标尺上点击鼠标以增加颜色滑

40、块，如果要去掉某一个颜色滑块，只要用鼠标将其拖离颜色标尺即可。可以为填充的颜色设置一个透明度（可以为填充的颜色设置一个透明度（Alpha）值。）值。对齐面板对齐面板：用于调整所选的对象（多个）相对对齐方式，以改变对象的空间位置的分布，达到整体协调的目的。练习：制作如下的图形练习：制作如下的图形1、轮廓与内部填充是分开的两个对象；2、绘制出的图形是打散打散的矢量形状；3、可以使用选择工具随意改变图形的几何外观改变图形的几何外观；4、不同颜色的对象重叠不同颜色的对象重叠以后如果取消了选择状态，将出现对象被切割切割的现象；同种颜色的对象重叠同种颜色的对象重叠以后如果取消了选择状态，那么这些对象将会被

41、焊接在一起焊接在一起形成一个整体。5、任何图形都是以矢量图矢量图的形式记录的；可以使用部分选取工具来修改矢量图的任何一个结点。绘图总结绘图总结4、图形处理类工具、图形处理类工具转换位图为矢量图转换位图为矢量图： Flash虽然提供了一些绘图工具，但有时候也需要从现有的素材中对我们需要的部分进行处理和修改，最常见的一种情况就是将已经有的位图素材转换成适用的矢量图素材。 颜色阈值（1500） 当两个像素进行比较后，如果它们在 RGB 颜色值上的差异低于该颜色阈值，则两个像素被认为是颜色相同。如果增大了该阈值，则意味着降低了颜色的数量；这个值越大，生成的矢量图中的颜色数就少，文件就小，但图片质量可能

42、越差；最小区域（11000） 用于设置在指定像素颜色时要考虑的周围像素的数量。这个值越大，越容易破坏图片中精细的部位，要适当设置；曲线拟合 确定绘制的轮廓的平滑度，像素是最精确的选项，但是生成的文件可能过大，非常平滑是生成文件最小的选项，但是可能会使图片细节部分被破坏；转角阈值 确定是保留锐边还是进行平滑处理。较多转角方式生成的图片会带有较多的尖角，看起来不够平滑；较少转角的方式看起来会比较平滑，但某些时候可能会破坏本来应该有转角的图形部分；一般选择正常方式。优化曲线优化曲线：将位图转换成矢量图之后，通常需要对转换后的矢量图进行优化，优化的作用可以有效减小其复杂程度，在保证图片质量和减小文件大

43、小之间取得一个平衡。优化曲线能有效减小了 Flash 文档（FLA 文件）和导出的 Flash 影片（SWF 文件）的大小。 平滑平滑：指定平滑程度，精确的结果取决于所选定的曲线。一般来说，优化可以减少曲线数量，平滑度越大，优化后曲线数量就越少，与原始外形的差别就越大。 使用多重过渡使用多重过渡：可以重复进行平滑处理直到不能进一步优化为止，这相当于对同一选定元素重复选择“优化”。转换线条为填充转换线条为填充：轮廓线与填充是不同的对象，在处理的时候有差异，此功能可以将轮廓线条转化为填充来处理。 将线条转化为填充的必要性之一： 当图形中需要显示宽度小于1的线条时，也可以保持线条和图 形的比例不变而

44、整个地缩放图形。填充没有和线条一样的显示限制，缩放时会保持比例，因为在Flash中，最小的可显示的线条尺寸是1，宽度小于1的线条在按100%显示比例查看时都将显示为同一宽度，只有在放大视图时宽度的差异才能分辨得出。（在高分辨率的打印机上可以打印出正确的线条）原始100%的图形，线条轮廓为4缩小到20%的图形，线条轮廓为4将线条转换为填充后缩小到20%的图形 将线条转化为填充的必要性之二： 将线条转化为填充另一个重要功能是在形状中创建真正的直角。Flash绘图工具在绘制宽度大于1的直线时，端部或拐角处都默认为圆滑的，把线条转为填充形状之后，可以使用伸直曲线的功能或单独修改形状中的结点来创建真正的

45、尖角和方形直线端头；原来的图形，轮廓为10，为圆角结点将轮廓转换为填充后并用伸直曲线功能后的图形，真正直角的结点经验之谈：从以上两点可以看出，将线条转为填充在有的时候就非常重要，它影响着影片的输出质量，并且，Flash在动画中对线条的处理需要花费比填充更多的资源，一般图形中不需要线条的时候尽量不要轮廓线，可以提高动画质量。伸直曲线伸直曲线：是选择工具的一个选项，伸直操作可以稍微弄直已经绘制出的曲线。它不影响已经伸直的线段；平滑曲线平滑曲线：是选择工具的一个选项，平滑操作使曲线变柔和并减少曲线整体方向上的突起或其它变化。同时还会减少曲线中的线段数。 不过，平滑只是相对的，它并不影响直线段。如果在

46、改变大量非常短的曲线段的形状时遇上困难，该操作尤其有用。选择所有线段并将它们弄平滑可以减少线段数量，从而得到一条更易于改变形状的柔和曲线。 根据每条线段的原始曲直程度，重复应用平滑和伸直操作可以会使每条线段更平滑更直；扩展填充扩展填充： 在不包含很多细节的小型形状上使用效果最好，它只对填充有效，不能对轮廓线进行操作。 如果操作的对象周围有内容，那么可能会产生一些周边内容被盖住的现象；如果此图形带有轮廓线，使用向内扩展的时候在图形填充的轮廓线之间会产生空隙，所以最好在没有轮廓线的填充形状上使用该项功能。扩展填充命令可以用于创建定制的文本，如膨胀（变宽）式文字和腐蚀（变细）式文字。如图（首先要将文

47、字打散为图形）注意：在进行向内缩的时候，要注意距离不可太大，否则可能产生走样的情况。柔化填充边缘柔化填充边缘： 只能用于形状，该功能在没有轮廓的单一填充形状上使用效果最好。 这一项功能的作用是在初始填充的周围创建一系列环带形填充，并且透明度内里向外逐渐增加，类似Photoshop中的羽化功能；所不同的是此功能是以矢量形式模拟羽化效果，此功能慎用。在Flash8中可以用某些滤镜效果来代替此功能。 距离：选定初始形状扩展和收缩的像素值； 步数：填充边缘上创建的条状填充的数量（层数），步数 越多越平滑，但文件越大，处理过程越慢； 扩展、缩进：决定方向是向外还是向内；综合素材制作综合素材制作 当用户正

48、在为一系列相关的关键帧创建作品时，有一些从一帧到另一帧改变情况的“视觉提示视觉提示”或“变化过程变化过程映像映像”是很重要的。在Flash中这个特性称作洋葱皮洋葱皮，在时间轴上有以下几个相关功能：1、Onion Skin（洋葱皮洋葱皮或称为或称为绘图纸绘图纸）：可以同时显示动画的几个帧，当前帧旁边的帧用半透明方式显示；2、Onion Skin Outline（洋葱皮轮廓洋葱皮轮廓/绘图纸轮廓绘图纸轮廓）：同时显示动画的几个帧的轮廓形式轮廓形式。 可以使用洋葱皮技术来使相邻的关键帧以半透明半透明的方式作为当前关键帧的参考。3、Modify Onion Markers（修改洋葱皮标记修改洋葱皮标记

49、/修改绘图纸标修改绘图纸标记记）：弹出洋葱皮菜单，用来控制洋葱皮的作用范围。十、帧编辑技术十、帧编辑技术4、Edit Multiple Frame（编辑多个帧编辑多个帧）：通常，洋葱皮选项允许用户编辑当前帧，使用此项可以使洋葱皮标记之间洋葱皮标记之间的每个帧的每个帧都可同时进行编辑，常用于将场景中所有关键帧同时编辑（比如将整个动画进行整体移位或缩放）。 对于帧的编辑，可以在相应帧上点击鼠标右键，有以下几项常用的操作：（1）、选择帧；（2）、复制帧、粘贴帧、移动帧、删除帧；（3）、延长两个关键帧之间的时间长度：插入普通帧（F5）（4）、缩短两个关键帧之间的时间长度：选择中间的一些普通帧，使用删除

50、帧删除帧的操作（注意，不能用键盘不能用键盘Delete键键删除，删除，Delete是删除帧中的内容是删除帧中的内容）。 逐帧动画逐帧动画是最基本的动画形式，就是说动画由很多连很多连续的关键帧组成续的关键帧组成，每一帧上的内容都是制作者制作出来的。 渐变动画的中间过程帧是由软件计算产生的，而用逐帧动画的方式，用户必需手工制作每一帧上的内容。 由于逐帧动画的每一帧都是独一无二的图片内容，对于需要细微变化的复杂动画来说，这种形式是最理想的。优点优点：可以表现出极细微复杂的变化表现出极细微复杂的变化；当形状渐变与动作渐变无法做到的时候，可以使用逐帧动画方法来试试。缺点缺点：需要制作每一帧，关键太多，制

51、作费时，动画文件体积较大。十一、逐帧动画十一、逐帧动画阶段综合阶段综合实例制作实例制作1、齿轮运动（运动补间旋转效果）2、风吹文字效果（运动补间倾斜变化与透明度）3、幻影效果（运动补间编辑帧、动画帧梯度分布）4、光线效果（形状补间渐变填充效果）5、跳舞文字（运动补间动画帧梯度分布）6、翻书效果（形状补间或是逐帧动画）7、立体几何图形生成示意（逐帧动画）8、写字效果（逐帧动画）9、花样飞行（引导线动画、逐帧动画）10、人物动作（逐帧动画） 遮罩（遮罩（Mask），也叫蒙版，就是用来有选择地显示对象内容的一种技术。在Flash中，遮罩图层用来定义它下方的被遮罩图层中的可见区域。遮罩图层在上面，被遮

52、罩图层在下面。 导入的图片、组、可编辑文字、元件元件、矢量形状（排矢量形状（排除线条）除线条）都可以用来创建一个遮罩，在遮罩图层中，Flash会忽略图片的渐变、透明、颜色以及线条类型等效果，只表现出一个形状范围。 遮罩图层上的对象就像一个窗口，显示出来的内容是显示出来的内容是被遮罩图层上的内容被遮罩图层上的内容，显示区域就是遮罩图层上对象的外形区域；遮罩可以是动态的，或者静态的遮罩可以是动态的，或者静态的。十二、遮罩效果十二、遮罩效果1、用户不能对一个遮罩图层再进行遮罩，一个遮罩图层可以同时对多个被遮罩图层进行遮罩同时对多个被遮罩图层进行遮罩，只有处于遮罩图层下方的被遮罩图层才会受遮罩的效果影

53、响，而普通图层不会而普通图层不会受影响受影响。2、一个遮罩图层中可以同时放置导入的图片、组、文本、元件、矢量形状等多个对象，但不同对象之间会相互干扰，出现意外情况；所以建议每次只在一个遮罩图层中放置一个对象来进行遮罩；3、当使用一个按钮元件作为遮罩时，按钮元件就只表现出外形特性，即一个放在遮罩图层的按钮元件就不再是一个放在遮罩图层的按钮元件就不再是一个能响应鼠标的按钮能响应鼠标的按钮了，只是一个图形范围。使用遮罩的限制和注意事项使用遮罩的限制和注意事项4、遮罩图层不能作为被引导层遮罩图层不能作为被引导层，也就是说不能直接让遮罩（或被遮罩）图层上的对象同时做引导线动画，如果需要用到这个特性，可以

54、将引导线动画做到MC元件中，将此MC元件作为遮罩（或被遮罩）层上的对象。5、可以为遮罩层和被遮罩层上的对象都制作补间动画，生成动态遮罩效果；矢量形状（打散的图形）最容易生成遮矢量形状（打散的图形）最容易生成遮罩效果罩效果，在制作静态遮罩时，尽量使用矢量形状。6、遮罩图层不能用在按钮元件的时间线里遮罩图层不能用在按钮元件的时间线里；动态文本不能直接做遮罩。1、望远镜/探照灯效果2、文字填充效果、进度条效果/字幕效果3、X透视效果/滤镜/透镜效果4、透明人效果5、带引导线运动的遮罩效果6、片头/镜头转场效果（场面切换效果）7、其他遮罩效果光线散射效果、心电图效果遮罩效果综合制作遮罩效果综合制作十三

55、十三 、影片剪辑、影片剪辑 影片剪辑元件（MovieClip），简称MC，是Flash中最重要的元件，可以在MC时间线中包含一段独立的动画，将MC放到场景时间轴中的时候，不论此MC在场景时间轴上占有多少帧，哪怕只有一帧，MC也会自动将内部的动画进行反复播放。 这和图形元件是不一样的，如果在图形元件的时间轴中也包含了一段动画，那么将图形元件放到场景时间轴中的时候，如果图形元件只占有一帧，则此图形元件只会显示出其内部时间轴上一帧的内容，如果在场景中的图形元件占有N帧的长度，则图形元件能依次显示出其内部N帧的内容。假设在一个图形元件中做了20帧的动画，只有当此图形元件在场景时间轴中占有20帧长度的时

56、候，其内部的20帧长度的动画才能显示出来。在表示静态对象的时候，影片剪辑和图形元件没有太大的区别，当然，影片剪辑有自己特殊的作用，如下：（1）影片剪辑的时间轴是独立于场景时间轴的，它不受场景时间轴的影响，而图形元件的时间轴是属于场景时间轴的，会受场景时间轴的影响；（2）影片剪辑实例可以赋予实例名称，然后在动作脚本中使用程序来控制影片剪辑，而图形元件实例不能直接被动作脚本控制；（3）影片剪辑元件可以使用滤镜效果、混合模式效果，而图形元件则不行；（4）可以为影片剪辑编写鼠标事件和影片剪辑事件，而图形元件则无此功能。十四十四 、滤镜与混合模式、滤镜与混合模式 滤镜与混合模式是Flash 8新增加的功

57、能，可以制作出位图级的变化效果。在之前的版本里，要想做出位图级的变化效果是很困难的，而且实现以后性能也不好。 使用滤镜，可以为文本、按钮文本、按钮和影片剪辑影片剪辑增添有趣的视觉效果，并且经常用于将投影、模糊、发光和斜角应用于图形元素。在Flash8中支持的滤镜效果有：投影投影：投影滤镜可模拟对象向一个表面投影的效果，或者在背景中剪出一个形似对象的洞，来模拟对象的外观。模糊模糊：模糊滤镜可以柔化对象的边缘和细节。将模糊应用于对象，可以让它看起来好像位于其它对象的后面，或者使对象看起来好像是运动的。发光发光：使用发光滤镜，可以为对象的整个边缘应用颜色。斜角斜角：应用斜角就是向对象应用加亮效果，使

58、其看起来凸出于背景表面。可以创建内斜角、外斜角或者完全斜角。渐变发光渐变发光：应用渐变发光，可以在发光表面产生带渐变颜色的发光效果。渐变发光要求选择一种颜色作为渐变开始的颜色，该颜色的 Alpha 值为 0。您无法移动此颜色的位置，但可以改变该颜色。渐变斜角渐变斜角：应用渐变斜角可以产生一种凸起效果，使得对象看起来好像从背景上凸起，且斜角表面有渐变颜色。渐变斜角要求渐变的中间有一个颜色，颜色的 Alpha 值为 0。您无法移动此颜色的位置，但可以改变该颜色。调整颜色调整颜色：使用调整颜色滤镜，可以调整所选影片剪辑、按钮或者文本对象的亮度、对比度、色相和饱和度。混合模式混合模式 使用混合模式，可

59、以创建复合图像。复合是改变两个或两个以上重叠对象的透明度或者颜色相互关系的过程。使用混合，可以混合重叠影片剪辑中的颜色，从而创造独特的效果。 在Flash8中，影片剪辑的混合模式是由MC的一个属性值来决定的，这个属性为blendMode，它的取值可以是整数值或是字符串值，如下表所示，若要设置 blendMode 属性，可以使用从 1 到 14 的整数或使用字符串。整数整数值值字符串值字符串值插图插图说明说明1normal一般：一般：影片剪辑显示在背景之前。影片剪辑的像素值将覆盖背景的像素值。在影片剪辑为透明的区域，背景是可见的。2layer图层：图层：强制为影片剪辑的预构成创建临时缓冲区。如果

60、影片剪辑中有多个子对象，并且为子级选择了 normal 以外的其它 blendMode 设置，则该操作将自动完成。 3multiply色彩增殖：色彩增殖：将影片剪辑构成颜色的值与背景颜色的值相乘，然后通过除以 0 xFF 进行标准化，从而得到较暗的颜色。此设置通常用于阴影和深度效果。即即“正片叠底正片叠底”模式，屏蔽白色模式，屏蔽白色整数整数值值字符串值字符串值插图插图说明说明4screen萤幕：萤幕：将影片剪辑颜色的补色（反转色）与背景颜色的补色相乘，从而得到漂白效果。此设置通常用于产生加亮效果或用来删除影片剪辑的黑色区域。 即即“滤色滤色”模式，屏蔽黑色模式，屏蔽黑色5lighten变亮：