11-12课按钮的制作二

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

2、后执行播放动作。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动作当然，在大括号里面还可以用其他的语句，比如说，gotoA ndPlay（youframe）; /点击按钮后，就会从你设置的帧播放。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）gotoa ndpla y（ 2）;意思是按下按钮，开始第二帧动作 在第二帧开始礼花的变化，导入礼花图片并转化为元件，然后作放大的动画 最后在场景中拖入已经完成的影片剪辑，注意在铺满整个场景，点击的时候才 能保证无论点哪里都有礼花绽放，比较逼真些。铺满时可用多次复制粘贴。三、小结注 意一一在给动画作品添加按钮的时候应该放到单独一层，这样便于修改。提 示一一on为按钮上的动作，所以我们必须首先要选中按钮，以后才可以添加on语句。有的朋友在论坛里面提问，“为什么我的on为灰色不可选状态？”原因就是你没有选中 按钮。技巧在一般flash作品中，大家不会有意区分这些on的功能的，一般采用默认的 语句。如果没有特殊说明，你使用了拖离，滑离等事件来制作“ replay ”按钮，会让人们摸 不着头脑的。试一试 一一我们了解了 on