时 光 轨 道

用 户 登 录
 
最 新 日 志

最 新 留 言

 

最 新 回 复
 

搜 索


友 情 连 接

 

 

 
 
 
FLASH MX2004基础课第二单元 3运动渐变
[ 2006-2-24 21:27:55 | By: 0甜心0 ]
 
动作补间动画是Flash中非常重要的表现手段之一,动作补间动画的对象必需是“元件”或“群组对象”。
  运用动作补间动画,你可以设置元件的大小、位置、颜色、透明度、旋转等种种属性,充分利用动作补间动画这些特性,可以制作出很漂亮的动画效果。

我们大家 访问一个网站时,最先吸引你的可能是网站上方的广告条吧?这就是Banner,它具有灵活的实时性、强烈的交互性与感染力,你可以用它来说明自己网站的特点,提升网站的形象,如果你能用Flash将Banner做成动画的形式,那无疑会大大增加网站的吸引力。
    下面先用动作补间动画制作一个网站Banner实例,


点击浏览该FLASH文件

分析作品:这个效果实用运动补间制作的,图片的变换配合文字体现主题内容,主要运用了透明度的设置,文字的大小的变化,给人一个启示。

教学目的:理解动作补间动画的工作原理,熟练掌握动作补间动画的制作方法。

知识点:本节你将学会以下知识:
    1、动作补间动画的制作方法
      2、“文本工具”的使用方法
   3、制作文字立体效果
   4、制作文字大小缩放效果
   5、设置元件改变透明度效果

一、创建影片文档并保存
  
1、新建文档 设置影片文档属性
   执行【文件】|【新建】命令,在弹出的面板中选择【常规】|【Flash文档】选项后,单击【确定】按钮,新建一个影片文档。打开【文档属性】对话框,设置文件大小为582×174像素,【背景色】为白色,如图1


此主题相关图片如下:
按此在新窗口浏览图片

      2、保存文档

执行【文件】/【保存】,在弹出的面板上找好路径起名;弹起的小球保存。

这样做的目的:是为了方便边制作边保存,以免出现意外丢失文件。

二、导入图片素材
   执行【文件】|【导入】|【导入到库】命令,图片导入到库中备用。(我这里为了大家学习方便把素材已经导入好了 。)

三、制作元件

  1、制作背景图形元件

    执行【插入】/【新建元件】在弹出面板给文件起名子【背景1】,行为:图形点确定,进入背景1的元件编辑区,f11打开库,把位图t1拖到编辑区,打开对其面板,水平居中、垂直居中,(也叫全具中)如图:02所示


此主题相关图片如下:
按此在新窗口浏览图片

用上述方法分别制作背景2、背景3、背景4、背景5、背景6、背景7、

2、制作文字1图形元件

      a、执行【插入】/【新建元件】在弹出面板给文件起名子【文字1】,行为:图形点确定,进入文字1的元件编辑区,在工具栏选择文本工具
此主题相关图片如下:
按此在新窗口浏览图片在场景中单击一下

     b、设置文本属性:,打开【属性】面板上设置文本类型为【静态文本】、字体为【黑体】、字体大小为20、颜色值为#003333,设置完后,在场景中输入“一口气,从雅典横渡到北京。”调出对齐面板,全局中。

  c、制作文字立体效果:为了使文字美观,给文字添加立体效果。点重图层一第一帧,点拷贝,添加一个新图层2。点图层二的第一帧,执行菜单兰-编辑-粘贴到当前位置,把文字粘贴进来,打开属性面板,改变文字颜色为白色。并将其实例向下、向左用方向键移动一个象素。效果如图3。
此主题相关图片如下:
按此在新窗口浏览图片

3、用上述方法分别制作文字2、-文字6的元件,

内容:文字2:“从北极到南极,没有突破不了的禁区。

          '文字3:左耳在苏州听评弹,右耳在威尼斯听歌剧。

          文字4:从丝绸之路到大峡谷,仅一步之遥。

          文字5:展开双臂,从曼哈顿到外滩。

          文字6:从北极到南极,就是你两眼间的距离。

4、制作主题文字图形元件

       a、执行【插入】/【新建元件】在弹出面板给文件起名子【主题】,行为:图形点确定,进入文字1的元件编辑区,在工具栏选择文本工具
此主题相关图片如下:
按此在新窗口浏览图片在场景中单击一下

     b、设置文本属性:,打开【属性】面板上设置文本类型为【静态文本】、字体为【黑体】、字体大小为31、颜色值为大红,加粗。设置完后,在场景中输入“世上无难事  只要肯登攀”调出对齐面板,全局中。注意:在世上无难事后边打空格键留出空格。

  c、制作文字立体效果:为了使文字美观,给文字添加立体效果。点重图层一第一帧,点拷贝,添加一个新图层2。点图层二的第一帧,执行菜单兰-编辑-粘贴到当前位置,把文字粘贴进来,回到图层一,打开属性面板,改变文字颜色为白色。并将其实例向下、向左用方向键移动一个象素  。(为了观看效果,可以将背景颜色改为黑色,)  效果如图4


此主题相关图片如下:
按此在新窗口浏览图片

四、创建动画

  本实例共有7个背景元件,7个文字元件,他们各自有各自的表现方法,为了初学的朋友便于理解我们这里把各个元件分别放在各自的图层上,共要建立15个图层。

1、单击时间轴右上角的【编辑场景】按钮,选择【场景1】转换到主场景中。

2、添加图层:点击添加图层按钮,添加14个图层,15共个图层。

3、改变图层名称,

    双击图层一改名为背景1。

    双击图层二改名为背景2。

    双击图层三改名为文字1。

       双击图层四改名为背景3。

    双击图层五改名为文字2。

    双击图层六改名为背景4。

    双击图层七改名为文字3。

    双击图层八改名为背景5。

    双击图层九改名为文字4。

    双击图层十改名为背景6。

    双击图层十一改名为文字5。

    双击图层十二改名为背景7。

    双击图层十三改名为文字6。

    双击图层十四改名为背景1。

    双击图层十五改名为标题。

如图5所示:
此主题相关图片如下:
按此在新窗口浏览图片

4、制作场景动画

( 1)、点背景一图层第一帧,f11打开库把背景1元件拖入舞台,全居中。在第40帧、插入关键帧(F6)。在舞台上点重背景1实例,设置透明度为;0。回到第一帧打开属性面板创建运动补间。

( 2)、点击背景二图层第一帧,f11打开库把背景2元件拖入舞台,全居中。在第40帧、100帧、140帧插入关键帧(F6),回到第一帧、140帧在舞台上点中背景2实例,打开属性面板设置透明度为;0。在第一帧、100帧创建运动补间。

( 3)、点击文字1图层的40帧,插入空白关键帧(F7),f11打开库把文字1元件拖入舞台,放在舞台中下方调出对齐面板,垂直居中,如图6:
此主题相关图片如下:
按此在新窗口浏览图片
在50帧、90帧、100帧分别插入关键帧。设置40帧、100帧上文字1实例的透明度为0。并在40帧、90帧创建运动补间。

( 4)、点击背景三图层的100帧,插入空白关键帧,f11打开库把背景3元件拖入舞台,全居中。在第140帧、200帧、240帧插入关键帧(F6),并在第100帧、240帧上点中舞台背景3实例,打开属性面板设置透明度为;0。在100帧、200帧上创建运动补间。

(5)、点击文字2图层的140帧,插入空白关键帧(F7),f11打开库把文字2元件拖入舞台,放在舞台中下方调出对齐面板,垂直居中, 在150帧、190帧、200帧分别插入关键帧。设置140帧、200帧上文字2实例的透明度为0。并在140帧、190帧创建运动补间。

(6)、点击背景四图层的200帧,插入空白关键帧,f11打开库把背景4元件拖入舞台,全居中。在第240帧、300帧、340帧插入关键帧(F6),并在第200帧、340帧上点中舞台背景4实例,打开属性面板设置透明度为;0。在220帧、300帧上创建运动补间。

(7)、点击文字3图层的240帧,插入空白关键帧(F7),f11打开库把文字3元件拖入舞台,放在舞台中下方调出对齐面板,垂直居中, 在250帧、290帧、300帧分别插入关键帧。设置240帧、300帧上文字3实例的透明度为0。并在240帧、290帧创建运动补间。

(8)、点击背景五图层的300帧,插入空白关键帧,f11打开库把背景5元件拖入舞台,全居中。在第340帧、400帧、440帧插入关键帧(F6),并在第300帧、440帧上点中舞台背景5实例,打开属性面板设置透明度为;0。在300帧、400帧上创建运动补间。

(9)、点击文字4图层的340帧,插入空白关键帧(F7),f11打开库把文字4元件拖入舞台,放在舞台中下方调出对齐面板,垂直居中, 在350帧、390帧、400帧分别插入关键帧。设置340帧、400帧上文字4实例的透明度为0。并在340帧、390帧创建运动补间。

(10)、点击背景六图层的400帧,插入空白关键帧,f11打开库把背景6元件拖入舞台,全居中。在第440帧、500帧、540帧插入关键帧(F6),并在第400帧、540帧上点中舞台背景6实例,打开属性面板设置透明度为;0。在400帧、500帧上创建运动补间。

(11)、点击文字5图层的440帧,插入空白关键帧(F7),f11打开库把文字5元件拖入舞台,放在舞台中下方调出对齐面板,垂直居中, 在450帧、490帧、500帧分别插入关键帧。设置440帧、500帧上文字5实例的透明度为0。并在440帧、490帧创建运动补间。

(12)、点击背景七图层的500帧,插入空白关键帧,f11打开库把背景7元件拖入舞台,全居中。在第540帧、600帧、640帧插入关键帧(F6),并在第500帧、640帧上点中舞台背景7实例,打开属性面板设置透明度为;0。在5500帧、600帧上创建运动补间。

(13)、点击文字6图层的540帧,插入空白关键帧(F7),f11打开库把文字6元件拖入舞台,放在舞台中下方调出对齐面板,垂直居中, 在550帧、590帧、600帧分别插入关键帧。设置540帧、600帧上文字6实例的透明度为0。并在540帧、590帧创建运动补间。

(14)、点击背景一图层的600帧,插入空白关键帧,f11打开库把背景1元件拖入舞台,全居中。在第640帧、插入关键帧(F6),750帧插入普通帧(F5)并在第600帧上点中舞台背景1实例,打开属性面板设置透明度为;0。在600帧上创建运动补间。

(15)、点击标题图层的640帧,插入空白关键帧(F7),f11打开库把标题元件拖入舞台,放在舞台中部 ,调出对齐面板,全居中, 在650帧、720帧、735、750帧帧分别插入关键帧。设置640帧、750帧上标题实例的透明度为0。735帧上的透明度为;50%,并在640帧、720帧、735帧创建运动补间。

五、测试保存

1)动作补间动画的概念
   在一个关键帧上放置一个元件,然后在另一个关键帧改变这个元件的大小、颜色、位置、透明度等,Flash 根据二者之间的帧的值创建的动画被称为动作补间动画。
(2)构成动作补间动画的元素

   构成动作补间动画的元素是元件,包括影片剪辑、图形元件、按钮、文字、位图、组合等等,但不能是形状,只有把形状“组合”或者转换成“元件”后才可以做“动作补间动画”。
(3)动作补间动画在时间帧面板上的表现

   动作补间动画建立后,时间帧面板的背景色变为淡紫色,在起始帧和结束帧之间有一个长长的箭头

本课素材下载:

2004版本素材;


点击浏览该文件

mx版本素材:
点击浏览该文件

这个是第一讲做好的素材:

点击浏览该文件

 
 

发表评论:

    昵称:
    密码: (游客无须输入密码)
    主页:
    标题: