第11章交互式动画.ppt

第11章 交互式动画,主要内容：,课堂演示讲授时间：2课时,在Flash动画中实现对象拖动操作的方法 startDrag()函数和stopDrag()函数的使用,11.3 对象拖放,【展示任务】,第11章 交互式动画,【知识讲解】,一、startDrag()函数,startDrag（lookcenter：Boolean=false,bounds:Rectangle=null） 作用： 允许用户拖动制定的对象。该对象将一直保持可拖动，知道通过调用stopDrag()方法来明确停止，或直到将另一个对象变为可拖 动为止。在同一时间只有一个对象是可拖动的。 参数： lookcenter：Boolean(default=false)指定是将可拖动的对象锁定到鼠标位置中央（true），还是锁定到用户首次单击该对象时所在的点上（false），默认值为false。 lookcenter：Boolean(default=null)相对于对象父级的坐标的值，用于指定对象约束矩形，默认值为无。,第11章 交互式动画,【知识讲解】,二、 stopDrag()函数,结束startDrag的方法。,第11章 交互式动画,【实例讲解】,任务1：失落的圆明园,在这个任务中，当按下鼠标，就能够拖动一个圆形的观察窗口，松开鼠标，窗口停止；单击放大镜，能够放大观察窗口。, 创建一个新Flash文档，选择【插入】/【新建元件】命令，创建一个“影片剪 辑”类型的元件，名称为“背景” ，单击“确定”按钮，进入元件编辑状态。导入一副背景图片到舞台上。 选择【插入】/【新建元件】命令，创建一个”影片剪辑”类型的元件，名称为 “观察窗” 。在“观察窗”中绘制一个圆形。,第11章 交互式动画,【实例讲解】, 再创建一个“按钮”元件“放大”；导入一副放大镜图片到其舞台上，并添加不同色彩的文字，这样就能够体现鼠标操作的效果。 返回“场景1”中选择“图层1”的第1帧，从库中将“背景”元件拖入到舞台；调整元件实例的大小，使其与舞台大小一致。定义该实例的名称为“back”。 将“放大”元件拖入到舞台左下角，定义实例名称为“big”。并在【时间轴】面板加 “图层2”。 选择“图层2”的第1帧，然后将一副圆明园图片导入到舞台上。再添加一个新的图层“图层3”，选择其第1帧，然后从库中将“观察窗”元件拖入舞台。选择“观察窗”元 件的实例，命名为“view”。,第11章 交互式动画,【实例讲解】, 在“图层3”上单击鼠标右键，弹出快捷菜单。选择“遮罩层”命令，则“图层3”成为“图层2”的遮罩层。这时，【时间轴】面板的两个图层的图标已经发生了变化，同时，舞台上“图层2”的内容只能透过“图层3”中的对象来观看。 选择“图层1”的第1帧，打开【动作】面板，在脚本床后输入代码，用于控制观察窗的拖放。 测试案例，是否达到预期效果。,第11章 交互式动画,【完成任务】,任务：完成“失落的圆明园”,第11章 交互式动画,【课堂小结】,本节主要介绍了怎么在Flash动画作品中实现对象的拖动操作，学习了startDrag ()语句和stopDrag ()语句的使用方法，熟悉了鼠标事件编程的过程和方法。,第11章 交互式动画,【作业】,1在任务中为什么观察窗的颜色可以是任意的？ 2为“失落的圆明园”添加一个按钮，单击能够缩小观察窗。,第11章 交互式动画,本节到此结束！ 谢谢大家！,第11章 交互式动画,