动作补间动画网站Banner.docVIP

实验 动作补间动画：网站Banner 当你访问一个网站时，最先吸引你的可能是网站上方的广告条吧？这就是Banner,它具有灵活的实时性、强烈的交互性与感官性，你可以用它来说明自己网站的特点，提升网站的形象，如果你能用Flash做成动画的形式，那无疑会大大增加吸引力。 【相关知识点】 创建文字变色效果 创建文字改变大小效果 创建文字改变透明度效果 【最终效果图】 图 实例效果 【制作步骤】 1、设置影片文档属性 执行【文件】|【新建】命令，在弹出的面板中选择【常规】|【Flash文档】选项后，单击【确定】按钮，新建一个影片文档，在【属性】面板上设置文件大小为520×60像素，【背景色】为白色，如图所示： 图 文档属性 2、设置背景图层 执行【文件】|【导入】|【导入到舞台】命令，将名为“启航背景.bmp”图片导入到场景中，选择工具箱中的【选择工具】和【任意变形工具】调整图片的大小和位置。选中第205帧，按F5键，添加普通帧，如图所示。 图 设置背景 3、创建“电脑动画”元件 执行【插入】|【新建元件】命令，新建一个图形元件，名称为“电脑动画”。在新元件编辑场景中选择第一帧，单击工具箱中的【文字工具】，在场景中单击一下，然后在【属性】面板上设置文本类型为【静态文本】、字体为【隶书】、字体大小为32、颜色值为#FF9900，设置完后，在场景中输入“电脑动画”四个字，如图所示： 图 创建“电脑动画元件” 4、创建“网页设计”元件 执行【插入】|【新建元件】命令，新建一个图形元件，名称为“网页设计”。在编辑场景中选择第一帧，按上面的方法，在场景中输入“网页设计”四个字，参数同上。 5、创建“图像制作”元件 执行【插入】|【新建元件】命令，新建一个图形元件，名称为“图像制作”。在编辑场景中选择第一帧，按上面的方法，在场景中输入“图像制作”四个字，参数同上。 6、创建“闪客启航”元件 执行【插入】|【新建元件】命令，新建一个图形元件，名称为“闪客启航”。在编辑场景中选择第1帧，单击工具箱上的文字工具 ，在【属性】面板上设置文本类型为【静态文本】、字体为【隶书】、字体大小为50、颜色值为#FF6600,在场景中输入“闪客启航”四个字，如下图所示：? 7、创建“语音教学” 执行【插入】|【新建元件】命令，新建一个图形元件，名称为“语音教学”。在编辑场景中选择第1帧，单击工具箱中的【文字工具】，文字属性不变,在场景中输入“语音教学”四个字。 ??? “电脑动画”、“网页设计”和“图像制作”三组字体分别从大到小、由近及远以渐显的方式运动到舞台中央停留片刻，再移动到舞台左边，字体颜色和大小相应改变。然后“闪客启航”一组字以同样的方式移动到舞台中央，突然消失，最后“语音教学”以旋转的方式移动到舞台正中，这就是本实例中文字的动画效果。下面，我们就来实现这一动画效果。 8、创建“电脑动画”文字效果 单击时间轴右上角的【编辑场景】按钮，选择【场景1】转换到主场景中。在场景中新建一个图层。选择第1帧，把库里的“电脑动画”元件拖到场景的外面，在【属性】面板上设置元件的【W】值为260.0，【H】值为45.0,【X】值为58.0，【Y】值为48.0,【Alpha】值为3%，然后在第20帧处添加关键帧，在场景中选中文字，在【属性】面板中，设置【W】值为141,【H】值为36，【X】值为127，【Y】值为12,选择【颜色】为【无】。 图是“电脑动画”元件在【属性】面板中的第1、20帧处的位置参数。? ??????????? (a)第1帧属性 （b）第20帧属性 图 “电脑动画”属性设置? 在第28帧处添加关键帧，不改参数，这是为了给该文字对象一个停顿，让别人能看清楚。 在第48帧处添加关键帧，在【属性】面板上，设置【W】值为75，【H】值为12,【X】值为12，【Y】值为9，选择【颜色】为【色调】、黑色，如图所示： 图 设置第48帧上实例的属性? 分别用鼠标右键单击第1帧和第28帧，在弹出的菜单中选择【创建补间动画】。 9、创建“网页设计”文字效果 在场景中新建一个图层。在此图层的第49帧处添加关键帧，把库里的“网页设计”元件拖到场景中，在【属性】面板上设置元件的【W】值为300，【H】值为83，【X】值为43，【Y】值为20，【Alpha】值为6%。然后在第71帧处添加关键帧，在场景中选中文字，在【属性】面板中设置【W】值为135,【H】值为36，【X】值为131，【Y】值为11,选择【颜色】为【无】，如图所示： 图 在第49、71帧中的“网页设计”? 再在第78帧处添加关键帧，不改参数，在第97帧处添加关键帧，在【属性】面板上，设置【W】值为81，【H】值为22,【X】值为