Flash动画学习指南十二: 形状补间

转自：http://bbs.9ria.com/thread-74979-1-1.html

本帖最后由 skyplan 于 2011-3-2 10:15 编辑 预备知识：Flash工作空间的基本知识。 受众水平：初学者。 所需产品: Flash Professional CS4 （下载试用版） 通过补间形状，您可以创建一个类似的变形--随着时间的推移一个形状转换成另一种形状--或者颜色和渐变动画效果。 FLASH也可以补间形状的位置，大小，颜色和透明度。例如，您可以使用形状补间，使一个圆形变成方形 , 或者使一条线摆动。 注意：形状补间与关键帧或基于对象的渐变的概念不同。一个形状补间是为位于两个关键帧上的两个单独形状之间创建插值动画。想了解这种类型的关键帧信息，请阅读下一节内容。 创建形状补间 一次补间一个形状通常会产生最佳效果。如果您在同一时间补间多个形状，并希望他们能够变形在一起，所有的形状必须在同一层。否则，对于一些特效，您需要分别在每个单独的层上对每个形状作形状补间（如果您不希望它们互相影响）。在图62中，每个矩形--背景中的窗帘效果，以及顶部的矩形---都在自己单独的层上进行补间（见源文件中shape-tween.fla）。   图62 每个形状都在自己的层上进行补间，所以形状变化都是分开进行的。 为了将形状补间应用到组，实例或位图图像，您必须首先将这些元素打散（Modify > Break Apart）。为了将形状补间应用到文本，您必须将文本打散两次使得文本转成多个对象。 注意：要控制更加复杂的或不可能的形状改变，您需要使用形状提示，它控制如何将原来的形状的部分变动到新的形状。有关信息，请参阅下一节使用形状补间形状提示 要补间形状： 1. 创建一个新文件，并将其命名为 shapetween.fla。 2. 选择图层1的第1帧。这是动画的开始。 3. 使用钢笔，椭圆形，矩形，铅笔或画笔工具创建一个图形。为获得最佳结果，当您开始时画面应该只包含一个图形（如单个椭圆形）。 4. 选择图层1的第10帧，创建第二个关键帧（F6）。 5. 选择在第10帧舞台上的艺术作品（artwork），并执行下列操作之一：   .修改艺术品的形状，颜色，透明度，或位置。   .在第二个关键帧（它应该是原始图形绘制），删除艺术作品并放置新的艺术作品。 6. 右键单击在1到10帧之间的时间轴上的任何一帧，然后从上下文菜单中选择创建形状补间（Create Shape Tween）。 7. 从属性检查器选择一个Blend（Window > Properties）选项：   . Distributive 创建一个动画，使其中间形状变化更顺畅，更不规则。   . Angular  创建一个动画，使其在中间变化时，保留形状明显的角和直线。 注：角是适当的，尖锐的角和直线的混合形状而已。如果您选择的形状没有角，Flash恢复到Distributive类型的形状补间。 当进行形状补间时使用形状提示（shape hints） 为了控制更复杂的或不可能的形状改变，您可以使用形状提示。形状提示可以找出对应点，用来对应在开始和结束形状上。例如，如果您是渐变字母M到字母N，您可以使用形状提示来标示字母的形状角落。然后，在字母变形中每个字母仍可以清晰分辨，而不是成为一个杂乱的线条形状的变化。 提示：有时形状提示可以产生意想不到的结果，或者您可能用形状提示仍无法达到您想要的效果。您可能想尝试使用inverse kinematics (IK)而不是一个形状，即使用骨骼结构最为动画的对象。要了解如何做到这一点，请阅读在Creating animation in ActionScript 3.0中的"Animating with the Bone tool"。 要使用形状提示： 1. 创建形状补间（参见上一节，“创建形状补间“）。 2. 选择第1帧和时间轴上的动画层。 3. 选择Modify > Shape > Add Shape Hint。 4. 将您要标记的形状提示移动到形状的边或角落。 5. 选择补间序列的下一个关键帧。 6. 将形状提示移动到最终形状的边缘或角落，它应该对应于第一个形状上的形状提示标记位置。 重复此过程，添加剩下的形状提示。新的提示出现在下面的字母上（b, c, 依此类推）。 图63动画的SWF文件显示了字母M到字母N的动画。最上面的SWF文件没有用形状提示来变形这两个字母，而下面的SWF文件使用了形状提示来改进这种变形。通过图64（和源文件的shape-hints.fla）您可以看到每个形状提示是如何放置的。 图63。顶部的SWF文件显示两个字母之间的默认形状补间。底部的SWF文件显示使用形状提示来控制字母变形的动画。   图64。增加了形状提示来控制两个字母之间的变形。您可以在图63看到它的动画。 形状提示含有编号（a到z）,它用来确定每个点在开始形状和结束形状对应的位置。您最多可以使用26个形状提示。形状提示在开始的那个关键帧上显示黄色，在最后那个关键帧上显示绿色，在填充区域内和形状外显示红色（Flash忽略红色形状提示）。 为获得最佳结果，当进行形状补间时，应遵循以下原则： •        对于复杂的形状补间，要创建中间形状，并在它们之间进行补间，而不是仅仅定义一个开头和结尾的形状。 •        确保形状提示是合乎逻辑的。例如，如果您是在一个三角形上设三个形状提示，那么它们在原三角形和被补间三角形上的顺序必须是相同的。如果在第一个关键帧的顺序是abc而在第二个关键帧上的顺序是acb，这样是不行的。 •        如果您将形状提示在形状的左上角按顺时帧防放置，这样它们能更好得工作。 要了解更多的关于形状提示和形状补间的信息，请参阅Flash产品文档的Shape tweening节。有关使用IK做形状动画的信息，请阅读Creating animation in ActionScript 3.0中Animating with the Bone tool节. 更多的内容请看 Animation Learning Guide for Flash的其他章节.