2022年2022年骨骼动画知识点-flash .pdf

骨骼动画：一、基本概念1、Deco 工具：将创建的图形形状转变为复杂的几何图案，还可以将库中创建的影片剪辑或图形元件填充到应用的图形中，制造出类似万花筒的效果。绘制效果分藤蔓式填充、网格填充、对称刷子。对称刷子： 可以绘制对称的图形或填充类似万花筒的效果。“对称刷子 ”默认的元件是25像素 25 像素、无笔触的黑色矩形形状。(1) 模块：用于设置“对称刷子 ”填充效果的图形，如果在库中有制作好的元件，可以将制作好的元件作为填充的图形。 (2) 高级选项：用于设置填充图形的填充模式，包括4 个选项，分别是跨线反射、跨点反射、绕点旋转和网格平移。藤蔓式填充： (1) 叶：用于设置“藤蔓式填充 ”的叶子图形，如果在库中有制作好的元件，可以将制作好的元件作为叶子的图形。 (2) 花：用于设置“藤蔓式填充 ”的花的图形，如果在库中有制作好的元件，可以将制作好的元件作为花的图形。 (3) 分支角度：用于设置“藤蔓式填充 ”的枝条分支的角度值。 (4) 图案缩放：用于设置“藤蔓式填充 ”的缩放比例大小。 (5) 段长度：用于设置“藤蔓式填充 ”的每根枝条的长度。 (6) 动画图案：此选项将创建绘制图案的逐帧动画序列。 (7) 帧步骤：指定绘制效果时每秒要横跨的帧数。网格填充： (1) 填充：用于设置“网格填充 ”的网格图形，如果在库中有制作好的元件，可以将制作好的元件作为网格的图形。(2) 水平间距：用于设置“网格填充 ” 各个图形间的水平间距。 (3) 垂直间距：用于设置“网格填充 ”各个图形间的垂直间距。 (4) 图案缩放：用于设置“网格填充 ”图形的大小比例。2、骨骼动画：也叫反向运动，元件实例和形状对象可以按复杂而自然地方式移动，更加轻松地创建人物动画。且必须在新建文件时建立：Flash 文件（ ActionScript3.0）二、基本操作1、对骨骼对象的基本操作(1) 移动骨骼对象。为对象添加骨骼后，使用选择工具移动骨骼对象，只能对父级骨骼进行环绕的运动。如果需要移动骨骼对象，可以使用任意变形工具选择需要移动的对象，然后拖动对象，则骨骼对象的位置发生改变，连接的骨骼长短也随着对象的移动发生变化。 (2) 重新定位骨骼。为对象添加骨骼后，选择并移动对象上的骨骼，只能对骨骼进行旋转运动，不能改变骨骼的位置。如果需要对对象上的骨骼进行重新定位，则首先需要使用任意变形工具选择需要重新定位的骨骼对象，然后移动选择对象的中心点。 (3) 删除骨骼。删除骨骼的操作非常简单，只需用选择工具选中需要删除的骨骼，然后按 Delete 键即可删除。三、任务1、Deco 工具的使用 房子装饰第一步：导入素材，制作“花”图形元件1）创建 flash 文档：文件 打开 任务七 .fla。2）执行 “插入 新建元件 ”命令，名称为“花” ，类型为 “图形 ” ，单击 “确定 ”按钮。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 1 页，共 19 页 - - - - - - - - - 3）在 “工具 ”面板中选择Deco 工具。在窗口右侧属性面板中选择“绘制效果 ”为“对称刷子 ” ，舞台上会出现坐标轴形状的手柄。单击“编辑 ”按钮，设置模块为“花瓣 ”(就是用元件 “花瓣 ”替代默认的形状)，在高级选项中选择“绕点旋转 ” ，取消 “测试冲突 ”的选择。4）在舞台上靠近手柄原点的位置单击鼠标，即可绘制一朵小花第二步：装饰房子周围1）返回 “场景 ” ，单击 “背景”层的第 1 帧，在 “工具”面板中选择Deco 工具。在窗口右侧 “属性”面板中选择 “绘制效果 ”为“藤蔓式填充 ” 。单击 “编辑 ” 按钮，用元件“草”替代默认的叶的形状，用元件“花”替代默认的花的形状。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 2 页，共 19 页 - - - - - - - - - 2）在舞台的空白处单击鼠标左键，房子周围的环境便会被叶和花填充。第三步：装饰房子墙壁1）单击 “墙”图层，在 “工具”面板中选择Deco 工具。在窗口右侧“属性 ”面板中选择名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 3 页，共 19 页 - - - - - - - - - “绘制效果 ”为“网格填充 ” 。单击 “编辑 ”按钮，用元件 “墙砖”替代默认的形状，将水平间距和垂直间距都设置为0.10 像素。2）在房子的墙壁处单击鼠标，墙壁便会出现墙砖的图案。3）用选择工具选中墙壁上墙砖的图案，再用任意变形工具稍做调整，一幅漂亮的房子图案就完成了。2、心随所动第一步：导入素材名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 4 页，共 19 页 - - - - - - - - - 1)创建 flash 文档：文件 新建 选择 flash 文件 (ActionScript3.0)，舞台大小为600*600 （像素），背景为黑色。2)执行 “文件 导入导入到库 选择背景、丝带、箭三个图片打开 ”命令，导入三张图片。3)选择库中的 “背景”拖入到舞台中，设置背景图片右边属性面板大小600*600 。4)选择第 100 帧，按 F5 插入帧。锁定图层1。第二步：制作 “箭”影片剪辑元件1）执行 “插入 新建元件 ”命令，名称为“箭” ，类型为 “影片剪辑 ” ，单击 “确定”按钮。2）将库中的 “箭”图形元件拖入到舞台，水平垂直对齐。然后把图形打撒（Ctrl+b ） ，使用套索工具中的魔术棒把白色背景删除。3）在图层1 上右击 插入图层2，将库中的 “丝带 ”拖入到舞台。水平垂直对齐。锁定图层 2。4）在图层2 上右击 插入图层35）选择图层1 中箭图形，按Ctrl+C6）选择图层3，按 Ctrl+Shfit+V原位粘贴。7）锁定隐藏图层1，选择图层3，把需要让丝巾露外面的部分用橡皮擦擦除即可。第三步：制作 “心”影片剪辑元件1） 执行 “插入新建元件 ”命令，名称为 “心” ，类型 “影片剪辑 ” ，单击 “确定”按钮。2）利用椭圆工具和选择工具绘制“心”名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 5 页，共 19 页 - - - - - - - - - 第四步：制作骨骼动画1）单击 “场景 1”按钮，回到场景中，新建图层2。2）把 “箭”和“心”影片剪辑元件拖入舞台，并水平居中，垂直在一条线上。3）选择骨骼工具，将光标放在箭的下方单击并拖动到心部，如下图所示，这就定义了骨骼。同时Flash CS4 自动创建了 “骨架_* ”图层。4）选择骨骼线，此时变为绿色，把右边属性面板中“旋转 约束”设为最小 -30，最大30。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 6 页，共 19 页 - - - - - - - - - 5）选择地25 帧，再使用任意变形工具选择箭和心，向左旋转一定角度。6）选择地50 帧，再使用任意变形工具选择箭和心，向右旋转致垂直。7）选择地75 帧，再使用任意变形工具选择箭和心，向右旋转一定角度。8）选择地100 帧，再使用任意变形工具选择箭和心，向左旋转致垂直。第四步：测试影片先保存为 ” 心随我动 .fla ”，再 Ctrl+Enter 预览效果3、拳击运动第一步：导入素材，制作骨骼动画1）创建 flash 文档：文件 打开 任务八 .fla。2）在 “工具 ”面板中选择骨骼工具，这时鼠标呈骨头形状，将光标放到拳击手肩膀处单击并拖动到肘部，这样就定义了一个骨骼；再将光标放到拳击手肘部单击并拖动到手腕处，这样就定义了第二根骨骼。同时Flash CS4 自动创建一个 “骨架 _1”的图层，“大臂 ”与“小臂 ”图层中的对象被自动剪切到“骨架 _1”图层中名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 7 页，共 19 页 - - - - - - - - - 3）此时单击选择工具，然后拖动拳击手的大臂，则小臂会随着大臂一起移动。4）用选择工具拖动拳击手的小臂，则手套会随着小臂进行移动；如果拖动拳击手的手套，则小臂会随着手套进行旋转移动。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 8 页，共 19 页 - - - - - - - - - 5）插入姿势姿势就是骨架图层的关键帧。只要向骨架图层添加帧并在舞台上重新定位骨架，即可创建关键帧。每个骨架图层都自动充当补间图层。在时间轴上选中所有图层的第45 帧，然后单击右键，选择“插入帧 ”命令，6）将红色播放头依次移到时间轴的第1 帧、第 15 帧、第 30 帧和第 45 帧，使用选择工具在以上每一帧处调整拳击手的小臂位置，如图所示。第二步：测试影片先保存为 ” 拳击运动 .fla ”，再 Ctrl+Enter 预览效果名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 9 页，共 19 页 - - - - - - - - - 3、大象鼻子运动第一步：导入素材，制作骨骼动画1）创建 flash 文档：文件 打开 任务九 .fla。把 “鼻子 ”图层解锁。2）在 “工具 ”面板中选择骨骼工具，将光标从大象鼻子的根部向下拖动，这样就定义了第一个骨骼，同时自动创建一个“骨架 _1”图层，并把鼻子图层的内容自动剪切到“骨架_1”图层中。如图所示。3）单击第一个骨骼的末尾，并朝着鼻子的末尾再向下拖出第二个骨骼，这样就定义了第二个骨骼。如图所示。4）继续定义骨骼，总共应包括五个骨骼。如图所示。5）在时间轴上选中所有图层的第45 帧，然后单击右键，选择“插入帧 ”命令，设置动画的播放时间为45 帧。6）将红色播放头移到时间轴的第15 帧，使用选择工具拖动大象鼻子的第二个关节至图所示位置。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 10 页，共 19 页 - - - - - - - - - 7）将红色播放头移到时间轴的第30 帧，使用选择工具拖动大象鼻子的最后一个关节至图所示位置。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 11 页，共 19 页 - - - - - - - - - 8）将红色播放头移到时间轴的第45 帧，使用选择工具拖动大象鼻子的第二个关节和最后一个关节至图所示位置。第二步：测试影片先保存为 ” 大象鼻子运动.fla ”，再 Ctrl+Enter 预览效果4、海蛇漫舞第一步：导入素材1） 创建 flash 文档：文件 新建 选择 flash 文件(ActionScript3.0)，舞台大小为300*900 （像素）。2） 使用矩形工具绘制一矩形，大小为300*900 ，填充颜色为 #0666C6 到#78B7F5 线性渐变。水平垂直居中。选择第80 帧，锁定图层1。第二步：制作 “气泡 ”影片剪辑元件1）执行 “插入 新建元件 ”命令，名称为“泡” ，类型为 “图形 ” ，单击 “确定 ”按钮。2）使用椭圆工具和选择工具绘制泡泡，如下图所示。3）执行 “插入 新建元件 ”命令，名称为“气泡” ，类型为 “影片剪辑 ” ，单击 “确定”按钮。4）把 “泡”图形元件从库中拖入舞台中。5）在图层1 上右击 添加传统运动引导层，利用铅笔工具绘制泡泡运动的轨迹。6）选择图层1，将 “泡”图形元件拖到引导线的下端起点处（利用贴紧至对象工具让对象吸附到引导线上） ，选择第 50 帧，右击 插入关键帧，将“泡”图形元件拖到引导线的上端终点处，并设置属性面板中色彩效果里的Alpha 值为 0，选择第1 到 50 帧之间任意一帧，右击 创建传统补间。选择“控制”菜单“ 播放”命令，测试泡是否沿着轨迹运动，如果不沿着轨迹运动，则调整起点终点星光元件是否附着在引导线上。第三步：制作 “蛇头 ”影片剪辑元件1） 执行 “插入新建元件 ”命令，名称为 “蛇头 ” ，类型 “影片剪辑 ” ，单击 “确定 ”按钮。2）利用椭圆工具和选择工具绘制“蛇头” ，并填充颜色。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 12 页，共 19 页 - - - - - - - - - 第四步：制作 “蛇身 ”影片剪辑元件1)执行 “插入新建元件 ”命令，名称为 “蛇身 ” ，类型 “影片剪辑 ” ，单击 “确定 ”按钮。2）利用矩形工具绘制“蛇身 ” ，并填充颜色。第五步：制作骨骼动画1）单击 “场景 1”按钮，回到场景中，新建图层2、3、4、5、6、7、8。7 个图层分别取名“气泡 1” 、 “气泡 2” 、 “气泡 3” 、 “气泡 4” 、 “气泡 5” 、 “气泡 6” 、 “气泡 7” 。2）选择 “气泡 1”图层的第 1 帧，将库中的“气泡 ”影片剪辑元件，拖入舞台下方中，位置如下。3）选择 “气泡 2”图层的第 1 帧，将库中的“气泡 ”影片剪辑元件，拖入舞台下方中，位置如下。3）选择 “气泡 3”图层的第 5 帧，将库中的“气泡 ”影片剪辑元件，拖入舞台下方中，位置如下。4）选择 “气泡 4”图层的第 10 帧，将库中的“气泡 ”影片剪辑元件，拖入舞台下方中，位置如下。5）选择 “气泡 5”图层的第 15 帧，将库中的“气泡 ”影片剪辑元件，拖入舞台下方中，位置如下。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 13 页，共 19 页 - - - - - - - - - 6）选择 “气泡 6”图层的第 25 帧，将库中的“气泡 ”影片剪辑元件，拖入舞台下方中，位置如下。7）选择 “气泡 7”图层的第 30 帧，将库中的“气泡 ”影片剪辑元件，拖入舞台下方中，位置如下。8）选择图层右击插入文件夹，命名为气泡，把气泡1到气泡 7 共 7 个图层拖入文件夹中，方便管理。9）单击时间轴下端的“新建图层 ”命令。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 14 页，共 19 页 - - - - - - - - - 10）选择新建的图层的第1 帧，将 “蛇头”和“蛇身 ”拖入舞台，并复制多个蛇身，选择所有的蛇身，利用对齐工具“相对于舞台 ”水平对齐，然后取消“相对于舞台 ”且水平平均分布。11）在 “工具”面板中选择骨骼工具，将光标从蛇身的根部第一节向上拖动到第二节，这样就定义了第一个骨骼，同时自动创建一个“骨架 _*”图层，并把图层的内容自动剪切到“骨架 _*”图层中，依次创建其他的骨骼直到头部。如图所示。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 15 页，共 19 页 - - - - - - - - - 12）选择第1 帧，调整蛇的姿势和位置如下。13) 选择第 20 帧，调整蛇的姿势和位置如下。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 16 页，共 19 页 - - - - - - - - - 13) 选择第 40 帧，调整蛇的姿势和位置如下。14) 选择第 60 帧，调整蛇的姿势和位置如下。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 17 页，共 19 页 - - - - - - - - - 15) 选择第 80 帧，调整蛇的姿势和位置如下。第六步：测试影片先保存为 ” 海蛇漫舞 .fla ”，再 Ctrl+Enter 预览效果名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 18 页，共 19 页 - - - - - - - - - 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 19 页，共 19 页 - - - - - - - - -