Flash 制作跳动的文字镜像效果

此实例实现的是制作一个跳动的文字镜像效果。效果实现主要有两个方面，一是通过延迟不同元件的动画开播时间，实现了文字的先后运动。二是通过对中间帧动画变速调整，实现了跳动的弹性效果。而效果的主要制作步骤也是有两个，一是制作字符模板，二即是制作具体效果。难点在于元件转换、元件替换、中间帧动画调速和简单的播放控制。最终播放效果如图1所示，要实现这一效果，具体制作过程如下

图1　最终效果

一.制作字符模板

1.新建一个电影，在属性面板中设置其尺寸为550pxX400px,选择一种颜色（本例为#FFCCFF）作为背景色。

2.单击或直接按R键从工具箱中选择矩形工具 。将边框色设定为无，填充色设定为#FF99CC，用Rectangle（矩形）工具在舞台上画一个大矩形，盖住舞台的下半部分，效果如图2所示。

图2 在舞台上绘制的矩形

3．单击或直接按T键从工具箱中选取文本工具 ，并在属性面板中。将字体设定为黑体，字体大小设为96，颜色为#FF99CC，在舞台上写一个“X”大写字母，这个“X”将会被作为所有文字的模板，效果如图3所示：

图3 制作的“X”文字模板

4．选中字符“X”，选择“插入/转换为元件”菜单命令或直接按F8，将弹出 “转化为元件”对话框。将“行为”设置为“图形”并在“名称”文本框中为其命名为“char_tpl”，单击确定将字符“X”转化为图形元件“char_tpl”。选中刚转化成图形元件“char_tpl” 的字符X，再次打开“转化为元件”对话框。这一回，将“行为”改为“影片剪辑”，并为其重新命名为“m_char_tpl”，将“图形”元件“char_tpl”转化为“影片剪辑”元件“m_char_tpl。”双击影片剪辑元件“m_char_tpl”的字符X，进入元件编辑模式。选中舞台上的字符“X”，然后选择“窗口/信息”菜单命令或直接按Ctrl+I，打开“信息”面板。接着把其上的Y值（也就是字符X的纵坐标值）改为50，如图4所示。

图4 设置信息面板

5．选中时间线上的第20帧，选择“插入/关键帧”菜单命令或直接按F6，插入一个关键帧。接着在第40帧处，用同样的操作插入另一个关键帧，如图1-30所示。单击时间线上的第20帧，将“信息”面板上的Y值改为-70，这将使文字X上移70个单位。单击时间线上的第1帧，在“属性”面板上将“补间”动画类型选项改为无能无力渐变，加速方式设为100，即慢慢减速。单击时间线上的第40帧，选择“窗口/动作“菜单命令或直接按F9，打开Actions（动作）面板后，在面板中输入以下程序语句：

gotoAndPlay(_currentframe-40);

此ActionScript脚本使影片剪辑“m_char_tpl”元件重新回到第1帧开始播放。这么做可以使落体运动显得更加真实，同时，_currentframe语句的使用，也减少了后面制作中可能会遇到的阻力，此时影片剪辑“m_char_tpl”的时间轴状态如图5所示：

图5 “m_char_tpl”的时间轴窗口

6．回到主场景。将舞台上的X删掉后，这样字符模板就制作完成了。

二.制作具体效果

1．选择“窗口/库”菜单命令或直接按F11键，打开“库”面板，如图1-34所示。右击图形元件“char_tpl”，从弹出的快捷菜单中选择“复制”菜单命令，打开“复制元件”对话框。为复制的图形元件命名为“ g_镜”，然后单击“确定”按钮复制一个图形元件。双击“库”中新复制的图形元件“g_镜”，进入元件编辑模式。将字符X改为字符“镜”，如图6所示。

图6 修改元件中的字符

2.参照第1步，分别复制制作出元件 g_面、g_文和g_字等图形元件，并分别将字符“X”改为相应的“面”、“文”和“字”等字符

3．右击Library（库）中的影片剪辑元件“m_char_tpl”，然后从弹出的快捷菜单中选择“复制”菜单命令，打开“复制元件”对话框。在名称文本框中输入“ m_镜”，单击“确定”按钮复制一个影片剪辑元件双击Library（库）中的元件m_镜，进入元件编辑模式。单击第1帧，选中舞台上的X。选择“修改/交换元件”菜单命令，打开“交换元件”对话框，如图7所示。

图7 “交换元件”对话框

4．选中列表中的元件g_镜，单击OK完成元件的交换。这时候，舞台上的X已经变成了“镜”字。单击第40帧，选中舞台上的X。再次使用交换元件命令，将这个X也换成同样的“镜”字。再单击第1帧，选择“插入/帧”菜单命令或直接按F5，插入一个帧。还是选择第1帧，选择“插入/关键帧”菜单命令或直接按F6，插入一个关键帧。右击第1帧，从弹出的快捷菜单中选择“转换为空白关键帧”菜单命名，将第1帧变为普通帧，这时候动画起始帧（第2帧）的加速方式属性已经变为0，需要将其重新设为100。时间轴窗口如图8所示：

图8 “g_镜”的时间轴窗口

5．参照第3到第4步，依次作出相应字符的“影片剪辑”元件m_面、m_文和m_字。这三个影片剪辑和第一个m_镜在制作上基本上一样，唯一不同的地方是在第4步时插入的普通帧的个数，是以5帧作为间距进行插入，还有就是要注意上面1步提到的加速方式属性问题。元件m_面、m_文和m_字。这三个影片剪辑的时间轴窗口如图9、10和11所示：

图9　“m_面”时间轴窗口

图10　“m_文”时间轴窗口

图11　“m_字”时间轴窗口

6.回到主场景。将制作好的元件m_镜、m_面、m_文和m_字等“影片剪辑”拖到舞台上，创建相应的实例，选中四个字后，选择“窗口/排列”菜单命令或直接按Ctrl+F3，打开“排列”面板，如图1-46示。依次点击面板上的 ， 和 按钮，使用方向键，将文字移动到边界之上，如图12示。

图12　将文字移动到边界

7．下面来做文字的镜像。选中四个字，选择“编辑/复制”菜单命令或直接按Ctrl+D，复制四个字，选择“修改/变形/垂直翻转”菜单命令，将四个复制文字垂直翻转。按Ctrl+F3快捷键打开“属性”面板。接着将颜色一项设置为“高级选项”后，单击随后出现的“设置”按钮，在弹出的“高级效果”对话框中将各个值设定为如下的样子，如图13所示。

图13　“高级效果”面板

8．接下来只要把做好的镜像移动到边界上就万事OK了，发布电影就可以看见漂亮的镜面文字了，效果如图1-52所示。

图14 将镜像移动到下边界

值得一提的是在最后的文字显示上可能会有碰上一个小问题：一些中文字符在显示时会出现字体粘连的情况。这个毛病在以前的Flash版本中就存在了，很可惜，Flash MX里还是没能甩掉这只臭虫。解决这个问题的办法就是，一、选用其他字体，二、用Ctrl+B，将文字打散成为图形对象。同时大家可能会觉得，本节篇头大费周折制作的文字模板似乎有点多余。没错，制作的过程的确是繁琐了一点。不过，使用模板再加上元件替换可以让你的后续工作省事许多，特别是在文字多的情况下。