Flash 教案.doc_第1页
Flash 教案.doc_第2页
Flash 教案.doc_第3页
Flash 教案.doc_第4页
Flash 教案.doc_第5页
已阅读5页,还剩23页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

第一课 初识FLASH教学目标:熟悉FLASH的工作环境,掌握最基本的概念教学重难点:层和元件的概念及简单运用 教学过程:一、FLASH特点:使用矢量图形和流式播放技术。矢量图形可以任意缩放尺寸而不影响图形的质量;流式播放技术使得动画可以边播放边下载,通过使用关键帧和图符使得所生成的动画(.swf)文件非常小,几K字节的动画文件已经可以实现许多令人心动的动画效果,把音乐,动画,声效,交互方式融合在一起,越来越多的人已经把Flash作为网页动画设计的首选工具。 强大的动画编辑功能使得设计者可以随心所欲地设计出高品质的动画,通过ACTION和FS COMMAND可以实现交互性,使Flash具有更大的设计自由度,另外,它与当今最流行的网页设计工具Dreamweaver配合默契,可以直接嵌入网页的任一位置,非常方便。 总之,Flash已经慢慢成为网页动画的标准,成为一种新兴的技术发展方向。二、熟悉工作环境1、主要分为舞台 就是工作区,最主要的可编辑区域。在这里可以直接绘图,或者导入外部图形文件进行安排编辑。就像演员表演的舞台,动画呈现在舞台上,超出舞台的区域就为不可见,也就是幕后,FLASH动画也要十分注重舞台和幕后的共同设计。时间轴窗口 用它可以调整电影的播放速度,并把不同的图形作品放在不同图层的相应帧里,以安排电影内容播放的顺序。绘图工具栏 放置了可供图形和文本编辑的各种工具,用这些工具可以绘图,选取,喷涂,修改以及编排文字,还有些工具可以改变查看工作区的方式。在选择了某一工具时,其所对应的修改器(Modifier)也会在工具条下面的位置出现,修改器的作用是改变相应工具对图形处理的效果。标准工具栏 列出了大部分最常用的文件操作,打印,剪贴板,撤消和重做,修改器以及控制舞台放大比例的图标和选项,便于进行更为快捷的操作。图库窗口 用以存放可以重复使用的称为符号的元素。符号的类型包括有图片(Graphics),按钮(Button)和电影片断(Movie Clip)。其调用的快捷键为Ctrl-L。学习FLASH也要养成良好的习惯,其中建立元件就是最基本也是最重要的,元件存放在图库中,这样便与元件的重复使用以及统一修改。控制器面板 控制电影的播放操作的工具集合(包括影片的前进后退暂停等),一般不大常用,处于隐藏状态。2、逐步介绍各个区域(1) 时间轴时间轴(Timeline)是Flash中最重要的工具之一。用它可以查看每一帧的情况,调整动画播放的速度,安排帧的内容,改变帧与帧之间的关系,从而实现不同效果的动画。状态栏中的 为洋葱皮(Onion skin)按钮,其作用是在显示播放头所在帧内容的同时显示其前后数帧的内容。当点击该按钮时,播放头周围会出现方括号形状的标记,其中所包含的帧都会显示出来,这将有利于我们观察不同帧之间的图形变化过程。和 的作用一样,只不过它只显示各帧图形的轮廓线。当我们需要同时编辑多个帧时,按下按钮就可以了,但要注意,它只对帧-帧动画有效,而对渐变动画无效,因为渐变动画是通过定义关键帧再插值的方法实现的,所以其中内插的帧是无法编辑的。是洋葱皮修改器,用于改变洋葱皮的状态和设置。其后的三个数字分别为当前播放头所在帧号,动画播放速度以及以此速度从头播放到当前帧所需的时间。时间轴窗口右上角的 可以用来调整时间每个单元格的宽窄大小,各人可根据自己的喜好,动画的长短等因素进行修改,以便于实际操作。(2)元件和层概念及运用在讲动画形式之前先讲元件和库的概念,教学生建立元件的方法及必要性。(实例yuanjian)空心小圆圈表示空白的关键帧,没有内容,例如在新建一个动画文件时出现。先建立一个元件,然后在场景中拉入元件拉入后成实心点,有内容就成了实心点单独的关键帧为一黑色圆点,后面为灰色表明其后各帧的内容与其一致,没有变化。实例分析:背景色的设置;相同小球的组合绘制要点:选择工具的使用(任意变形和整体选择操作)圆形的绘制(shift画正圆);建立元件(元件的概念)组合CTRLG打散CTRLB直线工具的使用元件主要有两个优点:可以重复使用和统一修改介绍元件建立的两个方法:插入建立新元件或者选择对象转换为元件。(3)图层:通过实例ceng及clx掌握图层关于图层(Layer)的概念,学过Photoshop的人都不会陌生。形象地说,图层可以看成是叠放在一起的透明的胶片,如果层上没有任何东西的话,你就可以透过它直接看到下一层。所以我们可以根据需要,在不同层上编辑不同的动画而互不影响,并在放映时得到合成的效果。使用图层并不会增加动画文件的大小,相反它可以更好帮助我们安排和组织图形,文字和动画。图层是Flash中最基本而且重要的内容,因而需要很好地掌握: 在实例(ceng)中学习下面的知识。左图是一个典型的图层例子,图中所示共有十一个层。其中用黑色标识带有一支铅笔 标志的层为当前正在编辑的层。如果该层不能被编辑,则会显示 图标。在这些层右上方有三个图标,其中 可以控制该层是否被显示,默认状态为正常显示,在对应下方用 表示,如果点击这个黑点,则会出现 ,同时该层被隐藏,隐藏的层不能被编辑。 用来控制是否锁住该层,被锁住的层可以正常显示,但不能被编辑,这样在你编辑其它层时,可以利用这一层作参考,而不会误改了这一层的内容。 可以控制是否将层以轮廓线方式显示,点击对应的黑点,会出现 ,再点一次恢复正常。这几个功能可以同时起作用。(4)动画形式分为运动动画和渐变动画运动动画:例如一个小球从左边运动到右边 表示运动渐变动画,关键帧用黑色的圆点标识,内插帧用黑色的实线表示,背景为淡紫色(浅蓝色)。虚线说明中间的过渡存在错误,无法正确实现内插。两个例子:一个是小球位置的改变,另一个是颜色透明度的改变。渐变动画:例如圆变方块! 表示变形过渡动画,关键帧用黑色的圆点标识,内插帧用黑色的实线表示,背景为淡绿色。同样如果中间出现错误,也会出现虚线!主要是两个例子,圆变方块和英文字变中文其中要注意对象要打散,文字要打散两次。比较和补间动画的区别。三、小结通过本次课的学习,学生要理解并掌握元件和层的概念及简单运用。要注意以下几点:1. 元件存在库中,方便重复使用和统一修改2. 一个元件对应一层3. 层之间上下叠放,可改变顺序4. 动画的两种形式,补间动画包括位置和颜色透明度的改变。形状动画要注意对象要打散,其中文字的打散要用两次CTRLB。 第二课 FLASH简单动画制作教学目标:1、复习巩固FLASH中最基本的概念(元件、图层)2、掌握两种动画形式:补间动画和渐变动画3、掌握时间轴上帧的操作(插入、删除等)教学重点:应用工具画图,并制作动画教学过程:一、 复习巩固主要是在上周的基础上完成进一步动画做完的同学可以进一步练习两种动画形式,主要为物体透明度的改变和文字的变形。 记住三句口决:1、 一个对象一层2、 一般一个对象要转换为元件3、 在形状动画中不要建立元件,对象要打散二、 实例运用1上节课已经学习了两种最基本的动画形式,这次课我们就先来综合运用一下。实例1哭脸变笑脸1、 先给学生看最后的效果2、 分析要分为几层?五层脸、眼眶、嘴、左眼、右眼为什么要用5层?嘴一层要进行动画制作,因此要单独一层左右眼珠分两层,眼睛看起来灵活些,也更方便些几个注意的地方:线条的粗细可调整;对象的大小可调整(直接修改数值比较精确);对象要对齐可用吸附工具,也可以借辅助线用方向键进行微调整;嘴是要变形的,打散状态(右键分离弧线才可变形,选中的对象不能改动);F5普通帧(删除帧),F6关键帧(清除关键帧),补间动画FLASH自动生成。思考:眼睛怎么转动? 元件的运动。分析:眼珠要四周转动,需要四个关键帧三、 综合实例1、 看实例2进行分析:主要是混色器的使用关键步骤:先画一个圆,线条可调整;选择渐变的圆,在混色器中进行调整(小块往下拉就删除),调整到合适的效果(用颜料桶填充);要做圆环,在大圆中再画一个小圆,小圆在选中状态下可以改变位置,调整大小等。(要注意,放开就不能改了)。改变大小时,SHIFT是左上角调整,ALT则是以圆心调整;要做成补间动画(形状动画也是成立的,但没什么效果。自己要多试,可以意外发现一些效果)补间动画顺时针40帧循环3次(24帧为1秒) 思考字母变形的做法(结合上次课的练习)四、 学生动手创作教师节贺卡(有样例3)(20)要求学生充分发挥自己的想象力,动手制作一张贺卡主要包括几方面的内容:1、 文字的移动2、 文字的旋转移动3、 文字的渐隐(透明度的变化)4、 简单的动作设置(stop)五、 小结 第三课 基本工具的使用教学目标:1、要求学生掌握渐变工具、多角星形工具、墨水瓶工具、文字工具的使用。2、要求学生掌握修改菜单中的位图、元件、形状的菜单项。3、掌握如何制作基本图形:圆环、星星、月亮、太阳、空心文字、门、窗、建筑物。4、掌握位图的导入及矢量图的转换。教学重点:基本图形的制作;如何导入和转换图片。 教学过程:一、 复习巩固1、 完成上次的作业(哭脸变笑脸的的例子和转动的圆环)上传作业(新的FTP帐号的使用,要求上传原文件)。二、 新课引入思考一下这个圆环是怎么做的?(实例1)分析:1、 我们可以用上节课讲的大圆里画小圆的方法来完成,不过可能觉得还是有些麻烦的,上节课是为了特殊的渐变效果才用那种方法的,现在再介绍另一种方法:2、 关键步骤选择圆形工具,边线设置为七彩色,线条粗细调节好(要做成一个环,数值比较大),填充色设为白色;选中圆环,修改形状线条转为填充色;墨水瓶工具填充线条;注意点:修改形状线条转为填充色,否则无法实现(会把七彩色盖掉)三、 实例教学1、多边形工具的使用(实例2)太阳的制作主要步骤:选择矩形工具下面的小箭头,选择多边形工具,在选项中进行设置,样式:星形边数10星形顶点大小0.5(数量越小就越尖)可以具体演示两种效果,让学生比较掌握;填充色设为黄色渐变(渐变工具的再一次复习巩固);画一个深黄色的圆,在上面画上眼睛和嘴(变形工具的使用复习)有时间的同学自己创作画月亮(实例3)几点注意:月牙形的绘制;墨水瓶工具的填充线条3、 综合实例制作(实例4)分析:整个动画分为三个主要部分(星星、高楼和汽车),一个个来制作星星影片制作:首先,绘制一个星星(图形元件),主要步骤同多边形的绘制;再建立一个影片元件,名为闪动的星,注意区别影片元件和图形元件(参看足球的转动),让学生注意观察标记不一样记住一句口诀:元件可改变颜色、透明度、大小等,都不会改变元件本身(可通过星星的制作具体演示)关键步骤:画好星星后,新建一个影片元件,改变星星的透明度作一个补间动画,即为星星的闪烁;复制一个影片,然后在此基础上修改,上一个是由亮到暗,这一个就是由暗到亮,这样可心使星星看起来闪动自然些;星星这个影片做好后,让学生动手做星星。建筑物的制作:新建一个元件,画一个褐色填充黑框的房框再建一个元件,画一个白色填充黑框的窗户,通过复制粘贴,做成4个窗口。然后选中4个窗口运用修改对齐顶端对齐和宽度均匀分布,使4个窗口排列整齐。通过复制(按CTRL拖动),画好多排多列窗口,一列选中调整对齐。其他几列操作也同。选中所有窗口,按SHIFT,不选外框,然后把窗口设为灰色,再选几个设为黄色(以上的修改都是元件的修改运用)另外一幢楼也是复制,然后进行修改,同样用了元件的修改。这个制作要特别注意的是对齐工具的应用。回到场景中,星星一层,高楼一层,再另换一层,画路基(直线工具)要注意视觉上的真实感,按照路基的倾斜度调整高楼的形状。汽车的制作:主要是图片的转换新建一个元件,导入汽车的图片,把位图转换为矢量图;对图片进行处理,删掉白色的部分;回到场景中,汽车也新建一层,然后就做汽车的补间动画,使汽车开动起来。小结:1、 多边工具的使用2、 元件的属性修改应用(包括大小、颜色和透明度等)3、 对齐的使用4、 位图转为矢量图第四课 直线运动和绘图工具教学目标:要求学生掌握直线运动的补间。2、掌握实例的编辑修改。3、掌握铅笔工具及钢笔工具。4、制作夜色中行驶的汽车、动感片头的制作教学重点:教学重点:铅笔、钢笔工具的灵活使用要求学生掌握直线运动的补间。2、掌握实例的编辑修改。3、掌握铅笔工具及钢笔工具。4、制作夜色中行驶的汽车、动感片头的制作教学重点:教学重点:铅笔、钢笔工具的灵活使用教学过程:内容回顾 在上节课中已经完成了动画的一部分,星星的制作相信大部分同学已经学会了,接下来一部分同学还没完成高楼的制作,我们说要注意对齐工具的运用。出现的问题在画楼的时候很多同学都出现这样的问题,楼不能改变,这主要是元件没建好,一般是要有三人元件,一个是窗户,一个是房框,还要一个就是两者结合的楼。这样改变的时候其实是改变房框的形状。二、 进一步完成实例1、 汽车的运动这里主要掌握知识点是位图转化为矢量图(修改位图转换位图为矢量图),把白色的部分删掉,把汽车放到场景中,制作汽车的运动。主要要注意起点和终点关键帧的设置。2、 路面、一些线的绘制主要掌握钢笔、铅笔工具等绘图工具的使用方法有多种,老师教的只是其中一种,大家都可以根据自己对绘图工具的使用,来完成各种绘制。路面的绘制可以先画一个矩形(无边,灰色填充),然后用部分选取工具改变,使成为自己想要的范围线的绘制主要是中间一条灰色的线,有两种方法方法一由于并不要求很精确,可以先画完直线,然后再用橡皮工具擦掉中间不要的部分方法二可以把线条形式改为虚线,在自定义处可以进行修改(前面一个数值代表实线的长度,后面的表示中间空的地方的长度,一般为35,8)3、 画完这些线后,我们可以来看一下汽车是否沿着线开,可以根据线的倾斜度,调整一下汽车的起点和终点位置。三、 实例标志动画的制作1、 先画静止的画面(实例)分析:主要分为三部分边、文本和图形边的绘制比较简单,让学生自己完成;字母的输入也不难,主要是设置多种字体,这里为三种,可以根据自己的喜好,任意设置三种字体,同时可以调整其大小。主要是图形的绘制菱形的绘制只要画好一个矩形,然后旋转一下就可以了关于旁边一个无规则图形的绘制,主要应用钢笔工具,来画出自己所想要的形状2、 让标志动画动起来(实例) 我们做每个动画之前先要对这个动画进行分析,哪些是动的,哪些是静的,动的又是怎么动的?(回想一下以前学过的一些动画形式,到这里应该怎么做)宗旨:不管用了什么方法,只要把效果做出来就好,同学们可以把自己所学的东西融会贯通,方法不是只有一种,老师介绍的方法是比较常用的,并不一定是最好的,大家可以通过多动手,或许就会发现更好的方法。学多了就会灵活运用,举一反三了!我们仔细观察动画有几层,一般就是要做几个运动第一, 边是静止不动的,因此我们只要画好放在那里就行第二, 按动画动起来的顺序来看,菱形是最先动的,主要透明度的改变和旋转,这个并不难,学生应该已经掌握了,稍加分析即可。第三, 第二个图形在菱形还在动的时候就出现了,所以要在菱形变化有中间过程中开始做动画,主要是透明度有改变,后阶段是有和无之间的转变,主要通过插空白帧来实现。第四, 字母J是从上往下运动的,字符串esting,是从右往左运动的,还有co ltd则是和上面的图形一样,在有无之间的转变,方法同上。到些,我们的动画基本就完成了,从中可以发现其实动画并不难,要通过我们的分析以及创造力来完成精彩的动画,我们在做的时候可以充分发挥自己的创造力,比比看谁的动画做得最精彩!四、 小结1、学会绘图工具的使用(直线和钢笔等工具)2、运动的几种基本形式的综合运用第五课 文字特效制作教学目标:1、复习巩固测试题。2、掌握几类文字特效的制作。教学重点:各类文字效果的制作教学过程:一、 测试分析根据上次考试的具体情况进行小结点评1、 先说明一下这次考试的概况,总的来说大家完成得都还不错,这次的题目并不难,基本上都是最基础的,而且还都讲过的,大部分同学都只可以独立完成。大家起点都差不多,只要肯努力,一定可以学好的,入门很快,进一步提高要靠自己,学得快的同学要不断努力,一定能出成绩。2、 存在的一些问题:小部分同学形状渐变还没掌握,可个别提问;大部分同学侧面的调整做得不够好,细心调整即可;个别同学星形变形不自然,原因是星形的边数问题,做的时候要看清要求,仔细研究;注意生成swf文件(CTRL+ENTER);要注意层的命名,养成良好的习惯 。3、 表扬一些同学,并展示一下他们的作品(实例四个)二、 文字特效制作实战1、 阴影字的制作(实例1)技术分析:阴影字分析主要为两层,一层是文字层,一层是阴影层,且阴影层在文字层下面一层;阴影层就是文字层的复制、变色及变形主要步骤: 新建一层,打入文字FLASH;再建一层,复制粘贴;(CTRLSHIFTV就是原位置的粘贴);颜色和形状的调整2、 浮雕字的制作(实例2)技术分析:原理同阴影字的制作,分几层,通过颜色调整,做出浮雕效果3、 打字效果的制作(实例3)技术分析:文字要一个个出来,可以考虑用逐帧动画(请注意与补间动画的区别:补间动画是软件自动生成的)主要步骤:先新建一层,导入背景图片;再建一层,一共有21个文字,插入21个关键帧(F6);在每一个关键帧处设置文字的个数,根据字打出来的效果,每帧依次多一个字。4、 五彩旋转文字(实例4)技术分析:文字的五彩填充,文字的旋转与缩放主要步骤:新建一个元件,两次打散后,用七彩色填充;建立一个动画,注意缩放和旋转的设置学生可自己练习用中文字做五彩旋转文字,效果更明显些。5、 光线字的制作(实例5)主要适用于掌握程度较好的学生技术分析:文字的光线效果的绘制和元件的透明度的变化效果主要步骤:新建一个元件,一个打散状态的字母和光线的效果,用直线绘制或者变形工具;在一层中设置透明度的变化(由浅到深再到浅的过程);其余做法同,为加强效果,要注意另外层的字母ABC的设置,一共有六层6、 残影文字的制作(知识拓展)主要是动作快的学生自己探索制作提示:主要要几层文字的叠加效果,(每层文字的透明度设置不同,形成残影效果)每层文字都设置成旋转动画,只不过开始有先后顺序,以致形成残影效果第六课 引导线的制作应用教学目标:1、复习掌握几类文字特效的制作(包括发光字和残影效果)2、了解引导线的概念3、学会用引导线制作简单动画教学过程:一、 复习掌握文字特效1、 大概说一下作业批改情况2、 发光字体的制作 大部分同学把发光字体的动画过程都做出来了,说明大家对这部分掌握得还可以,还有同学没懂的及时问。大部分同学的共同点是字母没做好,上次说的矩形工具的微调整是一种方法,我们也可以用直线工具来画,然后用线性渐变填充。这样做出来的效果比较好,不会出现一些阴影被遮盖的现象,这是同学们最要注意的问题。当然也有个别同学做得比较好。让学生把发光字体做完并上传。3、 拓展题分析(实例)在讲这前,先给学生10分钟左右的时间自学,看看自己动手能否做出来,然后再讲解,再让学生完成!在预习方面,同学们可以先看我的例子,自己想想应该怎么做,如果不会再仔细研究一下我的教案,不要急着问别的同学,思考过后再问,再听,效果会好不少。残影效果的制作分析:影子有几个就是有几层,影子的出现就是每层元件的出现时间不同,即每层往后退一帧,残影渐渐变淡,就是每层的元件透明度的逐渐降低。主要步骤:建立一个元件1,两次打散后,用七彩色填充;复制元件,命名为2,在原来的基础上用墨水瓶工具描白边;第一层放入元件1,完成补间动画,顺时针,1次左右;第二层第二帧放入元件2,透明度设为85%, 动画同上;同方法建层作动画,注意每层第一帧往后退一帧,元件透 度依次降低,一般10层左右;注:在做新一层的时候不用重新拖入元件,可以用原位置复制元件(CTRL+SHIFT+V),然后再修改元件的透明度即可!4、 对于基础比较好的同学在全部完成的基础上,可以先预习下节课引导线的内容,也可以做一些拓展练习!二、 引导线的制作应用:1、 新课导入:(实例1)先看实例,小球的 无规则运动分析,其实小球是按一定的路径运动的,这个路径是不可见的,但是能引导小球的运动,这就叫做引导线,其所在的层叫引导层(在运行时不可见)主要步骤:新建一层引导层,用铅笔工具画任意不封闭曲线,就是运动路径新建一个元件,画个小球,作为一个运动对象再建一层,把小球拖来,第一帧把小球的圆心放到曲线的起点(会自动吸附),在30帧左右插关键帧,把小球的圆心放到曲线的终点,这就是小球运动的起始点和终点注:要使小球沿着引导线运动,一定要在起点和终点位置,使小球吸附在引导线上,否则不会按引导线运动!2、 学生能力拓展完成快的同学可完成拓展练习1,层的原理类似于上次的残影效果制作3、 引导线的初步应用(实例2)技术分析:树叶的自由飘落其实就是运用了引导线的知识,树叶的飘落路径就是引导线的路径主要步骤同上一题,要注意树叶的绘制可用直线工具加上任意变形即可。动作快的同学可完成拓展练习2,注意:只要在上题的基础上多加几个层,作与上题一样的引导层即可,当然为了省时方便,可把树叶飘落作为一个影片剪辑,然后一个个拖到场景中即可,当然也要稍注意时间先后。三、 引导线的进一步应用1、 骑山车(实例3)技术分析:车子的运动就是按路径的运动,山路就是路径主要步骤:新建一个元件,用画图工具画好车和人画好背景,包括山路画引导线,只要复制已画好的山路即可(同路就是白色的线条)把车的元件拖到场景中,起点和终点的设置对齐同上在动画设置中选中“调整到路径”,车子才会比较自然地动,这是本例制作的关键!2、 动作快的同学可以进一步制作山车,可以让车轮动起来!(拓展练习3)简单提示:画好车轮动画设置为旋转即可!四、 引导线的提高应用(拓展练习4)主要是针对基础比较好的同学,字母就是引导线,要注意中间要断开,才能动起来,文字层用逐帧动画做(原理类似于以前做过的打字效果),才有字是写出来的感觉,以后我们学了遮照层就不会这么麻烦了!第七课 按钮的制作一教学目标:1、复习掌握引导线的应用2、介绍按钮的作用3、学会按钮的简单应用教学过程:一、 复习掌握引导线的应用1、复习上节课的例子,提出一些完成过程中的问题山坡的曲线的画法可用钢笔工具来画,具体演示下画法;多片树叶下降,可用两种方法,一是使用影片剪辑,原理类似于以前学过的闪动的星星。还有一个方法是在引导层中可画多条引导线,引导层下面的图层只要在虚线中,均可被引导线引导。2、复习上次课的引导线,主要通过实例来巩固(实例1)技术分析:小球的跳动就是引导线(当然也可用以前的动画,多创建几个补间也可),猫的变化就是两张图片的变化主要步骤:先完成管的绘制,要注意前后面的分层,否则填充就会出问题,然后再完成阴影面的制作;画好引导线,为折线形式,红色小球沿引导线运动;猫的两种状态(睁眼和闭眼)小球没砸到时睁眼,快砸到时闭眼且后退(用交换元件做可保持位置不变)拓展练习蝴蝶飞舞(拓展练习1)提示:挥动翅膀的蝴蝶作为一个影片剪辑,在这个影片剪辑中,把素材中的图片导入,每张图片一帧,表示蝴蝶的不同状态,其中要注意每张图片位置要对齐,方法有两个,一个是打开时间轴的“查看多个帧”,另一个是交换元件3、圆环的制作(实例2)为了进一步巩固引导线的动画,还要讲一个新的知识点,即小球绕圆环运动技术分析:同样应用引导线做,关键是圆环的引导线是非闭合曲线,小球才能运动,技巧就是用橡皮把圆环打开缺口。主要步骤:先建一层,画一个圆(无填充)添加一层引导层,把圆复制,然后把引导层中的圆用橡皮等工具打开缺口,使圆环成为一个非闭合曲线(物体的运动是遵循就近原则,如果不断开,只会作就近小半圈的运动)小球的始末状态的设置,第一帧在缺口的一端,最后一帧在缺口的另一端。思考:地球绕着太阳转(椭圆形轨道同上例)拓展练习中的玩具火车的运动(单轨和8字形轨道,有兴趣的同学可以自己尝试一下) 二、 按钮的制作:1、基本按钮的制作(实例3)插入新元件,元件类型为按钮,即可见如下界面一般在以上四种状态下放置四个不同的元件,即可制作出一个按钮效果。下面以变形按钮为例介绍制作步骤。插入新元件,元件类型为按钮,并命名该按钮为“变形”单击选中“弹起”,并绘制一个蓝色长方形单击选中“指针经过”,按F6,并删除蓝色长方形,绘制一个绿色长方形单击选中“按下”,按F6,并删除绿色长方形,绘制一个红色长方形做完后查看效果,并据此讲解四种状态具体表现,其中第四个“点击”在此并不能体现出来,以后具体碰到再说,先掌握前面三种状态设置2、用文字、图片、图形等作按钮(实例4)在实例3的基础上演示文字作按钮,即在上面蓝色长方形的位置替换成文字就是文字按钮,演示一下即可,其中“点击”如果是实心的区域,比较容易选中实例4分析:主要原理同上例,其中的水晶球可以自己画,也可以用提供的图片,同时也说明了按钮也可以用图片来做!三、按钮的进一步制作应用1、 简单的动态按钮(实例5)技术分析:小球是在鼠标放在按钮时下落的,所以动作发生在按钮四种状态的“指针经过”状态,小球下落又是个运动状态,所以在“指针经过”状态放的不是图片之类的,而是一个影片剪辑(相当于一个小电影)主要步骤:新建一个影片剪辑,在里面做小球下落并且透明度改变的动画新建一个按钮元件,在“弹起”状态中画上一个红色的长方形,在“指针经过”状态中放入我们已经做好的关于小球运动的影片剪辑2、 动态按钮引申(实例6)技术分析:这个动态按钮的制作基本原理同上例,只是按钮元件的第一种状态中是空帧,就是没放上去时不显示,也就是我们所说的隐形按钮,拖入到场景中按钮元件呈现出半透明状态。3、 动态按钮综合实例应用(拓展练习二)实例演示:礼花的绽放效果(鼠标点击,礼花绽放)技术分析:鼠标点击引发的事件,即在按钮的,即为热区,按钮的动作就在这个热区触发。由于是鼠标点击下去才有礼花绽放的效果,所以在礼花绽放的影片剪辑中,第一帧是放入已做好热区的按钮。第二帧开始才是礼花绽放的动画,就是礼花这个图形的放大动画。然后在帧上及按钮上加上简单代码即可。主要步骤:新建一个按钮元件,在第四种状态“点击”中画一个实心区域(这里可画一个白色的长方形)新建一个影片剪辑,第一帧放入刚做好的按钮,因为不点击的时候事件(礼花绽放)不触发,第一帧加入动作stop,同时按钮的动作是点击就触发礼花绽放的事件,因此在按钮上加上动作on(press)gotoandplay(2);这个动作语句可在动作面板中选择输入,不用自己输入(自己打入容易错,可用脚本校对)on(press)gotoandplay(2);意思是按下按钮,开始第二帧动作在第二帧开始礼花的变化,导入礼花图片并转化为元件,然后作放大的动画最后在场景中拖入已经完成的影片剪辑,注意在铺满整个场景,点击的时候才能保证无论点哪里都有礼花绽放,比较逼真些。铺满时可用多次复制粘贴。 思考:鼠标放上去礼花绽放怎么做?(拓展练习三)提示:即在按钮的指针经过中放入影片元件小结:这节复习了引导线,以及新学了按钮的制作,在按钮的制作中要掌握以下几点:按钮的四种状态的设置,明白各个状态的具体表现形式学会用文字、图片等作按钮学会动态按钮的制作,主要是影片剪辑的应用以及一些简单的动作第八课 按钮的制作二教学目标:1、复习掌握简单按钮的应用2、介绍一些简单的动作语句3、学会按钮上的一些简单语句的应用教学过程:一、 复习掌握简单按钮的应用1、 复习简单动态按钮的制作主要通过一些实例的制作来巩固练习先讲一下上节课存在的问题:在动态按钮中,我们说要制作一个影片剪辑,这个按钮才会动起来。有几个同学另外的都完成了,但是还是不会动,原因就是大家在制作元件的时候选了图形而不是影片剪辑,所以才使动画不动。我们只要把元件的类型转为影片剪辑就可以了,当然要重新放入到相应的地方才行,不然还是原来的那个。(可以通过实例来讲解,以后学生在做的过程中碰到这类问题就不用重新做过了,在原来的基础上稍作一下改动就可以。)动态按钮巩固实例一技术分析:结合上周课讲的动画和按钮结合来完成第一个按钮为按下去后动画(字向两边扩散,并变淡)的出现;第二个按钮是鼠标放上去后动画(字变大并变淡的效果)的出现。大家可以根据平时所学的动画知识,应用到按钮中,可以充分发挥大家的想象力,作出各类按钮,这些按钮在我们以后各式网站的制作,特别是一些比较有特色的网站的制作中用的较多。2、 综合按钮的制作(实例二)技术分析:主要是背景的绘制以及按钮的动画(按钮放上去扩散效果)制作主要步骤:背景黑条的绘制,画两个圆角矩形叠加,删除重叠部分即可;小球的绘制,黑球上放白球,上面再写上字母e;按钮的制作,扩散效果的制作,小球填充效果第一帧用调色工具缩到最小,最后一帧用调色工具调到适当效果,创建变形动画;按钮的弹起状态中放入元件大圆和小圆以及数字,在指针经过中放上刚完成的扩散效果动画。(动画只要一次,用stop动作)在此要注意按钮中的分层,原理同普通的分层,我们可以把扩散动画放在下面一层,透过大圆展现出来。按钮的小圆动画制作,绿色变色小球为背景,黄色的曲线作水平转动动画 二、简单动作介绍(按钮制作实例源文件)1、复习上节课的按钮,做出礼花实例三,比较发现问题,引入动作语句的应用2、on动作命令 下面我们就详细地向大家介绍一下这八种事件的使用。 1、press 在鼠标指针经过按钮时按下鼠标按钮。单击press,然后选择动作语句,双击【全局函数】|【时间轴控制】中的play 命令。 完整的action是: on(press) /设定鼠标事件为按下,然后执行大括号里面的语句。 play(); /按钮响应后执行play(播放)动作 press动作 当然,在大括号里面还可以用其他的语句,比如说,gotoAndPlay(yourframe); /点击按钮后,就会从你设置的帧播放。 2、 release 在鼠标指针经过按钮时释放鼠标按钮。单击选择release然后与第一个事件相同加入play命令。完成的语句如下: on(release) /当鼠标按下释放的时候,执行下面的语句动作。 play(); /按钮响应后执行play(播放)动作。 release动作 可以看到,当鼠标左键按下按钮的时候,并没有激发播放动作,而是当鼠标左键放开的时候,执行了播放动作。这也是与“press”事件不同的地方。 3、releaseOutside 当鼠标指针在按钮之内时按下按钮后,将鼠标指针移到按钮之外,此时释放鼠标按钮。 添加语句的方法同上。完整的语句如下: on (releaseOutside) /当鼠标在按钮外部释放的时候执行下面的语句。 play(); /按钮响应后执行播放动作。 releaseOutside动作 通过这个例子我们知道,当鼠标左键在按钮上按住并移动到按钮以外的地方放开后,触发了按钮的动作。这是一个具有非常想象力的事件,大家可以利用on的这个事件来制作游戏。 4、rollOver鼠标指针滑过按钮区域。制作方法同上,完整的as语句为: on(rollover) /当鼠标滑动到按钮上时执行下面的动作。 play(); /按钮执行播放动作。 rollOver动作 当鼠标指针从按钮上滑过的时候,动画就开始执行播放动作了,而不需要点击它。我们可以利用on的这个特点来制作一些图示板,非常简单有效。5、rollOut 鼠标指针滑出按钮区域。制作方法同上,完整的as语句为: on(rollOut) /当鼠标滑动到按钮上并离开时执行下面动作。 Play(): /按钮响应播放动作。 rollOut动作 滑离与滑过并不是相同的,滑离是指鼠标滑动到按钮上并离开以后开始响应,而滑过是指只要鼠标滑到按钮上,就开始执行动作。6、dragOver 在鼠标指针滑过按钮时按下鼠标按钮,然后滑出此按钮区域,再滑回此按钮。完整的as是: on(Drag Over) /当鼠标拖过的时候执行下面的动作。 play(); /执行播放动作。 dragOver动作 拖过的效果是在按钮上点击并按住鼠标不放,移出按扭区,再移回按钮上触发的事件。7、dragOut 在鼠标指针滑过按钮时按下鼠标按钮,然后滑出此按钮。完整的as是:on (dragOut) /当鼠标拖离按钮时执行下面的动作。play(); /执行播放动作 dragOut动作 拖离与拖过有所不同,只要在按钮上按住鼠标左键然后移动到按钮外就会响应。与滑离的区别在于拖离需要按住鼠标左键。8、keyPress (key) 按下指定的键。对于此参数的 key 部分,需指定键控代码或键常量。我们在(“key”)中键入“p”。完整地as语句为: on (keyPress p) /当按下键盘中的“p”健时执行下面的动作。 play(); /执行播放动作 3、结合动态按钮综合实例应用来说明上述的动作语句(实例四)实例演示:礼花的绽放效果(鼠标点击,礼花绽放)技术分析:鼠标点击引发的事件,即在按钮的,即为热区,按钮的动作就在这个热区触发。由于是鼠标点击下去才有礼花绽放的效果,所以在礼花绽放的影片剪辑中,第一帧是放入已做好热区的按钮。第二帧开始才是礼花绽放的动画,就是礼花这个图形的放大动画。然后在帧上及按钮上加上简单代码即可。主要步骤:新建一个按钮元件,在第四种状态“点击”中画一个实心区域(这里可画一个白色的长方形)新建一个影片剪辑,第一帧放入刚做好的按钮,因为不点击的时候事件(礼花绽放)不触发,第一帧加入动作stop,同时按钮的动作是点击就触发礼花绽放的事件,因此在按钮上加上动作on(press)gotoandplay(2);这个动作语句可在动作面板中选择输入,不用自己输入(自己打入容易错,可用脚本校对)on(press)gotoandplay(2);意思是按下按钮,开始第二帧动作在第二帧开始礼花的变化,导入礼花图片并转化为元件,然后作放大的动画最后在场景中拖入已经完成的影片剪辑,注意在铺满整个场景,点击的时候才能保证无论点哪里都有礼花绽放,比较逼真些。铺满时可用多次复制粘贴。三、小结注 意 在给动画作品添加按钮的时候应该放到单独一层,这样便于修改。 提 示 on为按钮上的动作,所以我们必须首先要选中按钮,以后才可以添加on语句。有的朋友在论坛里面提问,“为什么我的on为灰色不可选状态?”原因就是你没有选中按钮。 技 巧 在一般flash作品中,大家不会有意区分这些on的功能的,一般采用默认的语句。如果没有特殊说明,你使用了拖离,滑离等事件来制作“replay”按钮,会让人们摸不着头脑的。 试一试 我们了解了on得这么多的功能,利用这些功能可以轻易的制作出flash课件,flash游戏里面的效果,大家不妨试一试。 分 析on语句的功能与按钮息息相关,有按钮的地方一定会有on语句的使用。而有flash作品的地方,就会有按钮的出现,所以说on的重要作用不可忽视。今天向大家详细地介绍了on的各种功能,我们就可以结合按钮自身的特点,发挥他们的功能。第九课 测试与遮照一教学目标:1、测试学生引导线与按钮掌握情况2、介绍一遮照的基本概念3、学会一些简单遮照效果的制作教学过程:一、 十月份达标测试1、 主要内容为引导线与按钮的制作检测,考试题目当堂下发,时间是一节课(40分钟)2、 进行简单分析二、 课前热身1、 通过回想以前做过的一些动画,把动画形式归纳如下: 直线动画(位置的改变,即为补间动画) 曲线动画(引导线) 逐帧动画 旋转动画(元件) 透明度改变动画(元件) 形状动画(非元件,打散状态) 缩放动画(元件)2、 几种动画形式区分(实例)(用一些例子说明,让学生巩固基本的动画形式)一般来说,我们的FLASH动画就是分为这几种形式,稍微复杂一点的动画无非就是这几种动画的结合,只要掌握了这几种基本动画,综合应用只要组合就可以了。三、 遮照的制作1、 新课的引入 观察教案上的TOP,思考:FLASH这几个字是一个会动的图片填充字效果。怎样才能动起来呢?这就是我们今天要讲的遮照。我们说的遮照又是一种新的层形式,以前是引导层,现在又有了遮照层。遮照层相当于是一个窗口,遮照层下面的被遮照层上的内容就是透过这个窗口显现出来的。也就是说这个窗口是什么形状的,能看到的内容也是同窗口形状,在窗口以外的部分就无法透出来。2、 具体演示教案上的效果制作3、 遮照的应用:电影字幕的效果制作(实例一)在看每个遮照动画时首先分析动画的是哪个层(遮照层还是被遮照层?)技术分析:文字透出彩色,即为彩色是背景,通过文字透出来,因此要做动画的文字上移是做窗口的,即为我们所说的遮照层,同时我们的背景就是被遮照层。主要步骤:做好一个影片剪辑元件,内容为文字的上移;做好一个图形元件,内容为渐变的一个填充色;在场景中建好两个层,分别为遮照层和被遮照层(右键层,选择遮照层,下面一层会自动变为被遮照层);把各个元件放到相应的位置:影片剪辑元件(文字上移)放在遮照层,图形元件(渐变的填充色)放在被遮照层。思考:完成的同学完成练习一4、基础较好的同学在完成上面遮照的例子后,可以思考下下面这些效果用遮照怎么做?作为下周课的预习思考。练习1 练习 2 练习3四、 遮照应用小结:我们在做遮照的时候要学会分析,搞清楚以下几个问题: 分析好哪一层是做“窗口”的,哪一层是通过窗口透出来的,哪一层是普通层,作为“底”而存在的? 动画是在遮照层还是被遮照层的? 动画又是哪种动画? 我们需要创建哪几个元件?分析完后倒着做,先做好最基本的几个元件,注意元件类型(图形、按钮还是影片剪辑?)再建好层,注意层类型(遮照、被遮照还是普通层?),最后把最好的元件拖入到相对应的层中即可。第十课 基础知识复习及遮照应用二教学目标:1、 概括复习前面所学过的一些基础知识2、按钮巩固练习3、遮照基本应用复习4、学会一些稍复杂遮照效果的制作教学过程:一、 测试分析及新知识的补充学习1、 每位同学可以根据测验的点评,作好相应的订正工作2、 主要存在问题(详见点评信息)其中白色背景还可以通过分离后有套索工作的魔棒去掉3、 详细讲一遍第二题按钮的制作过程,要求每位同学完成,并上传(实例一)技术分析:按钮两种状态指针经过和按下,指针经过处是小棒的旋转,按下是静止的。主要步骤:首先分析共有几个元件(圆、有边的圆、小棒、静止的小棒组合、旋转的小棒组、一个按钮);静止的小棒组合的画法:变形中设好角度后运用复制加以应用,就画好一周的小棒;在影片剪辑元件中做好小棒的旋转;把做好的元件拖到按钮相应的地方,旋转的小棒放入经过状态中,静止的放入按下状态中。引导学生自己分析要做些哪些元件,包括哪些动画,然后按照学生的思路一步步做具体的操作演示。学生自己完成,教师个别交流4、 按钮实例完成后,补充一些按钮上的简单动作(实例二)动作主要分为两种

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论