开启左侧

学习笔记““儿童刻度尺读数练习”

[复制链接]
清灯竹影 发表于 2014-8-17 04:20:45 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
本帖最后由 清灯竹影 于 2014-8-17 04:37 编辑

学习笔记之“儿童刻度尺读数练习”
这篇学习笔记,案例来自《跟着案例学FlashCS5课件制作》作者刘华、廖亮。我先跟着教程的方法做了一遍,实现了预期效果。教程里用了帧循环的方式来完成这个实例。然后我想到,用另一种方法好像要简单些。现在我将制作过程简要说明。

clip_image002.jpg
欢迎大家多发帖,参与讨论,增进彼此了解。

精彩评论3

正序浏览
清灯竹影 发表于 2014-8-17 04:25:18 | 显示全部楼层
在课件设计中,刻度尺是不动的。紫色长方形的起点必须和零刻度线对齐,起点不能有位置移动。下面的四个绿色按钮用于控制长方形的长度,按钮从左到右分别是微退按钮、快退按钮、微进按钮和快进按钮。
使用过程:当单击微退按钮,长方形向右边缩短一毫米,单击微进按钮长方形向右增加一毫米。在快进按钮上按下鼠标左键,长方形的长会持续不断的快速增加,松开鼠标左键,则停止。快退的效果则相反。通过四个按钮配合,可以快速地让长方形定位于某个刻度,从而可以方便的训练儿童在刻度尺上读书的能力。
二、课件制作过程1、制作实例元件(1)、新建图形元件,命名为“刻度尺”,在“刻度尺”元件中,绘制刻度尺图形(参考图一)。刻度线一共有10大格,一共100小格,每小格间隔3像素。制作这个刻度尺并不难,关键在于有点耐心。(2)、新建影片剪辑元件,命名为“可变长方形”在图层一用矩形工具画一个长方形,宽150像素,高22像素,坐标x和y都为0.这里需要特别注意一个“注册点”的问题,改变形状的时候,宽和高都是以注册点为中心的,在这个实例里,目的是长方形向右增加像素,而左边不动,所以注册点应该在影片剪辑的最左边。2、主场景的布置(1)、将主场景图层一命名为“刻度尺”将“刻度尺”元件拖到舞台上合适的位置;(2)、新建图层二,图层命名为“长方形”将“可变长方形”拖动到舞台上放在“刻度尺”元件的上方,并精确的对整齐。(可将舞台放大到300%便于调整对齐)为该影片剪辑元件实例名命名为“cfx_mc”原谅我用拼音……. (3)、新建图层三,图层命名为“按钮”,在该图层第一帧,从公用库拖两个按钮到舞台,各复制一个并水平翻转,一共四个按钮在刻度尺下方排列好。(具体可参照我上传的SWF文件)。为按钮设置实例名,从左到右分别为playt_btn、forwardt_btn、play_btn、forward_btn(4)、新建图层四,命名为“as”至此,主场景布置完毕(可以在再添加一个背景层加入卡通背景图片什么的)。 3、编写代码import flash.events.MouseEvent;import flash.events.Event; play_btn.addEventListener(MouseEvent.CLICK,play_MouseClickHandler);functionplay_MouseClickHandler(event:MouseEvent):void{    cfx_mc.width +=  3;}//以上是微进按钮相关程序。这个很好理解,一个单击事件,每单击一次微进按钮,长方形向右边增加3个像素,也就是前进一格forward_btn.addEventListener(MouseEvent.MOUSE_DOWN,forward_MouseDownHanler);functionforward_MouseDownHanler(event:MouseEvent):void{    cfx_mc.addEventListener(Event.ENTER_FRAME,kuaijin);    function kuaijin(event:Event):void    {         cfx_mc.width +=  3;    }    forward_btn.addEventListener(MouseEvent.MOUSE_UP,forward_MouseUpHanler);    function forward_MouseUpHanler(event:MouseEvent):void    {         cfx_mc.removeEventListener(Event.ENTER_FRAME,kuaijin);    }}//以上是快进按钮相关程序。这是一个嵌套了的事件函数。最外面的一层(请注意大括号的层级关系)是鼠标按下事件——MOUSE_DOWN鼠标按下快进按钮将发生一个事件,这个事件就是ENTER_FRAME,事件源是cfx_mc,也就是说,按下快进按钮,长方形的宽度(向右边)持续不断的增加。接下来是释放鼠标事件MOUSE_UP注意这个事件的事件源是“快进按钮”而且和ENTER_FRAME事件是并列关系,该事件的作用是在快进按钮上释放鼠标的时候删除快进事件。到这里“微进”和“快进”两个按钮的代码编写结束。还需要编写“微退”和“快退”两个按钮的程序。我估计你会说:“麻烦晕过去”。其实不麻烦,把以上“微进”和“快进”程序复制粘贴,然后修改按钮名和函数名就可以了,我已经粘贴在后面,它们的原理和刚才是一样的,只是方向相反,就不再啰嗦又重新说明了。playt_btn.addEventListener(MouseEvent.CLICK,playt_MouseClickHandler);functionplayt_MouseClickHandler(event:MouseEvent):void{    cfx_mc.width -=  3;}//以上是微退按钮相关程序forwardt_btn.addEventListener(MouseEvent.MOUSE_DOWN,forwardt_MouseDownHanler);functionforwardt_MouseDownHanler(event:MouseEvent):void{    cfx_mc.addEventListener(Event.ENTER_FRAME,kuaitui);    function kuaitui(event:Event):void    {         cfx_mc.width -=  3;    }    forwardt_btn.addEventListener(MouseEvent.MOUSE_UP,forwardt_MouseUpHanler);    function forwardt_MouseUpHanler(event:MouseEvent):void    {         cfx_mc.removeEventListener(Event.ENTER_FRAME,kuaitui);    }}//以上是快退按钮相关程序

欢迎大家多发帖,参与讨论,增进彼此了解。
 楼主| 清灯竹影 发表于 2014-8-17 04:32:06 | 显示全部楼层
    在原教程里,作者用的是帧循环的方法

   将课件SWF上传,供学习者参考

刻度尺.swf

9.83 KB, 下载次数: 148

欢迎大家多发帖,参与讨论,增进彼此了解。
 楼主| 清灯竹影 发表于 2014-8-17 04:35:16 | 显示全部楼层
  我不明白为什么在这里排版很不方便,刚才的代码不按照格式来,所以截图上传完整代码,便于阅读

代码截图.jpg
欢迎大家多发帖,参与讨论,增进彼此了解。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

推荐阅读更多+
会员达人更多+
广告位

最新信息

更多+

关注我们:教育技术人

官方微信

官方微博

教育技术热线:

13955453231

学教育技术,上教育技术论坛!

教育技术论坛征稿范围:教育技术应用案例、教程文章、优秀作品等。

Email:sf@etthink.com

Copyright   ©2007-2026  应用思考-教育技术论坛  Powered by©Discuz!  技术支持:且行资源    ( 皖ICP备10014945号-4 )