逐帧动画
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
绘制全部按钮 。3、点击骏马图层使帧全部选中，调整 大小和位置
图4-17 导入“骏马”元件
3、制作文字逐帧动画 。 （1）在“骏马”图层上面新建一个图层并重命名为“文字效果”，
选中“文字效果”图层的第2帧，然后按F6快捷键插入一个关键 帧。
（2）选择【文本】工具，在【属性】面板中设置【字体】为“隶书 ”，【字体颜色】为“#FFFFFF”，【字体大小】为“80”，然后 在舞台上输入“一”字，并移动文字到舞台的上边，如图4-18所 示。
பைடு நூலகம்
图4-8 插入关键帧
图4-9 插入空白关键帧
5、按Ctrl+Alt+A快捷键选中所有帧，如图4-10所示。 6、按Ctrl+Alt+C快捷键复制所有帧，然后选中第10帧，按下 Ctrl+Alt+V快捷键粘贴帧，此时，【时间轴】面板如图4-11所示， 然后拖动时间轴控制柄观察舞台的效果 。
图4-10 选中所有帧
图4-13 导入背景后的舞台效果
2、制作骏马奔跑动画 。 （1）在“背景”图层之上新建一个图层并重命名为“骏马”层， 然后选中“背景”图层和“骏马”的第5帧，按下F5快捷键插入帧 ，此时的【时间轴】状态如图4-14所示 。
图4-14 【时间轴】状态一
（2）选中骏马图层的第一帧，执行【文件】/【导入】/【导入到
逐帧动画
帧的概念
• Flash把动画分解成帧，在舞台中直接绘制的 图形，或导入的图像，均可形成单独的帧， 再把各个单独的帧图像画面连在一起，合成 动画。
• 帧代表着时刻，不同的帧即不同的时刻，画 面随着时间的推移逐个出现，就成了动画。
帧的概念
• 制作动画有两种方式：一种是逐帧动画，另一种是 渐变动画。 –在逐帧动画中，需要在每一帧上创建一个不同的 画面，连续的帧组合成连续变化的画面。 –渐变动画只需确定动画起点帧和终点帧的画面， 中间部分的渐变动画由系统自动生成。
4.1 逐帧动画原理
逐帧动画的原理比较简单，但是要 制作出优秀的逐帧动画对制作者的动 画技能要求较高。本节从逐帧原理入 手再配合一个较简单的逐帧动画来向 同学们讲述如何制作逐帧动画 .
三、逐帧动画的原理。 逐帧动画的原理是逐一创建出每一帧上的动画内容，然后顺序
播放各动画帧上的内容，从而实现连续的动画效果，如图4-5所示。
图4-6 输入文字
图4-7 插入帧
3、选中默认“图层1”的第5帧，按键盘上的F6快捷键插入关键帧 ，如图4-8所示，在第5帧处改变文字的颜色为“蓝色”，然后 拖动时间轴控制柄观察第5帧前和第5帧后文字的变换。
4、按F7快捷键，分别在第3帧和第8帧处插入空白关键帧，如图49所示，然后拖动时间轴控制柄观察舞台的变化。
图4-11 粘贴帧
请根据【知识点讲解】栏目讲解的帧知识和此处进行的操 作和观察，思考帧、关键帧、空白关键帧的意义和用法 。
4.2.1 范例解析（一）──对操作帧的练习
本例使用从外部导入静态图片和使用文字的方式来制作逐帧动 画，从而制作“一马平川”的动画效果，其制作思路及结果如图4-12 所示 。
图4-12 制作思路及效果
帧的概念
• 帧的编辑 – 可通过在某一帧单元格上点右键，选择相应的 命令，对帧进行编辑。 1. 添加帧（F5）：添加一个普通帧。可保持前面 帧的内容。 2. 删除帧（SHIFT+F5）：删除当前帧。如果要删 除多帧，则先选中这些帧，在弹出的快捷菜单 中选“删除帧”命令即可。
帧的概念
3. 复制帧：复制帧可以将帧所对应画板上的对象全 部复制，再使用粘贴帧命令就可把帧所对应的对 象全部粘贴到新的帧所对应的画板上。复制帧的 操作方法如下： • 复制一帧：右击选择要复制的帧，在弹出的 快捷菜单中选“复制帧”命令即可。 • 复制多帧：利用SHIFT键，先选中要复制的多 个帧后，在任一帧上点右键，在弹出的快捷 菜单中选“复制帧”命令即可。
帧的概念
• 有关帧的概念 – 帧是时间轴上一个个小方格，想看哪一帧的内 容，只要点一下相应的小方格即可。 1. 帧的播放速度 • 帧的播放速度就是动画中每移的帧数，默认 值为12。在网页动画中，12帧就很好了。电 影动画则要求更快，如30帧。 • 修改帧速度有两种方法，一种是修改电影属 性，另一种是双击时间轴下面的帧速度框。
舞台】菜单命令，将教学资源中的“27\foal1.png”的图像文件导
入到舞台中，此时会弹出提示对话框，询问是否导入序列图片的
对话框，如图4-15所示 。
（3）选择
按钮，将序列图片全部导入到时间轴上，时间
轴效果如图4-16所示
图4-15 导入序列图片
图4-16 【时间轴】效果
（4）调整骏马的大小和位置 方法：1、选中骏马图层第一帧，点击编辑多个帧按钮 2、点击
1、制作背景。 （1）新建一个Flash文档，设置文档【尺寸】为“550px×250px” ，【帧频】为“6fps”，其他属性使用默认参数 。 （2）将默认的“图层1”重命名为“背景”层，执行【文件】/【导 入】/【导入到舞台】菜单命令，将教学资源 背景JPG”的图像文件 导入到舞台中，并相对舞台居中对齐，如图4-13所示 。
请同学们在老师的带领下对帧的操作进行进一步的熟悉，并 跟随以下要求进行操作训练。
1、新建一个Flash文档，然后在舞台上输入“Flash帧操作”几个字 ，并设置文字颜色为“暗红色”,如图4-6所示。
2、选中默认“图层1”的第10帧，按键盘上的F5快捷键插入帧，如图 4-7所示。然后拖动时间轴控制柄观看舞台上文字的变化
”
”
”
”
（5）保存测试影片，一马平川的动画效果制作完成 。
4.1.4 课堂练习──制作“旗帜飘扬”
请同学们使用绘图工具，在不同的帧上绘制红旗在空中不同的 状态，从而制作如图4-22所示的动态效果。
第1帧
第2帧
第3帧
图4-22 动态红旗效果
第4帧
第5帧
1、新建一个Flash文档，设置文档【尺寸】为“250px×350px”， 【帧频】为“5”，其他属性使用默认参数 。
图4-5 逐帧动画原理
创建逐帧动画的典型方法主要有以下3种。 从外部导入素材生成逐帧动画，如导入静态的图片、序列图像 和GIF动态图片等。 使用数字或者文字制作逐帧动画，如实现文字跳跃或旋转等特 效动画。 绘制矢量逐帧动画，利用各种制作工具在场景中绘制连续变化 的矢量图形，从而形成逐帧动画
4.2.1 范例解析（一）──对操作帧的练习
帧的概念
2. 关键帧（F6键） ：
• 关键帧用实心圆点标记，表示其中含有组件或图形， 是具有关键内容的帧。
• 如果在某一关键帧的后面某帧再按F6键，则前面的 内容得以保留，此时可修改两个关键帧中某一个上面 的内容，如移动位置，改变大小，加工等，由此便可 设置动画。
• 关键帧的数目越多，文件容量就越大。
帧的概念
• 帧的选取 1. 选取一个帧：单击该帧即可。 2. 选取连续多帧：先单击起点帧，然后将鼠标移 到终点帧，按SHIFT键后，再单击。 3. 选取某图层中的所有帧：可单击时间轴上的图 层名称。 4. 选取一个关键帧段的内容：单击该段中间的任 一帧即可。 – 选取一帧或多帧后，这些帧呈现黑色。且这些 帧所对应的画板上的内容全部被选中。
帧的概念
5. 帧的移动：有时要将某帧或多个帧移动到新的 位置，需要移动帧。
• 移动一帧：单击该帧，按下左键不松，将其 拖到需要的地方。删除尾部空白帧时，可用 这种方法。
• 移动多帧：选取一帧或多帧，用鼠标直接将 其拖到需要的地方。
• 移动某图层所有帧：先选中该图层的所有帧 ，将鼠标移到中间任一帧上，此时鼠标成手 状，按下左键不松，将起始帧横向拖动到目 的帧。
帧的概念
3. 空白关键帧（F7键）：
• 无内容的关键帧称为空关键帧，由一个大的
空心小圆圈
表示矩形框表示。它不
含任何一种组件或图形。
• 在一个空关键帧上面创建内容后，该空关键 帧便成为有内容的实关键帧。
• 在某帧插入关键帧后，如果删除此关键帧上 所有内容，也形成空白关键帧。
帧的概念
• 每一层的第1帧默认为一个空关键帧，故在第 一帧上添加内容不用插入关键帧。
•
单独的关键帧为一黑色圆点，后面
为灰色表明其后各帧的内容与其一致，没有变化。
帧的概念
• 关键帧的创建方法 1. 选取某一帧，选择“插入→关键帧”命令 ； 2. 选中某一个单元格，按F6键； 3. 在某帧单元格的位置上右击，选“插入关 键帧”命令。 – 除第1帧外，其它任一帧，均要先选取该帧 ，再插入关键帧后，才能添加内容。 – 拖动关键帧，可改变关键帧的位置。
• 插入空白的关键帧单元格的方法有3种。 1) 选中某一个单元格，再按F7键。 2) 选中某一个单元格，单击“插入→空白关 键帧”菜单命令。 3) 将鼠标指针移到要插入关键帧的单元格处 ，击右键，选“插入→空白关键帧”菜单 命令。
帧的概念
4. 普通帧（F5键） • 关键帧后面的普通帧将继承关键帧的内容。 例如：动画背景的制作，就是将一个含有背 景图案的关键帧的内容沿用到后面的帧上。 • 普通帧的主要作用，就是使其前面关键帧的 内容静止不动，将关键帧的内容沿用到新帧 上。
（3）选中“文字效果”图层的第3帧，按F6快捷键插入一个关键帧，
在该帧输入一个“马”字，并移动“马”字的位置到“一”字右 侧，效果如图4-19所示 。 （4）使用相同的方法，分别在第4帧和第5帧输入“平”、“川”字 ，如图4-20和图4-21所示。
图4-18 第2帧添加“一 图4-19 第3帧添加“马 图4-20 第4帧添加“平 图4-21 第5帧添加“川
图4-17 导入“骏马”元件
3、制作文字逐帧动画 。 （1）在“骏马”图层上面新建一个图层并重命名为“文字效果”，
选中“文字效果”图层的第2帧，然后按F6快捷键插入一个关键 帧。
（2）选择【文本】工具，在【属性】面板中设置【字体】为“隶书 ”，【字体颜色】为“#FFFFFF”，【字体大小】为“80”，然后 在舞台上输入“一”字，并移动文字到舞台的上边，如图4-18所 示。
பைடு நூலகம்
图4-8 插入关键帧
图4-9 插入空白关键帧
5、按Ctrl+Alt+A快捷键选中所有帧，如图4-10所示。 6、按Ctrl+Alt+C快捷键复制所有帧，然后选中第10帧，按下 Ctrl+Alt+V快捷键粘贴帧，此时，【时间轴】面板如图4-11所示， 然后拖动时间轴控制柄观察舞台的效果 。
图4-10 选中所有帧
图4-13 导入背景后的舞台效果
2、制作骏马奔跑动画 。 （1）在“背景”图层之上新建一个图层并重命名为“骏马”层， 然后选中“背景”图层和“骏马”的第5帧，按下F5快捷键插入帧 ，此时的【时间轴】状态如图4-14所示 。
图4-14 【时间轴】状态一
（2）选中骏马图层的第一帧，执行【文件】/【导入】/【导入到
逐帧动画
帧的概念
• Flash把动画分解成帧，在舞台中直接绘制的 图形，或导入的图像，均可形成单独的帧， 再把各个单独的帧图像画面连在一起，合成 动画。
• 帧代表着时刻，不同的帧即不同的时刻，画 面随着时间的推移逐个出现，就成了动画。
帧的概念
• 制作动画有两种方式：一种是逐帧动画，另一种是 渐变动画。 –在逐帧动画中，需要在每一帧上创建一个不同的 画面，连续的帧组合成连续变化的画面。 –渐变动画只需确定动画起点帧和终点帧的画面， 中间部分的渐变动画由系统自动生成。
4.1 逐帧动画原理
逐帧动画的原理比较简单，但是要 制作出优秀的逐帧动画对制作者的动 画技能要求较高。本节从逐帧原理入 手再配合一个较简单的逐帧动画来向 同学们讲述如何制作逐帧动画 .
三、逐帧动画的原理。 逐帧动画的原理是逐一创建出每一帧上的动画内容，然后顺序
播放各动画帧上的内容，从而实现连续的动画效果，如图4-5所示。
图4-6 输入文字
图4-7 插入帧
3、选中默认“图层1”的第5帧，按键盘上的F6快捷键插入关键帧 ，如图4-8所示，在第5帧处改变文字的颜色为“蓝色”，然后 拖动时间轴控制柄观察第5帧前和第5帧后文字的变换。
4、按F7快捷键，分别在第3帧和第8帧处插入空白关键帧，如图49所示，然后拖动时间轴控制柄观察舞台的变化。
图4-11 粘贴帧
请根据【知识点讲解】栏目讲解的帧知识和此处进行的操 作和观察，思考帧、关键帧、空白关键帧的意义和用法 。
4.2.1 范例解析（一）──对操作帧的练习
本例使用从外部导入静态图片和使用文字的方式来制作逐帧动 画，从而制作“一马平川”的动画效果，其制作思路及结果如图4-12 所示 。
图4-12 制作思路及效果
帧的概念
• 帧的编辑 – 可通过在某一帧单元格上点右键，选择相应的 命令，对帧进行编辑。 1. 添加帧（F5）：添加一个普通帧。可保持前面 帧的内容。 2. 删除帧（SHIFT+F5）：删除当前帧。如果要删 除多帧，则先选中这些帧，在弹出的快捷菜单 中选“删除帧”命令即可。
帧的概念
3. 复制帧：复制帧可以将帧所对应画板上的对象全 部复制，再使用粘贴帧命令就可把帧所对应的对 象全部粘贴到新的帧所对应的画板上。复制帧的 操作方法如下： • 复制一帧：右击选择要复制的帧，在弹出的 快捷菜单中选“复制帧”命令即可。 • 复制多帧：利用SHIFT键，先选中要复制的多 个帧后，在任一帧上点右键，在弹出的快捷 菜单中选“复制帧”命令即可。
帧的概念
• 有关帧的概念 – 帧是时间轴上一个个小方格，想看哪一帧的内 容，只要点一下相应的小方格即可。 1. 帧的播放速度 • 帧的播放速度就是动画中每移的帧数，默认 值为12。在网页动画中，12帧就很好了。电 影动画则要求更快，如30帧。 • 修改帧速度有两种方法，一种是修改电影属 性，另一种是双击时间轴下面的帧速度框。
舞台】菜单命令，将教学资源中的“27\foal1.png”的图像文件导
入到舞台中，此时会弹出提示对话框，询问是否导入序列图片的
对话框，如图4-15所示 。
（3）选择
按钮，将序列图片全部导入到时间轴上，时间
轴效果如图4-16所示
图4-15 导入序列图片
图4-16 【时间轴】效果
（4）调整骏马的大小和位置 方法：1、选中骏马图层第一帧，点击编辑多个帧按钮 2、点击
1、制作背景。 （1）新建一个Flash文档，设置文档【尺寸】为“550px×250px” ，【帧频】为“6fps”，其他属性使用默认参数 。 （2）将默认的“图层1”重命名为“背景”层，执行【文件】/【导 入】/【导入到舞台】菜单命令，将教学资源 背景JPG”的图像文件 导入到舞台中，并相对舞台居中对齐，如图4-13所示 。
请同学们在老师的带领下对帧的操作进行进一步的熟悉，并 跟随以下要求进行操作训练。
1、新建一个Flash文档，然后在舞台上输入“Flash帧操作”几个字 ，并设置文字颜色为“暗红色”,如图4-6所示。
2、选中默认“图层1”的第10帧，按键盘上的F5快捷键插入帧，如图 4-7所示。然后拖动时间轴控制柄观看舞台上文字的变化
”
”
”
”
（5）保存测试影片，一马平川的动画效果制作完成 。
4.1.4 课堂练习──制作“旗帜飘扬”
请同学们使用绘图工具，在不同的帧上绘制红旗在空中不同的 状态，从而制作如图4-22所示的动态效果。
第1帧
第2帧
第3帧
图4-22 动态红旗效果
第4帧
第5帧
1、新建一个Flash文档，设置文档【尺寸】为“250px×350px”， 【帧频】为“5”，其他属性使用默认参数 。
图4-5 逐帧动画原理
创建逐帧动画的典型方法主要有以下3种。 从外部导入素材生成逐帧动画，如导入静态的图片、序列图像 和GIF动态图片等。 使用数字或者文字制作逐帧动画，如实现文字跳跃或旋转等特 效动画。 绘制矢量逐帧动画，利用各种制作工具在场景中绘制连续变化 的矢量图形，从而形成逐帧动画
4.2.1 范例解析（一）──对操作帧的练习
帧的概念
2. 关键帧（F6键） ：
• 关键帧用实心圆点标记，表示其中含有组件或图形， 是具有关键内容的帧。
• 如果在某一关键帧的后面某帧再按F6键，则前面的 内容得以保留，此时可修改两个关键帧中某一个上面 的内容，如移动位置，改变大小，加工等，由此便可 设置动画。
• 关键帧的数目越多，文件容量就越大。
帧的概念
• 帧的选取 1. 选取一个帧：单击该帧即可。 2. 选取连续多帧：先单击起点帧，然后将鼠标移 到终点帧，按SHIFT键后，再单击。 3. 选取某图层中的所有帧：可单击时间轴上的图 层名称。 4. 选取一个关键帧段的内容：单击该段中间的任 一帧即可。 – 选取一帧或多帧后，这些帧呈现黑色。且这些 帧所对应的画板上的内容全部被选中。
帧的概念
5. 帧的移动：有时要将某帧或多个帧移动到新的 位置，需要移动帧。
• 移动一帧：单击该帧，按下左键不松，将其 拖到需要的地方。删除尾部空白帧时，可用 这种方法。
• 移动多帧：选取一帧或多帧，用鼠标直接将 其拖到需要的地方。
• 移动某图层所有帧：先选中该图层的所有帧 ，将鼠标移到中间任一帧上，此时鼠标成手 状，按下左键不松，将起始帧横向拖动到目 的帧。
帧的概念
3. 空白关键帧（F7键）：
• 无内容的关键帧称为空关键帧，由一个大的
空心小圆圈
表示矩形框表示。它不
含任何一种组件或图形。
• 在一个空关键帧上面创建内容后，该空关键 帧便成为有内容的实关键帧。
• 在某帧插入关键帧后，如果删除此关键帧上 所有内容，也形成空白关键帧。
帧的概念
• 每一层的第1帧默认为一个空关键帧，故在第 一帧上添加内容不用插入关键帧。
•
单独的关键帧为一黑色圆点，后面
为灰色表明其后各帧的内容与其一致，没有变化。
帧的概念
• 关键帧的创建方法 1. 选取某一帧，选择“插入→关键帧”命令 ； 2. 选中某一个单元格，按F6键； 3. 在某帧单元格的位置上右击，选“插入关 键帧”命令。 – 除第1帧外，其它任一帧，均要先选取该帧 ，再插入关键帧后，才能添加内容。 – 拖动关键帧，可改变关键帧的位置。
• 插入空白的关键帧单元格的方法有3种。 1) 选中某一个单元格，再按F7键。 2) 选中某一个单元格，单击“插入→空白关 键帧”菜单命令。 3) 将鼠标指针移到要插入关键帧的单元格处 ，击右键，选“插入→空白关键帧”菜单 命令。
帧的概念
4. 普通帧（F5键） • 关键帧后面的普通帧将继承关键帧的内容。 例如：动画背景的制作，就是将一个含有背 景图案的关键帧的内容沿用到后面的帧上。 • 普通帧的主要作用，就是使其前面关键帧的 内容静止不动，将关键帧的内容沿用到新帧 上。
（3）选中“文字效果”图层的第3帧，按F6快捷键插入一个关键帧，
在该帧输入一个“马”字，并移动“马”字的位置到“一”字右 侧，效果如图4-19所示 。 （4）使用相同的方法，分别在第4帧和第5帧输入“平”、“川”字 ，如图4-20和图4-21所示。
图4-18 第2帧添加“一 图4-19 第3帧添加“马 图4-20 第4帧添加“平 图4-21 第5帧添加“川