zoukankan      html  css  js  c++  java
  • 摸索Flash移动开发加入事件

    如果没有互动,我们还玩毛毛哇。。。     ---- 我如是说

    游戏的互动,在程序猿来看,都是来自于玩家通过某些操作触发某些事件,发生某些后果。

    事件在游戏中处于核心位置,这一节我们简单的学习一下事件的添加。

    首先,Starling的事件封装和flash传统显示列表是一样的,与做PC应用不同的是,咱们是做手机应用,所以在事件处理上面有所区别。

    我们主要是使用TouchEvent来处理所有事件的。

    因为是手机项目,所以不会有MouseEvent这种东西的,你就死了这条心吧。

    TouchEvent里面有三个比较重要的方法,你们看api就应该可以看到。

    如果你说你没有starling api,那我就无力吐槽了,您是怎么样看到这一节来without api的呢?

    好吧,去starling中文站下载一个最新版1.3的api吧,我就不等你了。

       
    TouchEvent(type:String, touches:Vector.<Touch>, shiftKey:Boolean = false, ctrlKey:Boolean = false, bubbles:Boolean = true)
    创建一个新的TouchEvent实例。
    TouchEvent
       
    getTouch(target:DisplayObject, phase:String = null):Touch
    返回附加到指定对象上的一个触碰对象。
    TouchEvent
       
    getTouches(target:DisplayObject, phase:String = null, result:Vector.<Touch> = null):Vector.<Touch>
    返回附加在指定的对象上的触碰对象数组。如果你传递一个'result'数组,那么会将touch对象添加到这个数组中来代替创建一个新的数组。
    TouchEvent
       
    判断目标显示对象是否正在被触碰或被鼠标滑过。 

    以上是TouchEvent在api里面的样子,他就一个构造器和三个方法。

    第一个方法getTouch是我们在这里需要用到的。

    第二个方法看起来和多点触控有关,咱们先略过,以后再学习。

    第三个方法中文意思很明显,我就不说了。

    我们可以给我们starling的stage添加一个TouchEvent事件。 如下:

    stage.addEventListener(TouchEvent.TOUCH, onTouched);

    需要注意的是你以上这句需要加在之前的onAdded方法里面,不然的话,你的stage有可能会报null错误。

    然后给事件写一个对应的事件处理器吧,不然会报错的:

     1 private function onTouched(e:TouchEvent):void
     2 {
     3     trace("Don't touch me...");15 }

    然后就ok了。

    之后点击调试,你就可以看到output面板的输出了,如图:

    虽然有反应,但是,我靠,为什么会一直触发TouchEvent呢,我动都没动呢?

    少年啊,之前都说了,这个跟传统显示列表里面的MouseEvent是有很大区别的。

    你现在的鼠标只是模拟的触碰事件,你鼠标一直在模拟器里面放着的话,就相当于你手指一直放在手机的屏幕上一样,叫它怎能不发了疯似得触发呢?

    好吧,我们来看一看TouchEvent的getTouch事件吧。

    我们可以通过TouchEvent和目标对象再结合TouchPhase可以拿到我们想要的正确的Touch实例。

      BEGAN : String = began
    [static] 当手指刚刚接触屏幕,或者鼠标按下。
    TouchPhase
        ENDED : String = ended
    [static] 手指离开屏幕或鼠标松开。
    TouchPhase
        HOVER : String = hover
    [static] 只有鼠标模式下可用:当光标滑过一个对象,并且没有按下鼠标。
    TouchPhase
        MOVED : String = moved
    [static] 手指在屏幕上滑动,或者鼠标在按下的情况下在屏幕上滑动。
    TouchPhase
        STATIONARY : String = stationary
    [static] 手指或鼠标(按下) 没有移动。 

    以上是TouchPhase的四种状态,认识中文字的俺就不念了。

    • BEGAN相当于MOUSE_DOWN;
    • ENDED相当于MOUSE_UP,HOVER相当于MOUSE_OVER;
    • MOVED相当于MOUSE_MOVE;
    • 并且是鼠标按下的MOUSE_MOVE,STATIONARY还没用过,我觉得应该相当于CLICK。

    以上是个人理解。

    然后大家可以看看Touch的api,因为太长了,我就不贴了,并且我们暂时不需要用到那些属性。

    然后我们修改一下我们的事件处理器:

    private function onTouched(e:TouchEvent):void
    {
        var touch:Touch = e.getTouch(stage, TouchPhase.ENDED);
        if (touch)
        {
            trace("Don't touch me..");
        }
    }

    改完后我们调试一下,发现output面板没有输出了。然后我们点击了一下场景,发现输出了,如下图:

    点一下,输出一下,点一下,输出一下,点一下,输出一下。。。

    好玩吗?

    嗯,正常了对吧。

    那么说明我们好歹也算是正常了。

    好吧,用上我们之前导入的TweenLite库吧。

    private function onTouched(e:TouchEvent):void
            {
                var touch:Touch = e.getTouch(stage, TouchPhase.ENDED);
                if (touch)
                {
                    trace("Don't touch me..");
                    targetX = touch.globalX;
                    targetY = touch.globalY;
                    var dx:Number = role.x - targetX;
                    var dy:Number = role.y - targetY;
                    var dist:Number = Math.sqrt(dx * dx + dy * dy);
                    var time:int = dist / 20;
                    role.setStatus(1);
                    TweenLite.to(role, time, {x:targetX, y:targetY } );
                }
            }
        }

    好吧,我们点击一下会发现人物会移动。

    今天就到这里,谢谢观赏。

  • 相关阅读:
    模态框获取内容jQuery
    jQuery支持链式编程,一句话实现左侧table页+常用筛选器总结
    jquery实现全选、取消反选、加JavaScript三元运算(三种法法实现反选)
    用dom1来实现,根据光标移动自动给表单加上背景色,光标移开自动去除背景色
    JavaScript两种创建标签的的方法,实现点击按钮让text自增
    vue前端路由搜索功能实现
    pycharm配置vue
    QT全局事件和绑定
    mysql事务、锁
    web前端上传文件按钮自定义样式
  • 原文地址:https://www.cnblogs.com/adoontheway/p/2975233.html
Copyright © 2011-2022 走看看