FLASH制作基础教程(5)

中查看整个文档。

四、创建元件

元件可以像按钮或图形那样简单，也可以像影片剪辑那样复杂。创建元件后，必须将其存储到”库”面板中。元件使您能够多次使用相同的资源，而无需在FLA文件中存储该资源的多个副本。通过在Flash文档中仅保存元件的一个副本，可以缩小文档文件的大小。

您可以在”库”面板中存储元件，并在需要时将元件的实例拖动到舞台。Flash会在舞台上创建该元件的一个新实例。实例其实只是对原始元件的引用，它通知Flash”在该位置绘制指定元件的一个副本”。通过使用元件和实例，可以使资源更易于组织，使Flash文件更小。此外，您还可以通过编辑元件来更新特定元件的所有实例的外观和行为。这些更改随即会反映到整个文档中该元件的所有实例中。

下面新建第一个元件： 1.选择”插入”>“新建元件”。

2.在”创建新元件”对话框中，在”名称”文本框中键入imageHolder。”行为”的默认值为”影片剪辑”。

3.单击”确定”。

新元件添加到”库”面板，Flash进入元件编辑模式。在元件编辑模式下，不显示舞台，Flash应用程序窗口的主要部分变成一个可用来绘制和编辑元件的绘制区。

4.在元件编辑模式下，选择”工具”面板中的”矩形”工具。 5.在”工具”面板上的笔触颜色选取器中选择白色(#FFFFFF)。 6.在”工具”面板中的填充颜色选取器中选择浅灰色(#CCCCCC)。 7.在绘制区中拖动，绘制一个扁平矩形。 8.选择”工具”面板中的”选择”工具。 9.双击所绘制的矩形，选择其填充和笔触。 笔触是构成形状的边框的线段。

10.在”属性”面板中，在”X”和”Y”文本框中输入0。 这会将元件的左上角定位到舞台的左上角。

11.在”宽度”文本框中输入700，在”高度”文本框中输入150，然后按Enter键，以便让Flash确认该值。

所创建的首个元件的各个实例将成为FMA要显示的各个图像的容器。这就是将其命名为imageHolder的原因。下面，将创建另一个元件，该元件将成为imageHolder元件的一组实例（共五个）的容器。然后，您将制作该新元件沿垂直方向的动画，以更改显示在舞台可见部分的图像。

21

现在创建包含五个imageHolder实例的第二个元件： 1.选择”插入”>“新建元件”。

2.在”创建新元件”对话框中，在”名称”文本框中输入slides，”行为”的值为”影片剪辑”，单击”确定”。

3.从”时间轴”中的”缩放”菜单中选择25%。 4.在”库”面板中，将imageHolder元件拖动到绘制区。

现在已经创建了imageHolder元件的一个实例。该实例是您要创建的新slides元件的一部分。 5.在新实例在舞台上处于选中状态的情况下，在”属性”面板的”实例名称”文本框中输入holder0。 这将对实例赋予一个自己的名称，它与元件名称不同。 6.在”X”和”Y”文本框中输入0并按Enter键。 这会将holder0实例的左上角定位到slides元件的左上角。

7.将imageHolder元件从”库”面板中拖动到绘制区，并将其放置在holder0实例的下方。 8.在”属性”面板中的”实例名称”文本框内输入holder1。

9.在”X”文本框中输入0，在”Y”文本框中输入150，然后按Enter键。

10.为imageHolder元件的第三、第四和第五个实例重复此过程。在”属性”面板中，为新的实例赋予下列属性：

第三个实例：实例名称=holder2 X=0 Y=300 第四个实例：实例名称=holder3 X=0 Y=450 第五个实例：实例名称=holder4 X=0 Y=600

现在完成了名为slides的元件的创建。接下来将创建第三个元件，它将包含slides元件的一个实例。正如您所看到的，在其它元件内嵌套元件实例是一种常用的Flash创作技巧。

现在创建第三个元件： 1.选择”插入”>“新建元件”。

2.在”创建新元件”对话框中，在”名称”文本框中输入slideShow，，”行为”的值为”影片剪辑”，单击”确定”。

3.将创建的slides元件从”库”面板拖动到新元件slideShow的绘制区。 这将在新的slideShow元件内创建slides元件的一个实例。

4.在元件实例处于选中状态的情况下，在”属性”面板的”X”和”Y”文本框中输入0。 5.在”实例名称”文本框中输入slides_mc。 五、编辑元件时间轴

22

接下来将通过向slideShow元件的时间轴中添加动画来对该元件进行编辑。该动画的效果是：当用户单击您稍后添加的按钮时，已完成文档中的食物图像将向上滑行。

现在编辑slideShow元件：

1.在不退出元件编辑模式的情况下，单击时间轴中的”插入图层”。 当处于元件编辑模式时，会在时间轴的顶部看到您所编辑的元件的名称。 这会将一个图层添加到slideShow元件的时间轴。

这是影片剪辑和嵌套时间轴，每个影片剪辑元件都可以有各自的时间轴，该时间轴使影片剪辑可以包含各自的动画或ActionScript。元件和嵌套时间轴为您构建Flash文档并组织文档的功能提供了极大的灵活性。这样的典型示例是一辆转动着轮子驶过舞台的汽车。汽车在舞台上移动的动画可以在Flash文档的主时间轴中。每个转动的轮子都可以是具有自己的时间轴的影片剪辑元件的一个实例。轮子的转动动画是在影片剪辑的时间轴中实现的。与在主时间轴中创建轮子转动并同时在舞台上移动的动画相比，这种方法实现起来简单得多。

2.在时间轴中，选择图层1和2的第20帧。 3.选择”修改”>“时间轴”>“转换为关键帧”。

这会将帧添加到时间轴，并将关键帧添加到选定的帧（第20帧）。 4.通过选择图层1和2的第40帧并重复此过程。 5.在第60帧和第80帧中重复此过程。 六、向帧添加动作

在本部分中，您将添加少量ActionScript，以控制播放头如何通过slideShow影片剪辑的时间轴。通过添加stop()方法，可以让播放头在特定的帧处停止并等待。之后，您将添加ActionScript代码，以使播放头再次移动。

现在添加ActionScript代码：

1.在时间轴中，选择图层2的第1帧。

2.选择”修改”>“时间轴”>“转换为关键帧”。

这会将关键帧添加到该帧，因此，现在图层2的第1帧和第2帧中都有了关键帧。 3.选择图层2的第1帧。 4.打开”动作”面板。

如果”动作”面板处于脚本助手模式（您将看到文本”要添加某个项目，请双击该项目或者将其拖动到‘脚本’窗口”，而且您将无法在”脚本”窗口中键入内容），则单击”动作”面板中的”脚本助手”按钮以退出”脚本助手”模式。

23

5.在”动作”面板中键入以下代码： stop();

此代码导致播放头在到达第1帧时停止播放slideShow影片剪辑。时间轴图层1的第1帧中将出现一个小的a。它表示在该帧中存在ActionScript代码。

6.在时间轴中，选择图层2的第20帧。

7.选择”修改”>“时间轴”>“转换为关键帧”。 8.选择图层2的第20帧。

9.在”动作”面板中，键入stop();ActionScript。 10.在时间轴中，选择图层2的第40帧。

11.选择”修改”>“时间轴”>“转换为关键帧”。 12.选择图层2的第40帧。

13.在”动作”面板中，键入stop();ActionScript。 14.在时间轴中，选择图层2的第60帧。

15.选择”修改”>“时间轴”>“转换为关键帧”。 16.选择图层2的第60帧。

17.在”动作”面板中，键入stop();ActionScript。 18.在时间轴中，选择图层2的第80帧。 19.在”动作”面板中，键入stop();ActionScript。 七、向帧添加标签

下面将向特定的帧添加标签。通过为帧添加标签，就可以在ActionScript中引用该帧。这样，您将能够编写可以对这些帧执行动作的ActionScript代码。之后，您将添加使播放头跳到这些有标签的帧的ActionScript代码。

现在添加帧标签：

1.在时间轴中，选择图层2的第2帧。

2.在”属性”面板中，在”帧标签”文本框中输入slide0。 在时间轴图层2的第2帧中，出现一个小的旗帜图标和帧标签。 3.在时间轴中，选择图层2的第21帧。

4.在”属性”面板中，在”帧标签”文本框中输入slide1。 5.在时间轴中，选择图层2的第41帧。

6.在”属性”面板中，在”帧标签”文本框中输入slide2。

24

7.在时间轴中，选择图层2的第61帧。

8.在”属性”面板中，在”帧标签”文本框中输入slide3。 八、添加补间动画

补间动画是一种动画类型，在动画中对象从一个位置移动到另一个位置。使用这种方法，您只需设置要为其制作动画的对象的起始位置和结束位置，就可以创建平滑的动作动画。在本项目中，您将使食物的图像在用户单击一个按钮时向上移动。

现在添加补间动画：

1.在时间轴中，选择图层1的第1帧。

2.在”属性”面板中，从”补间”菜单中选择”动画”。

图层1的第1至19帧成为一个补间动画。时间轴的这些帧中出现一个箭头。 3.在”属性”面板中，拖动”缓动”文本框旁边的滑块，直至文本框中的值变为100。 这个数字会使补间在动画的末尾缓动。这意味着动画将突然开始并越来越慢地结束。

补间动画的默认行为是在整个动画过程中匀速前进。但是，这种视觉效果通常不是很好。就像汽车速度不会瞬间从0升至每小时50英里一样，动画也不应这样。缓动动画就像使汽车缓慢加速一样。术语缓动来自将汽车逐渐开动或逐渐停下来这一概念。通过添加缓动值，您可以让补间动画的开始或结束有个舒缓的过渡。

4.在时间轴中，选择图层1的第20帧。

5.在”属性”面板中，从”补间”菜单中选择”动画”。 6.向上拖动”缓动”滑块，直到”缓动”值为100。 7.单击舞台上的slides_mc影片剪辑实例以将其选中。 8.在”属性”面板中，在”Y”文本框中输入-150。

这会将slideShow影片剪辑实例在第20帧的关键帧中向上移动150像素。从第1帧到第20帧的补间动画将缓慢向上滑动该影片剪辑，而不会使该影片剪辑直接从一个位置跳到下一个位置。

9.在时间轴中，选择图层1的第40帧。

10.在”属性”面板中，从”补间”菜单中选择”动画”。 11.向上拖动”缓动”滑块，直到”缓动”值为100。 12.单击舞台上的slides_mc影片剪辑实例以将其选中。 13.在”属性”面板中，在”Y”文本框中输入-300。 14.在时间轴中，选择图层1的第60帧。

15.在”属性”面板中，从”补间”菜单中选择”动画”。

25

百度搜索“77cn”或“免费范文网”即可找到本站免费阅读全部范文。收藏本站方便下次阅读，免费范文网，提供经典小说综合文库FLASH制作基础教程(5)在线全文阅读。