中职Flash CS3动画设计案例教程项目八课件

1、(中职）Flash CS3动画设计案例教程项目八ppt课件项目八文字效果的制作 任务一电影海报的制作 任务二认识按钮的颜色 任务三 登录界面 任务四 毛笔字 任务一电影海报的制作 教学目标 掌握文字工具的使用方法，能够制作出静态文本。 教学难点 认识“文本属性”面板中各项参数的功能和作用。 教学重点 1、掌握使用文字工具制作静态文本的方法。 2、掌握编辑、修改文字及设置文字基本属性的方法。 3、了解字体呈现的各种方式。 任务描述 制作一张图文并茂的电影海报。作品要求以电影剧照作为背景，使用静态文本在画面正中显示电影名、右下角显示上映日期 。 任务分析 制作本任务，要求我们首先应该掌握文档的新建

2、和保存、文件属性的设置、导入图片到舞台等基本操作；其次我们要学习使用文本工具制作静态文本，以及在属性面板中调整文本的各参数值。工作步骤运行Flash CS3，新建一个空白文档。在【属性】面板中修改文档属性，设置画面尺寸为800500，其它参数值默认。单击“文件/导入/导入到舞台”，将“背景.jpg”图片导入到舞台上。 选中图片，在【属性】面板中设置图片的大小为800500、位置为（0，0）。 选择工具箱中的文本工具 ，鼠标指针变为“+A”，在【属性】面板中设置文本类型为“静态文本”，然后移动鼠标指针到舞台的中心位置单击，输入文本“变形金刚3”， 如下图。 选中文本，在【属性】面板中设置文本的字

3、体为“Adobe黑体Std R”、字号为“120”、颜色为“金黄色” （#FFD820）， 其它参数值默认。单击“窗口/对齐”，打开【对齐】面板，按下“相对于舞台”按钮，然后选中文本设置其对齐方式为“垂直居中对齐”、 “水平居中对齐”，如下图。 重复第5步骤的操作，在舞台的右下角位置输入文字“2011.7.21震撼上映”，并在【属性】面板中设置文本的字体为“Adobe楷体Std R魏”、字号为“40”、颜色为“浅蓝色” （#66FFFF）， 其它参数值默认。单击“控制/测试影片”（Ctrl+Enter），查看影片的最终效果，并保存文件为“电影海报.fla”，如下图。 相关知识与技能 1、静态文

4、本的概念：在动画运行中不可以编辑或改变的一种文本。 2、文本的输入方式：一是通过鼠标单击创建可伸缩的文本框，二是通过鼠标拖拽创建固定的文本框。 注： 区别可伸缩的文本框 和固定的文本框 3、文本的选取方式：一是使用选择工具选中文本框，对所有文本编辑操作；二是使用文本工具选取文本框内部文本，进行部分文本的编辑操作。 4、设置文本的属性：认识“文本属性”面板。 5、认识“字体呈现方式”中各选项的作用： 使用设备字体 位图文本（未消除锯齿） 动画消除锯齿 可读性消除锯齿 自定义消除锯齿 6、增加字体：将要增加的字体文件添加到C:WINDOWSFonts目录下。任务二认识按钮的颜色 教学目标 掌握动态

5、文本的制作方法。 教学难点 理解变量的作用，掌握简单脚本语言（ActionScript 2.0）中应用变量的程序编写。 教学重点 1、理解动态文本、变量的概念。 2、掌握动态文本的制作方法。 3、认识动态文本属性面板中相应参数的功能和作用。 任务描述 本任务要求制作一个简单的交互动画。当鼠标单击画面中的某个按钮时，在画面正中的文本框中将动态的显示出相应按钮的颜色名称。 任务分析 制作本任务，首先我们应该掌握文档的新建和保存、文件属性的设置、公用库面板和对齐面板的使用等基本操作；其次我们要学习使用文本工具制作动态文本，尤其是要理解变量的作用和设置方法。制作的难点在于编写按钮的单击响应语句，将动态

6、文本的变量值对应到各按钮的颜色名称上，形成最终效果。 工作步骤运行Flash CS3，新建一个空白文档。在【属性】面板中修改文档属性，设置画面尺寸为400300，背景色为“浅黄色”（#FFFF66），其它参数值默认。选择文本工具，在【属性】面板中设置文本类型为“动态文本”、字体为“宋体”、字号为“40”、对齐方式为“居中对齐”、线条类型为“单行”， 移动鼠标指针到舞台的中心位置拖拽，创建一个动态文本区域,如下图。 选中文本框，在【属性】面板中修改其大小为12044，并按下“在文本周围显示边框”按钮，显示出动态文本区域的边框。选中文本框，在【属性】中为其设置变量名称“text”，如下图。单击“窗

7、口/公用库/按钮”，打开【公用库按钮】面板。在面板的列表中打开“buttons circle flat”文件夹，选择 “circle flat blue”按钮添加到舞台上 选中按钮并右键单击，在弹出快捷菜单中选择“动作”命令，打开【动作】面板，输入语句：on (press) text = “蓝色”;，如下图。重复第6、7步骤，依次添加“circle flat purple”、“ circle flat yellow”、“ circle flat salmon”按钮到舞台上，并输入相应的动作语句： “circle flat purple”按钮：on (press) text = “紫色”;； “

8、circle flat yellow”按钮：on (press) text = “黄色”;； “circle flat salmon”按钮：on (press) text = “红色”;。单击“窗口/对齐”，打开【对齐】面板，按下“相对于舞台”按钮。同时选中“circle flat blue”按钮、动态文本框和“circle flat yellow”按钮，在【对齐】面板中单击“垂直居中对齐”按钮，使三个对象在舞台上垂直居中对齐。以动态文本框为中心，适当调整“circle flat blue”按钮、“circle flat yellow”按钮的上下位置，使三个对象垂直平均分布 。同样选中“cir

9、cle flat purple”按钮、动态文本框和“circle flat salmon”按钮，在【对齐】面板中单击“水平居中对齐”按钮，使三个对象在舞台上水平居中对齐，并以动态文本框为中心水平平均分布。单击“控制/测试影片”（Ctrl + Enter），查看影片的最终效果，保存文件为“认识按钮的颜色.fla”，如下图。相关知识与技能 1、动态文本的概念：在动画运行中动态的显示变量值的一种文本，可以用动作脚本控制。 注（区别于静态文本）：动态文本的控制手柄出现在文本框的右下角，静态文本的控制手柄出现在文本框的右上角。 2、设置文本的属性（动态文本）：选择文本工具后，可在【属性】面板中设置文本的

10、各项属性 。 3、响应按钮动作事件的基本脚本语句： on Press=function ：当按下按钮时调用。 on Release=function ：当释放按钮时调用。 on RollOut=function ：当鼠标指针移至按钮区域之外时调用。 on RollOver=function ：当鼠标指针移过按钮区域时调用。任务三登录界面 教学目标 掌握输入文本的制作方法。 教学难点 理解在应用实例中输入文本的作用，并掌握设置密码文本不可读的方法。 教学重点 1、理解输入文本的概念和呈现方式。 2、掌握输入文本的制作方法。 3、认识输入文本属性面板中相应参数的功能和作用。 任务描述 制作应用软件

11、的模拟登录界面。作品要求以一张位图作为背景，有输入用户名和密码的文本框，有应用登录的按钮。 任务分析 制作本任务，首先我们应该掌握文件属性的设置、图片导入等基本操作；其次我们要应用前面所学的静态文本添加和设置方法，还要学习使用文本工具制作输入文本，以及在属性面板中对文本的各参数进行设置。同样，本任务也要应用Flash软件中公用库的按钮，形成最终效果。工作步骤运行Flash CS3，新建一个空白文档。在【属性】面板中修改文档属性，设置画面尺寸为350250，其它参数值默认。单击“文件/导入/导入到舞台”，将“背景.jpg”图片导入到舞台上，并在【属性】面板中设置图片的大小为350250、位置为（

12、0，0）。 选择文本工具，在【属性】面板中设置文本类型为“静态文本”，在背景图片上输入文本“用户名”。并设置文本的字体为“楷体”、字号为“25”、颜色为“黑色”（#000000）， 位置为（50，60），其它参数值默认 。再选择文本工具，在【属性】面板中设置文本类型为“输入文本”、 字体为“宋体”、字号为“20”、 线条类型为“单行”， 移动鼠标指针到静态文本的后面拖拽，创建一个输入文本区域，如下图。 选中输入文本框，在【属性】面板中按下“在文本周围显示边框”按钮，并设置位置为（155，60），如下图。重复第4步骤，在“用户名”下方创建静态文本“密码”，其属性参数值参考“用户名” 属性，位置为

13、（50，120）。重复第5、6步骤，在输入文本框下方再创建一个输入文本区域，设置“线条类型”为“密码”，其它属性参数值参考第一个输入文本框属性，位置为（155，120）。 单击“窗口/公用库/按钮”，打开【库按钮】面板。在面板的列表中打开“classic buttons/Arcade buttons”文件夹，选择 “arcade button-yellow”按钮添加到舞台上，并设置其大小为4040，位置为（70，200）。 选择文本工具，在【属性】面板中设置文本类型为“静态文本”，在按钮上输入文本“登录”，并在在【属性】面板中设置文本的字体为“黑体”、字号为“14”、颜色为“黑色”（#0000

14、00）， 位置为（53.9，193.5），其它参数值默认。 单击“控制/测试影片”（ctrl+Enter），查看影片的最终效果，保存文件为“登录界面.fla” ，如下图。 相关知识与技能 1、输入文本的概念：用户可以动画运行中向文本框中输入数据的一种文本。 2、设置文本的属性（输入文本）：选择文本工具后，可在【属性】面板中设置文本的各项属性。 注：输入文本的属性面板中，“线条类型”下拉列表中增加了“密码”选项，当输入文本框用于输入密码或口令时可选择此项。 任务四毛笔字 教学目标 掌握文本动画的制作方法。 教学难点 理解文字对象在组合、一次分离、两次分离中的区别，以及编辑制作的特性和方法。 教学

15、重点 1、掌握文字工具、绘制工具的综合使用。 2、掌握将文字转换成图形编辑制作的方法。 3、能够综合运用逐帧动画和补间动画制作文字动画。 任务描述 制作毛笔字书写文字的动画。作品要求绘制一支毛笔，仿照书写毛笔字的运动顺序，在“米字格”背景上书写出楷体“中”字 。 任务分析 本任务是文字动画的综合制作，作品中的对象有三个：背景“米字格”、文字“中”和毛笔。 制作本任务我们要建立三个图层，图层1中需要使用矩形工具、线条工具绘制出“米字格”背景；图层2中我们要应用前面所学的静态文本添加和设置方法，添加楷体“中”字；图层3中要建立一个图形元件来绘制毛笔，通过关键帧的设置和动画补间的添加来实现毛笔的运动

16、动画。 本任务的制作难点是制作图层2中文字的逐帧动画，要配合好图层3中毛笔的运动，形成书写毛笔字的最终效果。工作步骤 一、制作“米字格”背景运行Flash CS3，新建一个空白文档。在【属性】面板中修改文档属性，设置画面尺寸为300300，其它参数值默认。双击【时间轴】面板中“图层1”名称，重命名为“米字格”。选择工具箱中的矩形工具，设置笔触颜色为红色（#FF0000）、填充颜色为无，移动鼠标指针到舞台上，拖拽画出一个矩形。选中矩形，在【属性】面板中设置其大小为250250，其它参数值默认。在【对齐】面板中设置其相对于舞台“垂直居中对齐”、 “水平居中对齐”。选择工具箱中的线条工具，在【属性】

17、面板中设置笔触颜色为红色（#FF0000）、样式为虚线，其它参数值默认，然后分别作矩形的对角线和对边中点的连线，如下图。 二、添加文字单击【时间轴】面板中“插入图层”按钮，插入“图层2”，并重命名为“字”。选择文本工具，在【属性】面板中设置文本类型为“静态文本”，然后在舞台上输入文字“中”，并设置字体为“楷体”、字号为“170”，其它参数值默认。在【对齐】面板中设置其相对于舞台“垂直居中对齐”、 “水平居中对齐”。选中文字，单击“修改/分离”（Ctrl + B），将文字分离成为可编辑的图形。 三、绘制毛笔单击【时间轴】面板中“插入图层”按钮，插入“图层3”，也可以重命名为“毛笔”。单击“插入/

18、新建元件”，新建名为“毛笔”的图形元件。在“毛笔”图形元件编辑区中，建立三个图层，“图层1”绘制笔管，“图层2”绘制笔头，“图层3”绘制吊线。单击“笔管”图层的第1关键帧，选择矩形工具，并设置笔触颜色为无、填充颜色为“褐色”（#C4911A）“白色”(#FFFFFF)“褐色”（#C4911A）的渐变色，移动鼠标指针到舞台上，拖拽画出一个矩形作为笔管 。单击“笔头”图层的第1关键帧，选择铅笔工具，并设置为平滑模式，然后在笔管下方绘制毛笔笔头的轮廓形状。选择选择工具，对笔头的轮廓形状进行微调；选择颜料桶工具，为笔头的轮廓形状填充黑色（#000000）。单击“吊线”图层的第1关键帧，选择铅笔工具，并

19、设置为平滑模式，在【属性】面板中设置笔触颜色为“褐红色”（#CC3300）、高度为“2.5”，然后在笔管上方绘制出吊线的形状。同时选中笔管和吊线，选择任意变形工具，将对象向右旋转一定角度，使毛笔呈倾斜状。回到场景中，单击“图层3”图层的第一关键帧， 在【库】面板中将“毛笔”图形元件添加到舞台上。 四、制作毛笔书写动画在【时间轴】面板中，将三个图层的关键帧延长至42帧，并锁定“米字格”图层和“字”图层。选择“图层3”图层的第5帧，并右键单击鼠标，在弹出的快捷菜单中选择“转换为关键帧”命令。用同样的方法将第6、15、20、21、30、31、42帧转换为关键帧。单击“图层3”图层的第1帧，将舞台上的毛笔移动到“中”字第一笔画的开始处。同样依次选择第5、6、15、20、21、30、31、42帧，移动毛笔的位置。具体如下： 第5帧，移动到“中”字第一笔画的结束处。 第6帧，移动到“中”字第二笔画的开始处。 第15帧，移动到“中”字第二笔画的折点处。 第20帧，移动到“中”字第二笔画的结束处。 第21帧，移动到“中”字第三笔画的开始处。 第30帧，移动到“中”字第三笔画的结束处。 第31帧，移动到“中”字第四笔画的开始处。 第42帧，移动到“中”字第四笔画的