《FlashCS3课件123.ppt》由会员分享，可在线阅读，更多相关《FlashCS3课件123.ppt（88页珍藏版）》请在三一办公上搜索。
1、Flash CS3网页动画设计,孙祎2010/09,江苏经贸职业技术学院,1 Flash CS3基础,内容提要与重点,动画与图形的基础知识Flash的发展历史与应用领域Flash CS3的安装、卸载、启动认识Flash CS3的基本界面认识Flash CS3的工作区、菜单、工具栏和各种面板掌握Flash文件格式Flash CS3的制作流程,动画原理,动画是通过把人、物的表情、动作、变化等分段画成许多画幅，再用摄影机连续拍摄成一系列画面，给视觉造成连续变化的图画。它的基本原理与电影、电视一样，都是视觉原理。医学已证明，人类具有“视觉暂留”的特性，就是说人的眼睛看到一幅画或一个物体后，在1/24秒
2、内不会消失。电影采用了每秒24幅画面的速度拍摄播放，电视采用了每秒25幅（PAL制，中国电视就用此制式）或30幅（NTSC制）画面的速度拍摄播放。,动画发展,1828年，法国人保罗罗盖特发现了视觉暂留。发明了留影盘1831年，法国人Joseph Antoine Plateau把画好的图片按照顺序放在一部机器的圆盘上，旋转圆盘。这就是原始动画的雏形。1909年，美国人Winsor Mccay用一万张图片表现一段动画故事，这是迄今为止世界上公认的第一部象样的动画短片。20世纪70-80年代，计算机图形、图像技术和软件、硬件都取得了显著的发展，使计算机动画技术也日趋成熟。目前，计算机动画技术已经发展
3、成为一个多种学科和技术交叉的综合领域。,位图和矢量图,计算机中的图形一般可以分为：矢量图和位图。位图：亦称为点阵图像或绘制图像，是由称作像素（图片元素）的单个点组成的。这些点可以进行不同的排列和染色以构成图样。矢量图：使用直线和曲线来描述图形，这些图形的元素是一些点、线、矩形、多边形、圆和弧线等等，它们都是通过数学公式计算获得的。软件：Illustrator、CorelDRAW、Freehand、Flash等 矢量图与位图最大的区别是，文件更小且不受分辨率的影响。导入到Flash中的位图依旧保持着位图的特性。,Flash发展历史,MacroMedia,FutureWave,名称：FutureS
4、plash主要客户：Microsoft和Disney,Adobe,1966.11收购，改名为Flash1.03.0时应用于互联网迅速发展，功能愈发强大，应用更加广泛4/5/MX/MX2004/8,2005.12.5花34亿美元收购MM基于OOP的AS3.0支持简易3D图形CS3/CS4/CS5,版本演进,Flash应用,软件系统界面,应用程序,手机领域,站点建设,Web服务,多媒体娱乐,游戏开发,Flash是MacroMedia提出的”RIA“概念的实现平台,应用广泛,功能,独特的时间片段分割和重组技术,是关键,符合OOP的ActionScript3.0和XML的完美支持给予了Flash强大的
5、功能，以及其特有的技术：,跨平台，FlashPlayer,很强的可移植性,手机支持功能，Flash Lite,如何制作swf文件,Flash 作为Adobe Creative Suite 一部分，与其他软件完美融合，协同工作。Flash和Flex都是制作swf文件的IDE，只是侧重的方式不同。两者都依靠Actionscript3.0的强大功能。,侧重前台和动画方面，依靠时间轴和元件构建界面侧重功能实现方面，代码编辑器强大很多，依靠MXML语言构建界面Flex的下一个版本，组合了Flash和Flex,Flash,Flex,Flash Builder,Flash CS3文件,.Fla：源文件，可编
6、辑（Flash软件打开）.swf：最终生成的文件格式，不可编辑（硕思闪客精灵）（Flash Player播放）.as：flash脚本文件（任意文本软件编辑）.exe：swf文件可以创建不需Flash Player播放的可执行文件,Flash CS3的安装与卸载,计算机需满足Adobe关于Flash CS3的最低硬件配置要求安装时需关闭相关进程，如Internet Explorer等安装时会自动安装Abobe相关共享组件安装时注意选择安装Adobe Flash Player 9 ActiveX和Plugin，这是浏览器的插件安装：Flash CS3可以单独安装也可以在Adobe Creative
7、 Suite CS3 中选择安装卸载：在控制面板中的“添加或删除程序”中找到，删除,Flash CS3启动界面,启动界面,开始页,Flash CS3编辑界面,时间轴、舞台、工作区,时间轴：文档卡、图层、层文件夹、帧、层工具、洋葱皮、动画信息 舞台：编辑区域，生成文件后的显示区域（网格、标尺、辅助线）工作区：场景、工作区（个性化环境）、缩放,菜单栏、工具栏及窗口面板,菜单栏：11个主菜单工具栏：主工具栏和绘图工具栏窗口面板：面板组，组合、折叠、浮动、锁定、隐藏、改变大小、缩成图标等操作,工具栏详解,Flash动画是通过更改连续帧的内容，并以图层的方式对不同的动画内容进行编辑和组合来完成的。1帧:
8、帧是Flash影片的最小单位。在Flash中，动画是由许多独立的帧组成的。在每一帧中放置不同的图像，2图层:图层是一种按顺序堆积的透明窗口，具有方便管理对象和组织重叠对象的功能。位于不同图层上的对象，其互相之间是独立的。把对象放置在不同的图层，可以通过改变图层的排列顺序方便地实现对各对象堆叠顺序的控制和重置。,帧、图层,Flash制作流程,制作流程,2.新建Flash影片文档,3.设置文档属性,4.制作动画,5.测试和保存影片,1.准备素材,6.导出和发布影片,我的第一个Flash,演示：,2 Flash CS3对象操作,内容提要与重点,认识Flash CS3中的对象对象的选择、移动对象的复制
9、、剪切、粘贴、删除对象的中心点、变形对象的对齐、堆叠对象的组合、分离,什么是对象,Flash CS3中的对象所指的是舞台上所有可视元素。例如：图像、文字、声音、影片剪辑、组件等。Flash对象分为：流型对象、固型对象、不可见对象。,对象的选择、移动,选择工具：选择、部分选择、任意变形、套索选择方式：单选、多选（Shift）、部分选、框选移动：任意移动、45倍数移动（Shift）、精确移动（信息面板）,对象的复制、剪切、粘贴、删除,复制：拖动复制、剪贴板复制（Ctrl+C）剪切：（Ctrl+X）粘贴：粘贴到中心位置（Ctrl+V）、粘贴到当前位置（Ctrl+Shift+V）删除：剪切或清除命令（
10、Delete或BackSpace）,对象的中心点、变形,中心点：基准点，可改变位置缩放：水平、垂直、等比例缩放旋转与倾斜：自由变形工具、预设翻转：水平、垂直斜切：扭曲：变形：,对象的对齐、堆叠,对齐：相对于舞台、相对于对象间隔：分布：匹配大小：排列：移动层的Z位置,对象的组合、分离,组合：将多个对象组合成一个对象，保持原始相对位置（Ctrl+G）分离：将组合解散或将固型对象转换成流型对象（Ctrl+B）,3 使用时间轴、图层和帧,内容提要与重点,时间轴、图层、帧的相关基础知识全面认识“时间轴”面板学习图层的创建和操作学习帧的创建和操作，改变帧的显示方式使用时间轴特效制作动画,时间轴、图层、帧,
11、时间轴控制Flash的播放，其主要由横向的帧和纵向的图层组成。使用时间轴特效,图层,图层类似于透明的玻璃纸，由叠放顺序决定内容的显示。图层文件夹：方便管理图层图层的创建、排列顺序、删除、重命名图层的编辑状态、隐藏、锁定、轮廓图层的分类：一般、引导层（被引导层）、遮罩层（被遮罩层）,帧,帧是构成动画的基本单位，动画的过程就是帧不停地显示的过程。帧的分类：关键帧、空白关键帧、普通帧（过渡帧）帧的显示方式：帧的操作：在帧上右击，弹出菜单,4 使用元件、实例、库,内容提要与重点,认识元件与实例元件类型与创建元件的方法影片剪辑按钮使用库集中管理元件,元件与实例,拍电影的一般知识。导演的作用，如何统筹演员
12、、道具、场地等所有资源。元件是指可重复利用的图形、动画片段或按钮，保存在库面板中。将元件应用到舞台上则变成了实例，实例具有元件的属性，也可以有自己特有的属性（不会改变元件的属性）。一旦元件发生变化，则实例也发生变化。,元件类型与创建,影片剪辑：独立的动画片段，具有自己独立的时间轴，简单的说就是一个flash文件中的flash。按钮元件：对鼠标事件作出响应的交互按钮图形元件：通常存放静态图像，也可以建动画，可以包含其他元件实例1.插入新建元件2.选择舞台上的对象，修改转换为元件注册点：坐标原点所在的位置,元件编辑-1,三种编辑模式：当前位置、新窗口、元件编辑模式1.当前位置：其他对象变灰不可编辑
13、，方便编辑时对齐位置 进入编辑状态：a.舞台上双击元件 b.舞台上选择元件，右键在当前位置编辑c.舞台上选择元件，编辑在当前位置编辑 修改注册点 退出编辑状态：a.舞台顶部编辑栏左侧的“返回”b.再次选择当前场景c.编辑编辑文档d.双击元件外的区域2.新窗口：单独的窗口中编辑 舞台上选择元件，右键在新窗口中编辑右上角的关闭按钮，在主文档内单击以返回,元件编辑-2,3.元件编辑模式：只显示该元件的单独视图 进入编辑状态：a.双击库中元件 b.舞台上选择元件，右键编辑 c.舞台上选择元件，编辑编辑元件 d.库中选择元件，右键编辑或使用库选项菜单中的编辑退出编辑状态：a.舞台顶部编辑栏左侧的“返回”
14、b.再次选择当前场景c.编辑编辑文档d.双击元件外的区域,影片剪辑,使用最频繁，功能最强大，利用它可以制作效果更为丰富的动画演示：人边走边跳地球绕着太阳转，同时月亮绕着月亮转,按钮,按钮式动画与人交互的灵魂，能够响应用户的操作弹起鼠标不在按钮上指针经过鼠标在按钮上按下鼠标在按钮上并且按下点击对鼠标作出反应的区域（播放时内容不显示）演示：一般按钮、变色按钮、背景变色按钮、声音按钮动态按钮、文字按钮、透明按钮影片剪辑做按钮,库,公用库和库公用库：系统提供的一些元件、类等库：用户自定义或导入的资源库的基本操作：分类：文件夹删除、编辑、重命名元件复制和直接复制排序不同文件的库打开外部库,5 在Flas
15、h CS3中绘制图像,内容提要与重点,使用矢量绘图工具绘图绘制线条绘制简单图形绘制复杂图形颜色的使用绘图模式图形变形绘制模式导入外部图片，如何处理位图擦除图形,绘图工具,钢笔工具文本工具线条工具基本图形工具铅笔工具刷子工具墨水瓶工具油漆桶工具滴管工具橡皮擦工具查看工具颜色工具（颜色面板）工具选项,线条,颜色和高度笔触样式（自定义）端点和结合：连续绘制线段笔触提示：用于连续多线条是否可以通过双击全选Shift，Alt：45倍数画线，双向画线改变方向、长度和弧度,线条,颜色和高度笔触样式（自定义）端点和结合：连续绘制线段笔触提示：用于连续多线条是否可以通过双击全选Shift，Alt：45倍数画线，
16、双向画线改变方向、长度和弧度,滴管和墨水瓶工具,先使用滴管获取原线条的属性，然后自动变成墨水瓶工具，单击新线条即可套用原线条样式。,矩形工具,边框颜色、大小、样式、端点、结合（尖角）、笔触提示填充颜色角的弧度Shift：正方形精确绘图：选择矩形工具，按住Alt，在舞台上单击基本矩形工具：控制点改变形状,椭圆工具,边框颜色、大小、样式、端点、结合（尖角）、笔触提示填充颜色起始角度、结束角度、内径、闭合路径Shift：正圆精确绘图：选择椭圆工具，按住Alt，在舞台上单击基本椭圆工具：控制点改变形状,多角星形工具,边框颜色、大小、样式、端点、结合（尖角）、笔触提示填充颜色选项：样式边数星形顶点大小,
17、柔化填充边缘,形状切割法柔化填充边缘：修改 形状 柔化填充边缘,颜料桶工具,空隙大小：不封闭、封闭小、封闭中等、封闭大空隙锁定填充：渐变和位图填充时有用使用：确定一点后向另一方向拖动,颜色面板,笔触和填充颜色颜色控制按钮：黑白色、无色、调换颜色颜色类型：纯色、渐变、放射性、位图RGB模式及颜色代码：红绿蓝（0-255），#+16进制表示Alpha：透明度颜色空间和亮度颜色设置条,颜色面板,笔触和填充颜色颜色控制按钮：黑白色、无色、调换颜色颜色类型（溢出、线性RGB）：纯色、渐变、放射性、位图RGB模式及颜色代码：红绿蓝（0-255），#+16进制表示Alpha：透明度颜色空间和亮度颜色设置条（
18、滑块添加、删除、修改，最多15个）,渐变变形工具,线性渐变（改变中心点、改变范围、改变方向）放射性渐变（改变中心点、改变范围、改变旋转、改变宽度、改变焦点）,钢笔工具,用钢笔绘制直线，闭合路径锚点的添加、删除、移动锚点转换，绘画曲线Alt单向转换部分选取工具的使用,铅笔工具,颜色、大小、样式、端点、结合（尖角）平滑选项：直线化、平滑、墨水,刷子工具,颜色、大小、样式、端点、结合（尖角）刷子大小和样式刷子模式：标准绘图：线条和填充均被着色颜料填充：不影响线条后面绘画：不影响前景图像颜料选择：选择区域着色（需先选择区域后再绘图）内部绘画：只在轮廓线内着色（起点必须在轮廓线内）,橡皮擦工具,橡皮擦大
19、小和样式橡皮擦模式：标准擦除：线条和填充均被擦除擦除填色：不擦除线条擦除线条：不擦除填充擦除所选填充：擦除选择填充区域（需先选择区域后再绘图）内部擦除：只在轮廓线内擦除（起点必须在轮廓线内）水龙头：快速擦除线条或填充双击橡皮擦工具可将舞台上所有内容清除,刷子工具,颜色、大小、样式、端点、结合（尖角）刷子大小和样式刷子模式：标准绘图：线条和填充均被着色颜料填充：不影响线条后面绘画：不影响前景图像颜料选择：选择区域着色（需先选择区域后再绘图）内部绘画：只在轮廓线内着色（起点必须在轮廓线内）,对象绘制模式,决定绘制出的图形是否为流型,切割与融合,流型：线条分割填充，填充相互融合固型：选择两个对象，修
20、改 合并对象-*：联合：两对象形成一个整体交集：两对象重叠部分打孔：上面的对象切割下面的对象裁切：上面的对象遮盖下面对象的部分被裁切保留下来,6 Flash CS3文本制作,内容提要与重点,在Flash CS3中使用文字编辑文字修饰文本文本分类文本使用技巧文本综合应用使用外部图片,文本工具,文本工具：静态文本、输入文本、动态文本输入文本操作演示文本框的宽度和高度自动换行粘贴文本：以群组方式显示，保留原格式,文本样式,文本类型字体（嵌入字体）、字号、颜色、粗体、斜体、文本对齐格式选项：缩进、行距、左边距、右边距文本方向、旋转（仅垂直时）字母间距、字符位置、字体呈现方法、自动调整间距换行、可选、H
21、TML格式、变量、边框、超链接和目标,文本锯齿,使用设备字体：不嵌入字体，swf大小不受影响，但运行机器上需安装设定的字体位图文本（未消除锯齿）：不进行平滑处理，嵌入字体，swf文件变大，缩放后效果差动画消除锯齿：嵌入字体，swf文件变大，字号在10px以上，否则不清晰可读性消除锯齿：嵌入字体，swf文件变大，保证小字号的清晰，动画效果差，可能导致性能问题自定义消除锯齿：粗度：确定消除锯齿转变显示的粗细，值大字符看上去较粗清晰度：文本边缘与背景过渡的平滑度,文本分离与填充,Ctrl+B：文本分割成单个字符字符转换成流型图形文本分散到时间轴文本需要分离成流型后方可使用填充效果,文本滤镜,滤镜指的
22、是应用于文本、影片剪辑和按钮效果，它能够为对象添加奇妙的视觉效果。滤镜设置 滤镜叠加预设滤镜复制滤镜删除滤镜,文本滚动,import flash.text.TextField;import.URLRequest;import.URLLoader;var l=new URLLoader(new URLRequest(0.txt);l.addEventListener(Event.COMPLETE,function()txt.text=l.data;btn1.addEventListener(MouseEvent.CLICK,function()txt.scrollV-=2;);btn2.addE
23、ventListener(MouseEvent.CLICK,function()txt.scrollV+=2;);),外部图片,文件 导入 导入到库（导入到舞台）将位图转换成流型Ctrl+B使用魔术棒工具删除背景色位图用于填充导入Photoshop和Illustrator文档（保留相应的层等对象）,7 Flash CS3中的声音和视频,内容提要与重点,声音的导入与编辑视频的导入与编辑声音于视频的应用,声音及导入,声音类型：事件声音、音频流事件声音需完全下载才能播放，除了明确终止外，将一直播放；音频流只需下载到够播放的帧数就可以播放，实现声画同步。声音格式：mp3、wav等，安装QuickTim
24、e将支持更多的格式导入声音到库,声音编辑,声音：选择声音文件效果：左右声道、淡入淡出、自定义（最多8个控制柄）等同步：事件：与关键帧同时开始，独立于时间轴直至播放结束开始：与“事件”类似，等上一个声音播放完后再播放，放置声音重叠停止：控制指定声音停止数据流：实现声画同步，若影片慢，则丢弃一些帧实现来声画同步重复/循环：播放次数（重复次数在数据流时会增加帧数，导致文件增大）,声音设置,在库中选择声音文件，查看其属性压缩：默认、ADPCM、MP3、原始、语音品质：快速、中、最佳比特率：8-160kbps,视频,视频类型：AVI、mp(e)g、mov、WMV、asf等Flv是flash专有视频格式，
25、具有体积小的优势。视频运用方式一般有：直接嵌入到flash文件（一般是很小的文件）、外部加载方式外部下载（渐进式下载）的优势：1.只需swf界面，不需处理视频2.不存在声画不同步、内存限制、文件体积大等问题3.视频文件帧频可以不同于播放器，使用更灵活,视频导入,演示,8 逐帧动画的制作,内容提要与重点,什么是逐帧动画逐帧动画制作方法,逐帧动画的概念,在时间轴上逐帧绘制帧内容称为逐帧动画灵活性很强，但是费时费力在时间轴上表现为连续的关键帧导入连续编号的位图导入gif动画,编辑多个帧,绘图纸是帮助定位和编辑动画的辅助功能绘图纸外观按钮绘图纸轮廓按钮编辑多个帧按钮修改绘图纸标记按钮（总是显示标记、锚
26、定绘图纸、绘图2、绘图5、绘制全部）绘图纸区：编辑多个帧，修改绘图纸标记（选择修改范围），按住Shift选取要编辑的帧，编辑帧内容,9 形状、动作补间动画制作,内容提要与重点,什么是补间动画补间动画制作方法两种补间动画的区别,补间动画,定义动画的开始和结束帧中的内容，中间的过渡过程由Flash自动完成。省时省力包括形状补间和动作补间形状：修改矢量图的形的形状动作：改变实例的、群组、和文本等的位置、大小、角度等，也可以使对象沿着指定路径运动,形状补间,开始和结束帧必须是流型形状，时间轴的背景呈率色和长箭头，虚线表示补间不能完成。缓动：0为匀速，负值则速度从慢到快、加速度，正值反之。也可以自定义缓动混合：分布式（过渡形状更为平滑和不规则）、角形（过渡时留有明显的直线和角）,形状提示点,最多26个提示点，并非越多越好，且要注意逻辑性。修改 形状 添加形状提示注意将贴紧至对象按钮选中黄色：在开始帧，有效绿色：在结束帧，有效 红色：无效提示,动作补间,开始和结束帧必须是固型形状，时间轴的背景呈蓝色和长箭头，虚线表示补间不能完成。缩放：开始和结束帧对象大小不同时，可以呈现大小渐变效果缓动：0为匀速，负值则速度从慢到快、加速度，正值反之。也可以自定义缓动旋转：次数调整到路径：用于引导动画，保持运动对象的自身方向同步：动画与主时间轴同步对齐：用于引导动画，根据注册点将对象附加到运动路径,
