第19,20次课flash基础.ppt

1,第四单元 常用多媒体软件使用基础,平面动画设计软件Flash基础,公共计算机教学部 施培蓓 Pb_shi163.com,2,主要学习内容,认识Flash 一、Flash的工作界面 二、Flash常用的名词 三、基本工具使用操作 四、动画制作,实验九：Flash形变动画制作,3,认识Flash,Flash是一款用于矢量图形创作和矢量动画制作的专业软件。 Flash是由Macromedia公司研发的，该公司被Adobe公司收购后，Flash 与Photoshop有了很好的集成性。,矢量图是根据几何特性来绘制图形， 矢量可以是一个点或一条线， 它的特点是放大后图像不会失真， 和分辨率无关，文件占用空间较小， 适用于图形设计、文字设计和一些标志设计、 版式设计等。,矢量图形与分辨率无关，可以修改描述图形形状的线条和曲线的属性，可以对矢量图形进行移动、调整大小、重定形状以及更改颜色的操作而不更改其外观品质。,位图图形跟分辨率有关，编辑位图图形可以更改它的外观品质。调整位图图形的大小会使图像的边缘出现锯齿，因为网格内的像素重新进行了分布。,6,一、Flash的工作界面,7,舞台,控制面板,时间轴控制面板,工具栏,8,面板的折叠（右侧和下方面板的显示/隐藏） 编辑区（或舞台）显示比例的改变 通过【窗口】菜单来实现工具栏的显示/隐藏,9,场景：Flash动画中提供了多场景动画的制作过程 时间轴：表示整个动画与时间之间的关系。 舞台: 在创建 Flash 文档时放置图形内容的矩形区域，这些图形内容包括矢量插图、文本框、按钮、导入的位图图形或视频剪辑，诸如此类。 舞台属性的改变,BACK,10,二、Flash常用的名词,11,帧： 就是影像动画中最小单位的单幅影像画面，相当于电影胶片上的每一格镜头。 一帧就是一副静止的画面，连续的帧就形成动画，如电视图象等。 每一帧都是静止的图象，快速连续地显示帧便形成了运动的假象。高的帧率可以得到更流畅、更逼真的动画。每秒钟帧数 (fps) 愈多，所显示的动作就会愈流畅。,1.帧和关键帧,解析：跳舞的小人图片序列,12,关键帧： 有关键内容的帧，用来定义动画变化、更改状态的帧。 Flash动画只要设置开始帧和结束帧即可。 任何动画要表现运动或变化，至少前后要给出两个不同的关键状态，而中间状态的变化和衔接电脑可以自动完成，在Flash中，表示关键状态的帧叫做关键帧。 有图像的关键帧（关键帧） “·”表示 无图像的关键帧（空白关键帧）“°”表示,1.帧和关键帧,13,空白关键帧：无对象的关键帧。 空白关键帧就是舞台什么东西都没有，在做物体出现消失的时候很有用，如果需要他在中间什么时候消失就可以在中间想对的时间轴上插如空白关键帧。,任何动画都要有第一帧,14,2.元件,元件：可反复取出使用的图形,按钮或一段小动画 如何创建元件? 方法 1:新建一个空白元件,然后在元件编辑状态下穿件元件的内容。选择菜单“插入”“新建元件”或者按键盘 ctrl+F8 也可以新建一个元件。 方法2:将场景上的对象转换成元件。选择场景里现有元件,单击鼠标右键,选择转换为元件。,15,3.图层,Flash中的图层作用与Photoshop相似。 为了动画设计的需要，Flash还添加了遮罩层和运动引导层。 遮罩层决定了被遮罩层的显示情况。 运动引导层用于设置动画沿路径运动。,BACK,16,三、基本工具使用操作,17,常用工具,颜料桶,墨水瓶,任意变形,选择,填充变形,橡皮擦,笔触颜色,填充色,使用“鼠标”按住“矩形工具”然后可以再下拉工具中进行选择,18,1.线条工具 2.椭圆工具（笔触颜色、填充色和笔触样式） 球、佛珠、糖葫芦等 3.铅笔工具 制作人脸等,（一）Flash基本图形绘制,19,4.矩形工具（边角半径设置） 邮票实例的制作 步骤： 新建一个flash文件，舞台背景改为“蓝色” ； 单击工具箱的矩形工具，在其属性面板中设置：笔触颜色为“白色”，笔触高度为15，笔触样式为“圆点”，填充色为“白色”； 在舞台绘制矩形； 导入一张图片，调整图片； 保存。,20,5.多角星形工具 五星红旗的制作 步骤： 新建一个flash文件； 单击工具箱的矩形工具，在其属性面板中设置：笔触颜色为“无色”，笔触高度为15，笔触样式为“实线”，填充色为“红色”；在舞台绘制矩形； 单击工具箱的多角星形工具，在其属性面板中设置：笔触颜色为“无色”，笔触高度为15，笔触样式为“实线”，填充色为“黄色”；单击“选项”按钮，设置样式为“星形”，边数为“5”；在舞台绘制五角星； 复制对象，拖动到合适位置； 保存。,21,1.选择工具 可用于抓取、选择、移动和改变图形形状 。 选择一个对象 如果选择的是一条直线、一组对象或文本，只需要单击需要的对象即可； 如果选择的是图形，需要在某条边线上双击鼠标左键； 选择多个对象 一种是使用框选； 另一种是按住【shift】键进行复选； 移动 直线变曲线,（二）对象的选取,22,2.部分选取工具（选学*） 可以选择并移动对象，也可以对图形进行变形等处理 步骤：（一个红心的制作） 使用椭圆工具绘制一个正圆，笔触颜色为“无色”，填充色为“红色”； 按住【ctrl】键，用鼠标进行拖动，复制出另一个正圆，拖动到合适位置； 选择部分选取工具，单击以选中图形； 单击图形底部的路径点，向下方拖动，拖出一个尖状，作为心的底部； 选中图形中部路径点，按【delete】将其删除。,23,3.套索工具,24,文本工具 设置文本字体、大小、颜色、样式、对齐方式等； 将文本转换为矢量图形，对其进行渐变色填充、绘制边框路径等操作； 滤镜（投影、渐变发光等）,（三）Flash文本编辑,案例一：制作动画的文字,25,步骤： 导入文件图片，利用任意变形工具来改变图片的大小； 选择文本工具，在【属性】面板中设置文本属性：字体为黑体，字体大小为35，文本颜色为红色； 在舞台中输入“美好的时光”几个字； 在【时间轴】面板中单击右键插入关键帧，一共插入5个关键帧； 选择第1帧，把舞台中的第1个字保留，其余文本都删除掉，这样致保留第一个字“美”； 选择第2帧，把舞台中的前2个字保留，其余文本都删除掉，这样致保留第一个字“美好”； 选择第3帧，把舞台中的前3个字保留，其余文本都删除掉，这样致保留第一个字“美好的”； 选择第4帧，把舞台中的前4个字保留，其余文本都删除掉，这样致保留第一个字“美好的时”； 第5帧保留所有文本； 【控制】菜单中选择测试影片命令（CTRL+Enter）来预览动画效果； 可以放慢播放速度，【修改】菜单中选择文档命令，在打开的【文档属性】对话框中，更改【帧频】为1. CTRL+Enter再次预览动画；,BACK,26,四、动画制作,27,（一）逐帧动画,案例二：跳街舞的小人,在时间帧上逐帧绘制帧内容称为逐帧动画，由于是一帧一帧的画，所以逐帧动画具有非常大的灵活性，几乎可以表现任何想表现的内容。 由于逐帧动画的帧序列内容不一样，不仅增加制作负担而且最终输出的文件量也很大，但它的优势也很明显：因为它相似与电影播放模式，很适合于表演很细腻的动画，如3D效果、人物或动物急剧转身等等效果。,28,步骤： 新建flash文件； 导入第一张图片； 在第2帧、第3帧、第4帧、第5帧等插入空白关键帧（【F7】键），分别导入图片； 【控制】菜单中选择测试影片命令（CTRL+Enter）来预览动画效果； 保存。,类似案例：机器人走路、行走的马,29,（学生操作-太阳落山）步骤：新建flash文件； 利用铅笔工具绘制出小山，颜料桶工具填充成绿色；用椭圆工具绘制出太阳，笔触色为无色，填充色为红色； 在第2帧插入关键帧（按【F6】键），选择太阳，移动太阳的位置； 使用同样的方法。分别编辑第3帧、第4帧、第5帧等 ； 【控制】菜单中选择测试影片命令（CTRL+Enter）来预览动画效果； 保存。,课后完成,30,补间动画是在flash动画中应用最多的一种动画模式，只需要绘制出关键帧，就能自动生成中间的补间过程。 1.形状补间动画 常用于表现图形对象形状之间的自然过渡。形状补间动画的第1帧和最后一帧中的图形可以不具备任何关联关系，其动画的变形过程也不需要制作者进行控制。,（二）补间动画,案例三：由椭圆变五角星,案例四：文字间的转换,31,案例3：由椭圆变五角星（形状和颜色都转换） 步骤： 新建flash文件，背景颜色为“黄色”； 用椭圆工具绘制出椭圆，笔触颜色为无色，填充色为“绿色”； 在第40帧插入空白关键帧，用多角星形工具绘制出五角星，笔触颜色为无色，填充色为“红色” ； 选择图层1中的所有帧（单击图层1即可），在【属性】面板中的【补间】下拉列表中选择【形状】选项； 动画制作完毕，按CTRL+Enter预览动画效果； 保存。,32,案例4：文字间的转换 步骤： 新建flash文件，改变文档的背景颜色； 单击工具箱中的【文本工具】按钮，在【属性】面板中设置：文本类型为“静态文本”，文本颜色为“黑色”，字体为“黑体”，字体大小为96； 使用【文本工具】在舞台中输入文字“欢”，按【F7】键分别在时间轴的第10、20、30帧插入空白关键帧； 使用【文本工具】，分别在第10帧的舞台中输入文字“迎”，在第20帧的舞台中输入文字“光”，在第30帧的舞台中输入文字“临”； 依次选择每个关键帧中的文本，按【Ctrl+B】把文本分离成可编辑的网格状；（也就是把文本变成图形）； 依次选择每个关键帧中的字，在工具箱中的【填充颜色】调色板中设置不同的渐变色； 选择图层1中的所有帧（单击图层1即可），在【属性】面板中的【补间】下拉列表中选择【形状】选项； 动画制作完毕，按CTRL+Enter预览动画效果；,类似案例：文字和图形一起变化,33,2.运动补间动画 常用于表现同一图形对象的移动、放大、缩小以及旋转等变化。 运动补间动画的最后一帧中的图形状态与第1帧中的图形密切相关，即通过对最初图形的属性进行编辑来产生动画效果。 运动的对象必须是元件，一般给元件的实例添加运动补间的动画效果 。,（二）补间动画,案例五：文字缩放,案例六：图片的旋转,案例七：多图层照片,34,案例5：文字缩放 步骤： 新建flash文件，改变文档的背景颜色为“黑色”； 单击工具箱中的【文本工具】按钮，在【属性】面板中设置文本属性：字体大小为40，文本颜色为“白色”； 在舞台中输入www.yahoo.com； 单击工具箱中的【选择工具】按钮，选中舞台中的文本； 选择【修改】菜单中的【转换为元件】菜单项（作用是把舞台中的文本转换为元件）； 选择【窗口】菜单中的【对齐】菜单项，打开flash的【对齐】面板，把转换好的元件对齐到舞台的一定位置；单击【相对于舞台】按钮，选择对齐中的 一种对齐方式； 在【时间轴】面板的第20帧处按【F6】键插入关键帧； 选中第20帧所对应的舞台中的元件，选择【窗口】菜单中的【变形】菜单项，把图形元件的高度缩小，宽度不变； 在图层1的两个关键帧之间单击鼠标右键，在弹出的快捷菜单中选择【创建补间动画】选项； 按CTRL+Enter预览动画效果；,35,学生操作题：图片的由大变小 步骤： 新建flash文件，导入1张图片； 单击工具箱中的【选择工具】按钮，选中舞台中的图片； 选择【修改】菜单中的【转换为元件】菜单项（作用是把舞台中的文本转换为元件）； 在【时间轴】面板的第20帧处按【F6】键插入关键帧； 选中第20帧所对应的舞台中的元件，单击工具箱中的【任意变形工具】对图片进行缩放； 在图层1的两个关键帧之间单击鼠标右键，在弹出的快捷菜单中选择【创建补间动画】选项； 按CTRL+Enter预览动画效果。,36,学生操作题：跳动的心 用运动补间动画来实现,37,案例6：图片的旋转 步骤： 新建flash文件，导入1张图片； 单击工具箱中的【选择工具】按钮，选中舞台中的图片； 选择【修改】菜单中的【转换为元件】菜单项（作用是把舞台中的文本转换为元件）； 在【时间轴】面板的第20帧、第40帧处按【F6】键插入关键帧； 选中第20帧所对应的舞台中的元件，单击工具箱中的【任意变形工具】对图片进行旋转； 选中第40帧所对应的舞台中的元件，单击工具箱中的【任意变形工具】对图片进行旋转； 创建补间动画； 按CTRL+Enter预览动画效果。,BACK,38,元件和实例,任何一个元件都可以在舞台或其它元件里多次调用，每次调用就相当于创建了一个该元件的实例。由于一个元件可以创建多个实例，每个实例可以有不同的属性，效果如图所示。这样就可以大幅减小动画的体积，便于网络中浏览和传播。,39,元件和实例,flash元件有三种 ： 影片剪辑可以独立于主时间轴播放的动画剪辑，可以加入动作代码。 图形依赖主时间轴播放的动画剪辑，不可以加入动作代码。 按钮有“常规”、“弹起”、“按下”和“点击”四帧的特殊影片剪辑，可以加入动作代码。,40,元件介绍结束,41,实验九：Flash形变动画制作,Flash基本图形绘制邮票的制作 逐帧动画跳街舞的小人 形状补间动画由椭圆变五角星、文字间的转换 运动补间动画文字缩放、多图层照片、跳动的心,