探索F9 As3.0 Preview

Creating clickable and draggable shapes（创建可点击和可拖动的形体）

在这个例子中，你将探索flash9 预览版了一些新特性，你将创建一个简单的形体并使用改良的事类模型来使它可以点击,在后面的例子中，你将使这个形体可以拖动，将你的代码转换为类和动态创类的实例。

Clickable shapes(可点击的形体)

下面我们先开始创建一个可以点击的形体。

1. 选择文件>新建一个文档，并将它保存为simpleBall.fla.
2. 选择绘制圆工具，在场景中绘制一个正圆。当然在绘制的时候按住shift就可以了。
注意：在绘制时候确何你的Object Drawing mode（对象绘模式）是关闭的。
3．选中选择工具并双击这个形体使它高亮显示
4.  当这个形体选中后，选择编辑modify>Convert to Symbol转换为元件(按F8)来打开元件转换窗口，
5．将名称改为circle然后点击ok,将它转换为影片剪辑。
6． 元件要仍处于选中的状态，在属性面板上为它起一个实例名为：ball_mc
7． 取消对元件的选择打开action面板(F9).
8．在Action面板上输入如下代码：

代码: 

ball_mc.addEventListener(MouseEvent.CLICK, clickHandler);
function clickHandler(event:MouseEvent):void {
   trace("You clicked the ball");
}

在这段代码中，ball_mc实例变成了可以点击的了，因为你加入了事件侦听用来检测用户是否有点击动作，无论何时只要用户点击了ball_mc影片剪辑，clickHandler()函数就会执行。这非常类似于之前版本在组件中加入侦听事件，如As2.0使用onPress()事件来检测用户是否点击了剪辑或按钮。
9．选择Control>Test Movie 测试影片，当你点击圆时，就会在面板上输出”you clicked the ball.
10．关闭Swf文件返回Flash操作环境，编辑你的Actionscript 代码，在原有代码的上面加入如下一行代码：
ball_mc.buttonMode = true;
11．重新测试你的影片,当你的光标位于圆之上时，光标就会变成一只小手的形状。用于给用户一个提示，这是可以点击的。

Draggable shapes(可拖动的形体)

如果你想让用户可以在场影中拖动这个形体，你需要加入两个事性侦听器，mouseDown(MouseEvent.MOUSE_DOWN)和mouseUp(MouseEvent.MOUSE_UP),如下面的例子。

下面的例子示范如何为mouseDown和mouseUp事件加入事件侦听器

1.编辑我们之前的例子中代码如下：

代码: 

ball_mc.buttonMode = true;
ball_mc.addEventListener(MouseEvent.CLICK, clickHandler);
ball_mc.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownListener);
ball_mc.addEventListener(MouseEvent.MOUSE_UP, mouseUpListener);
function clickHandler(event:MouseEvent):void {
  trace("You clicked the ball");
}
function mouseDownListener(event:MouseEvent):void {
   ball_mc.startDrag();
}
function mouseUpListener(event:MouseEvent):void {
   ball_mc.stopDrag();
} 

2.测试你的影片。你就可拖动这个圆了。
虽然我们编写这个例子没有花费我们多少时间，但如果再让你写一个可拖动的形体，你可能不会情愿去写，假想你能将你的代码转换为与元件连接的外部类文件,它可以自动的创建可拖动的形体，会在将来结省你的大量时间。下面我们就看如何实现。

Converting code into a class(将你的代码转换成类)

下面的例子创建一个Actionscript类它封装整个影片剪辑的拖动的实现逻辑。现在不管什么时候，只要创建一个类的新的实例被创建，它就是可拖动的。无须为场景中的每个实例去写代码。

1.创建一个新的Fla文档并将它保存为fancyBall.fla.

上一页 [1] [2] [3] [4] [5] 下一页

复制本页网址和标题，发送给你QQ/Msn的好友一起分享

上一篇:Flash AS3：Document Class特色为我们带来了什么？

下一篇:FLASH AS3 中使用URLRequest 和URLLoader 与服务器交互