11-12课按钮的制作二.doc

《11-12课按钮的制作二.doc》由会员分享，可在线阅读，更多相关《11-12课按钮的制作二.doc（4页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。

1、第 周 第 课时 _月_日(星期_) 累计_个教案课题课型新授课教 学 目 标教学重点教学难点教学方法与手段板 书 设 计第11-12课时按钮的制作二1、复习掌握简单按钮的应用2、介绍一些简单的动作语句3、学会按钮上的一些简单语句的应用简单的动作语句的使用讲练结合动作语句的应用1、 press 在鼠标指针经过按钮时按下鼠标按钮。play(); /按钮响应后执行play（播放）动作 on(release) /当鼠标按下释放的时候，执行下面的语句动作。 play(); /按钮响应后执行play（播放）动作。on (releaseOutside) /当鼠标在按钮外部释放的时候执行下面的语句。 pla

2、y(); /按钮响应后执行播放动作。 on(rollover) /当鼠标滑动到按钮上时执行下面的动作。 play(); /按钮执行播放动作。 on(rollOut) /当鼠标滑动到按钮上并离开时执行下面动作。 Play(): /按钮响应播放动作。 on(Drag Over) /当鼠标拖过的时候执行下面的动作。 play(); /执行播放动作。 on (dragOut) /当鼠标拖离按钮时执行下面的动作。play(); /执行播放动作 on (keyPress p) /当按下键盘中的“p”健时执行下面的动作。 play(); /执行播放动作 教 学 过 程 一、 复习掌握简单按钮的应用1、 复习

3、简单动态按钮的制作主要通过一些实例的制作来巩固练习先讲一下上节课存在的问题：在动态按钮中，我们说要制作一个影片剪辑，这个按钮才会动起来。有几个同学另外的都完成了，但是还是不会动，原因就是大家在制作元件的时候选了图形而不是影片剪辑，所以才使动画不动。我们只要把元件的类型转为影片剪辑就可以了，当然要重新放入到相应的地方才行，不然还是原来的那个。（可以通过实例来讲解，以后学生在做的过程中碰到这类问题就不用重新做过了，在原来的基础上稍作一下改动就可以。）动态按钮巩固实例一技术分析：结合上周课讲的动画和按钮结合来完成第一个按钮为按下去后动画（字向两边扩散，并变淡）的出现；第二个按钮是鼠标放上去后动画（字

4、变大并变淡的效果）的出现。大家可以根据平时所学的动画知识，应用到按钮中，可以充分发挥大家的想象力，作出各类按钮，这些按钮在我们以后各式网站的制作，特别是一些比较有特色的网站的制作中用的较多。2、 综合按钮的制作（实例二）技术分析：主要是背景的绘制以及按钮的动画（按钮放上去扩散效果）制作主要步骤：背景黑条的绘制，画两个圆角矩形叠加，删除重叠部分即可；小球的绘制，黑球上放白球，上面再写上字母e；按钮的制作，扩散效果的制作，小球填充效果第一帧用调色工具缩到最小，最后一帧用调色工具调到适当效果，创建变形动画；按钮的弹起状态中放入元件大圆和小圆以及数字，在指针经过中放上刚完成的扩散效果动画。（动画只要一

5、次，用stop动作）在此要注意按钮中的分层，原理同普通的分层，我们可以把扩散动画放在下面一层，透过大圆展现出来。按钮的小圆动画制作，绿色变色小球为背景，黄色的曲线作水平转动动画二、简单动作介绍（按钮制作实例源文件）1、复习上节课的按钮，做出礼花实例三，比较发现问题，引入动作语句的应用2、on动作命令 下面我们就详细地向大家介绍一下这八种事件的使用。 1、press 在鼠标指针经过按钮时按下鼠标按钮。单击press，然后选择动作语句，双击【全局函数】|【时间轴控制】中的play 命令。 完整的action是： on(press) /设定鼠标事件为按下，然后执行大括号里面的语句。 play();

6、/按钮响应后执行play（播放）动作 press动作 当然，在大括号里面还可以用其他的语句，比如说，gotoAndPlay(yourframe); /点击按钮后，就会从你设置的帧播放。 2、 release 在鼠标指针经过按钮时释放鼠标按钮。单击选择release然后与第一个事件相同加入play命令。完成的语句如下： on(release) /当鼠标按下释放的时候，执行下面的语句动作。 play(); /按钮响应后执行play（播放）动作。 教 学 过 程 release动作 可以看到，当鼠标左键按下按钮的时候，并没有激发播放动作，而是当鼠标左键放开的时候，执行了播放动作。这也是与“press

7、”事件不同的地方。 3、releaseOutside 当鼠标指针在按钮之内时按下按钮后，将鼠标指针移到按钮之外，此时释放鼠标按钮。 添加语句的方法同上。完整的语句如下： on (releaseOutside) /当鼠标在按钮外部释放的时候执行下面的语句。 play(); /按钮响应后执行播放动作。 releaseOutside动作 通过这个例子我们知道，当鼠标左键在按钮上按住并移动到按钮以外的地方放开后，触发了按钮的动作。这是一个具有非常想象力的事件，大家可以利用on的这个事件来制作游戏。 4、rollOver鼠标指针滑过按钮区域。制作方法同上，完整的as语句为： on(rollover) /

8、当鼠标滑动到按钮上时执行下面的动作。 play(); /按钮执行播放动作。 rollOver动作 当鼠标指针从按钮上滑过的时候，动画就开始执行播放动作了，而不需要点击它。我们可以利用on的这个特点来制作一些图示板，非常简单有效。5、rollOut 鼠标指针滑出按钮区域。制作方法同上，完整的as语句为： on(rollOut) /当鼠标滑动到按钮上并离开时执行下面动作。 Play(): /按钮响应播放动作。 rollOut动作 滑离与滑过并不是相同的，滑离是指鼠标滑动到按钮上并离开以后开始响应，而滑过是指只要鼠标滑到按钮上，就开始执行动作。6、dragOver 在鼠标指针滑过按钮时按下鼠标按钮，

9、然后滑出此按钮区域，再滑回此按钮。完整的as是： on(Drag Over) /当鼠标拖过的时候执行下面的动作。 play(); /执行播放动作。 dragOver动作 拖过的效果是在按钮上点击并按住鼠标不放，移出按扭区，再移回按钮上触发的事件。7、dragOut 在鼠标指针滑过按钮时按下鼠标按钮，然后滑出此按钮。完整的as是：on (dragOut) /当鼠标拖离按钮时执行下面的动作。play(); /执行播放动作 dragOut动作 拖离与拖过有所不同，只要在按钮上按住鼠标左键然后移动到按钮外就会响应。与滑离的区别在于拖离需要按住鼠标左键。8、keyPress (key) 按下指定的键。对

10、于此参数的 key 部分，需指定键控代码或键常量。我们在（“key”）中键入“p”。完整地as语句为： on (keyPress p) /当按下键盘中的“p”健时执行下面的动作。 play(); /执行播放动作 教 学 过 程 3、结合动态按钮综合实例应用来说明上述的动作语句（实例四）实例演示：礼花的绽放效果（鼠标点击，礼花绽放）技术分析：鼠标点击引发的事件，即在按钮的，即为热区，按钮的动作就在这个热区触发。由于是鼠标点击下去才有礼花绽放的效果，所以在礼花绽放的影片剪辑中，第一帧是放入已做好热区的按钮。第二帧开始才是礼花绽放的动画，就是礼花这个图形的放大动画。然后在帧上及按钮上加上简单代码即可

11、。主要步骤：新建一个按钮元件，在第四种状态“点击”中画一个实心区域（这里可画一个白色的长方形）新建一个影片剪辑，第一帧放入刚做好的按钮，因为不点击的时候事件（礼花绽放）不触发，第一帧加入动作stop，同时按钮的动作是点击就触发礼花绽放的事件，因此在按钮上加上动作on(press)gotoandplay(2);这个动作语句可在动作面板中选择输入，不用自己输入（自己打入容易错，可用脚本校对）on(press)gotoandplay(2);意思是按下按钮，开始第二帧动作在第二帧开始礼花的变化，导入礼花图片并转化为元件，然后作放大的动画最后在场景中拖入已经完成的影片剪辑，注意在铺满整个场景，点击的时候

12、才能保证无论点哪里都有礼花绽放，比较逼真些。铺满时可用多次复制粘贴。三、小结注 意 在给动画作品添加按钮的时候应该放到单独一层，这样便于修改。 提 示 on为按钮上的动作，所以我们必须首先要选中按钮，以后才可以添加on语句。有的朋友在论坛里面提问，“为什么我的on为灰色不可选状态？”原因就是你没有选中按钮。 技 巧 在一般flash作品中，大家不会有意区分这些on的功能的，一般采用默认的语句。如果没有特殊说明，你使用了拖离，滑离等事件来制作“replay”按钮，会让人们摸不着头脑的。 试一试 我们了解了on得这么多的功能，利用这些功能可以轻易的制作出flash课件，flash游戏里面的效果，大家不妨试一试。 分 析on语句的功能与按钮息息相关，有按钮的地方一定会有on语句的使用。而有flash作品的地方，就会有按钮的出现，所以说on的重要作用不可忽视。今天向大家详细地介绍了on的各种功能，我们就可以结合按钮自身的特点，发挥他们的功能。 教学后记：简单的动作语句的理解较难矾山一中教案模板 第4页 矾山一中教务处制