Flash-cs5交互式动画制作任务课件2.ppt

1、任务2：制作动画按钮1、启动Flash cs5，单击“文件”“新建”命令，新建一个类型为“ActionScript2.0”的空白Flash文件，如图1所示，其它值保持默认。任务实施：（本任务实例具体的制作过程）图12、单击“插入”“新建元件”命令，或按Ctrl+F8键，弹出“新建元件”对话框，新建一个名称为“七彩色自转光环”，类型为“影片剪辑”的元件，如图2所示，单击“确定”按钮，进入该元件的编辑状态。图2图33、选择工具箱中的“椭圆工具”，设置笔触颜色为“无”，填充色为“七彩色”，将鼠标指针移动到舞台的中心“十字架”处，按住Alt+Shift键的同时拖动鼠标左键不放向外拖动，绘制一个如图3所

2、示的正圆（处于打散状态）。图45、选择空心红色正圆及其内部的填充，按Delete键删除，效果如图5所示。4、选择工具箱中的“椭圆工具”，设置笔触颜色为“红色”，填充色为“无”，将鼠标指针移动到舞台的中心“十字架”处，按住Alt+Shift键的同时拖动鼠标左键不放向外拖动，绘制一个空心红色正圆（处于打散状态），如图4所示。图56、选择该元件的图层1的第80帧右击，选“插入关键帧”命令或按F6键，插入一个关键帧，在第180帧之间任意处右击，选“创建传统补间”命令。选中第1帧及其中的对象，打开“属性”面板，在“补间”选项栏中设置：顺时针旋转3圈，如图6所示。7、退出“七彩色自转光环”影片剪辑元件的编

3、辑状态，回到主场景中。图68、单击“文件”“导入”“导入到库”命令，将素材文件“dt.jpg”、“jw01.png”、“jw02.png”、“jw03.png”“jw27.png”等28个文件导入到库面板中，由于png性质的文件导入到库中时会对应生成相应的图形元件，所以此时库中的新元件有27个，库中的素材显得比较多、比较凌乱，如图7所示。图79、为了让库中的素材有序存放，便于查找，可以在库中新建文件夹，分门别类的存放不同性质的素材。按Ctrl+L键打开“库”面板，单击其左下角的“新建文件夹”按钮，则在当前库中生成一个新文件夹，命名为“图片”，如图8所示。选中库面板中的“dt.jpg”文件，按住

4、Shift键不放单击“jw27.png”文件，则这两个文件之间的所有文件全部被选中，把选中的文件按Ctrl+X剪切，在新建的“图片”文件夹中进行Ctrl+V粘贴。同理，把新生成的图形元件素材也移动到该文件夹中，效果如图9所示。以后导入的素材较多时，为了实现有序管理，就分类存放在库中就可以了。图8图910、单击“库”面板中“图片”文件夹左侧的水平三角形，变成垂直三角形，或双击“图片”文件夹的图标，则把该文件夹打开，从中找到素材文件“dt.jpg”并拖动到舞台上，如图10所示。选中舞台上的“dt.jpg”文件，打开“对齐”面板，设置其放在舞台的中心位置，如图11所示。图10图1111、选中舞台上的

5、“dt.jpg”文件，单击“修改”“转换为元件”命令或按F8键，弹出“转换为元件”对话框，选择类型为“影片剪辑”、名称为“街舞”，单击“确定”按钮，如图12所示。此时进入“街舞”影片剪辑元件的编辑状态。图1212、选中“街舞”影片剪辑元件的图层1的第60帧按F5键插入普通帧，并把该图层的名称更改为“地毯”，锁上该层。13、在“地毯”层的上方新建图层2，并更名为“舞者”。选中该层的第1帧，把库的“图片”文件夹中的“元件5”图形元件拖动到舞台中心位置（也可拖入png图片），选中第2帧插入普通帧；选择第3帧按F7键插入空白关键帧，把库的“图片”文件夹中的“元件6”图形元件拖动到舞台中心位置（也可拖入

6、png图片），选中第4帧插入普通帧；选择第5帧按F7键插入空白关键帧，把库的“图片”文件夹中的“元件7”图形元件拖动到舞台中心位置（也可拖入png图片），选中第6帧插入普通帧；依次类推，直到第53帧中放入最后一个图形元件31，选中该层的第60帧插入普通帧，如图13所示。图1314、此进跳舞者在舞台上的位置可能不在一个中心点上，若一帧帧调整会比较麻烦，怎么办呢？选中“舞者”图层的第1帧，单击时间轴下方的“绘图纸外观轮郭”按钮，在时间轴的帧上会出现“起始绘图纸外观”和“结束绘图纸外观”标记，如图14所示。这是绘图纸的显示范围，可以拖动标记，以改变当前绘图纸工具的显示范围，如图15所示，使该层的53

7、帧全部包括进来。图14图1515、单击时间轴下方的“编辑多个帧”按钮，在绘图纸标记的显示范围内的舞台中会显示多个关键帧的内容，并且可以同时对多个帧的内容进行修改。选择工具箱中的“选择工具”，框选舞台中的所有对象，打开“对齐”面板，不勾选“与舞台对齐”复选框，选择“水平居中”和“垂直居中”按钮，使得所有对象的中心点在一个位置上，如图16所示。再次单击“编辑多个帧”按钮，结束当前的多帧编辑。图1616、退出“街舞”影片剪辑元件的编辑状态，回到主场景中。并删除“街舞”影片剪辑元件在舞台中的实例。17、单击“插入”“新建元件”命令或按Ctrl+F8键，弹出“新建元件”对话框，名称为“动画”，类型为“按

8、钮”，如图17所示，单击“确定”按钮。进入“动画”按钮的编辑状态。图1718、选择“动画”按钮元件图层1的第1帧“弹起帧”，从库面板中拖入“七彩色自转光环”影片剪辑元件到舞台的中心位置，如图18所示。19、选择“动画”按钮元件图层1的第2帧“指针经过帧”，按F6键插入关键帧，选择工具箱中的“文本工具”，打开“属性面板”，设置字体为“黑体”、大小为48、字母间距为10、颜色为蓝色，在舞台的中心位置书写文字“单击此处播放动画”，并且分成两行显示，如图19所示。图18图1920、选择“动画”按钮元件图层1的第3帧“按下帧”，按F6键插入关键帧，选择该帧中的文字对象按Delete键删除。从库面板中拖出

9、“街舞”影片剪辑元件放在舞台上，并用“任意变形工具”选择该影片元件的实例，按住Alt+Shift键不放进行等比例缩放，大小位置如图20所示。选择该实例对象右击，选择“排列”“移至底层”命令，将该实例移到自转光环实例的下方，如图21所示。图20图2121、选择“动画”按钮元件图层1的第4帧“点击帧”，按F6键插入关键帧，选择“街舞”实例对象并删除，选择工具箱的“椭圆工具”，笔触颜色为无、填充色为蓝色，在舞台中心按住Alt+Shift键不放进行拖动绘制一个正圆，恰好将“七彩自转光环”实例的内部覆盖，删除“七彩自转光环”实例，效果如图22所示。图2222、退出“动画”按钮元件的编辑状态，回到主场景中。23、从库面板中拖出“动画”按钮元件放在舞台的中心位置，如图23所示。图2324、按Ctrl+Enter测试影片，效果如图24所示。图24按钮弹起的画面 按钮指针经过的画面 按钮按下的画面