《Flash CS3 入门制作按钮动画.docx》由会员分享，可在线阅读，更多相关《Flash CS3 入门制作按钮动画.docx（4页珍藏版）》请在三一办公上搜索。
1、Flash CS3 入门 制作按钮动画Flash CS3 入门 制作按钮动画 本例为按钮动画，主要通过结合绘制出图案，然后通过对话框将其转换为按钮元件，进行各种编辑最终完成按钮动画效果。本例重点在于按钮元件的创建以及影片剪辑的应用。按钮元件主要用于相应鼠标单击、滑过或其他动作的交互，可以定义与各种状态关联的图形，然后将动作指定给按钮实例。本例为鼠标滑过动画效果。 练习要点 l 选择工具 l 矩形工具 l 文字工具 l 圆形工具 l 将图形转换为按钮元件 l 将图形转换为影片剪辑元件 练习过程 新建一个Flash文档，在面板中设置文档大小为800600像素。在工具箱中单击按钮，然后使用绘制一个与
2、舞台大小一致的矩形图形。按下Shift键打开面板，设置各个选项。最后使用单击矩形图形，进行调整，如图28-1所示。 图28-1 新建文档并绘制矩形图形 在上单击按钮创建新的图层，并命名为“图案”。使用绘制一个矩形图形，然后选择将鼠标移动到矩形图形边缘，同时按下Alt键拖动鼠标添加节点，如图28-2所示。 图28-2 绘制图形 选择将鼠标移动到图形两个节点之间，当鼠标显示为光标时，拖动鼠标，使两个节点之间的线段呈曲线显示。然后打开面板，设置填充颜色以及轮廓线颜色，效果如图28-3所示。 图28-3 调整图形 使用上面相同的方法，制作出图28-4所示的黑色图案。分别选择这两个图形，按下CtrlD快
3、捷键，执行命令。然后执行命令，并使用移动图形副本与源图形对齐。 图28-4 复制图形 使用在图形上面绘制一个圆形，并设置填充颜色。然后，选择所有图形，按下F8快捷键，打开对话框，在该对话框中，单击单选按钮，并在文本框中输入图案名称，如图28-5所示。 图28-5 将图形转换为元件 选择图案元件，按下CtrlK快捷键，打开面板，单击按钮按钮。然后使用双击图案元件，进入编辑模式，分别选择和帧，按下F6快捷键，插入关键帧，如图28-6所示。 弹起帧，代表指针没有经过按钮时该按钮的状态；指针经过帧，代表当指针滑过按钮时，该按钮的外观；按下帧，代表单击按钮时，该按钮的外观；点击帧 用于定义响应鼠标单击的
4、区域，该区域在SWF文件中是不可见的。 图28-6 转换为图形元件并插入关键帧 选择帧，按下F8快捷键，打开对话框，在对话框中单击单选按钮。双击进入编辑模式，创建新的图层，选择并在面板中设置各个选项，绘制出图28-7所示的图形。 图28-7 绘制图形 按下CtrlShiftAltR快捷键，显示标尺。将鼠标放置在标尺上面同时拖动鼠标，拖出辅助线定义一个点。然后使用选择绘制的图形，将中心点移动到辅助线定义的点上面。最后，按下CtrlT快捷键，打开面板，设置角度，并单击按钮，效果如图28-8所示。 图28-8 调整图形 选择上面绘制的图形，按下CtrlD快捷键，执行命令。然后使用单击该图形，选择变换
5、选框的右上角控制点，同时按下Shift键向左下角拖动鼠标缩小图形。最后，按下F8快捷键，打开对话框，设置如图28-9所示。 图28-9 转换为影片剪辑 可以在按钮中使用图形或影片剪辑元件，但不能在按钮中使用另一个按钮。如果要按钮制成动画按钮，可以使用影片剪辑元件。 使用双击图形进入“元件6”编辑模式，创建新的图层选择小环形图形，剪切并复制到图层2上面。然后分别将两个图形转换为图形元件，在第45帧处按下F6快捷键分别插入关键帧，如图28-10所示。 图28-10 插入关键帧 分别选择“图层1”和“图层2”第1帧和第45帧之间任意一帧，右击鼠标选择命令。然后按下CtrlF3快捷键，打开面板，在下拉
6、列表中选择图形的旋转方向，如图28-11所示。 为了使环形图形在动画上有区别，分别将这两个图形设置为顺时针和逆时针旋转。 图28-11 创建补间动画 按下CtrlL快捷键，打开面板，双击“元件2”名称，进入编辑模式。选择环形图形，按下CtrlT快捷键，打开命令，在该面板中分别设置和角度，如图28-12所示。 图28-12 变形图形 打开面板，双击“图案”名称，进入编辑模式。然后使用在图案边缘单击同时按下Shift键并拖动鼠标，绘制一个正圆图形，创建一个点击范围，如图28-13所示。 图28-13 创建点击范围 单击“场景1”返回到舞台，选择“背景”图层。使用在背景上输入文字，并在面板中设置字母间距。然后按下CtrlK快捷键，打开对话框，设置如图28-14所示。 图28-14 输入文字 至此，按钮动画制作全部完成。按下CtrlEnter快捷键，执行命令，将文件生成SWF格式。按下CtrlF快捷键，全屏预览动画效果。将鼠标移动到图案上方，用户将看到旋转的环形图形，效果如图28-15所示。 图28-15 测试影片
