cocos2d-js 屏幕拖拽

原创 2016年09月30日 11:34:45
        var tmp = this;
        cc.eventManager.addListener({
            event: cc.EventListener.TOUCH_ONE_BY_ONE,
            swallowTouches: true,
            onTouchMoved: function (touches, event) {
                tmp.onTouchesMoved(touches, event);
            },
            onTouchEnded: function (touches, event) {
                tmp.onTouchesEnded(touches, event);
            },
            onTouchBegan: function (touches, event) {
                //tmp.onTouchesBegan(touches,event);
                return true;
            }
        }, this);
touchmove的时候定义好边界:
    onTouchesBegan: function (touches, event) {
        // cc.log("onTouchBegan");
    },

    onTouchesMoved: function (touches, event) {
        //cc.log("onTouchMoved");
        this.onTouchCheckBounder(touches.getDelta(), true);

        var showNewX = false;
        var showNewY = false;
        var offLastX = this._origin_pos.x + this._offset_x - this._last_pos.x;
        if (Math.abs(offLastX) >= this._cellSize.width) {
            showNewX = true;
            var addXNum = Math.floor(Math.abs(offLastX)/this._cellSize.width + 0.5);
            this.moveCellsWithMap(addXNum, 0, offLastX < 0, false);
            if (offLastX < 0) {
                this._offset_x = this._last_pos.x - this._origin_pos.x - this._cellSize.width * addXNum;
            } else {
                this._offset_x = this._last_pos.x - this._origin_pos.x + this._cellSize.width * addXNum;
            }
            var moveDir = offLastX < 0 ? "->>>>>> " : "<<<<<<- ";
            cc.log(moveDir + addXNum);
        }
        var offLastY = this._origin_pos.y + this._offset_y - this._last_pos.y;
        if (Math.abs(offLastY) >= this._cellSize.height) {
            showNewY = true;
            var addYNum = Math.floor(Math.abs(offLastY)/this._cellSize.height + 0.5);
            this.moveCellsWithMap(0, addYNum, false, offLastY < 0);
            if (offLastY < 0) {
                this._offset_y = this._last_pos.y - this._origin_pos.y - this._cellSize.height * addYNum;
            } else {
                this._offset_y = this._last_pos.y - this._origin_pos.y + this._cellSize.height * addYNum;
            }
            var moveDir = offLastY < 0 ? "-^^^^^^ " : "vvvvvv- ";
            cc.log(moveDir + addYNum);
        }

        this._mainLayer.setPosition(cc.p(this._origin_pos.x + this._offset_x, this._origin_pos.y + this._offset_y));
        if (showNewX) this._last_pos.x = this._mainLayer.getPosition().x;
        if (showNewY) this._last_pos.y = this._mainLayer.getPosition().y;
    },

    // 检查拖拽差量是否接触边界
    onTouchCheckBounder: function(pos_delta, touch) {
        var isBounder = {x:false, y:false};
        var dragDistanceXLeft = this._xNum*this._cellSize.width - g_winSize.width + 46;
        var dragDistanceXRight = 0;
        var dragDistanceYDown = this._yNum*this._cellSize.height - g_winSize.height + this._cellSize.height/2;
        var dragDistanceYUp = 0;
        var pos_x = (this._offset_x + pos_delta.x);
        var pos_y = (this._offset_y + pos_delta.y);
        if (pos_x < -dragDistanceXLeft) {
            if (touch) this._offset_x = -dragDistanceXLeft;
            isBounder.x = true;
        } else if (pos_x > dragDistanceXRight) {
            if (touch) this._offset_x = dragDistanceXRight;
            isBounder.x = true;
        } else {
            if (touch) this._offset_x = pos_x;
        }

        if (pos_y < -dragDistanceYDown) {
            if (touch) this._offset_y = -dragDistanceYDown;
            isBounder.y = true;
        } else if (pos_y > dragDistanceYUp) {
            if (touch) this._offset_y = dragDistanceYUp;
            isBounder.y = true;
        } else {
            if (touch) this._offset_y = pos_y;
        }
        return isBounder;
    },

    onTouchesEnded: function (touches, event) {
        // cc.log("onTouchEnded");
    },


点击事件影响拖拽处理方法:

    touchCellEventBtn: function (sender, type) {
        switch (type) {
            case ccui.Widget.TOUCH_BEGAN:
                this._btn_pos_touch_began = sender.getTouchBeganPosition();
                this._btn_touch_state = true;
                // CocosUtility.ImageEvent_OnTouchBegan(sender);
                break;
            case ccui.Widget.TOUCH_CANCELED:
                this._btn_touch_state = false;
                // CocosUtility.ImageEvent_OnTouchCancelled(sender);
                break;
            case ccui.Widget.TOUCH_MOVED:
                var movedPos = sender.getTouchMovePosition();
                var offset_x = movedPos.x - this._btn_pos_touch_began.x;
                var offset_y = movedPos.y - this._btn_pos_touch_began.y;
                this._btn_touch_state = offset_x < 20 && offset_x > -20 && offset_y < 20 && offset_y > -20;
                //CocosUtility.ImageEvent_OnTouchMoved(sender);
                break;
            case ccui.Widget.TOUCH_ENDED:
                // CocosUtility.ImageEvent_OnTouchEnded(sender);
                if (!this._btn_touch_state) return;
                this._btn_touch_state = false;
                UIAudio.openUI();
                if (sender.getTag() >= 10*this.B_LARGE) {
                    cc.log("click cloud");
                } else if (sender.getTag() >= 5*this.B_LARGE) {
                    this.onSightClicked(sender.getTag()-5*this.B_LARGE, sender._sightType);
                } else if (sender.getTag() >= this.B_LARGE) {
                    this.onBoatClicked(sender.getTag()-this.B_LARGE, sender._userId);
                } else {
                    this.onCellClicked(sender.getTag());
                }
                break;
        }
    },



版权声明:本文为博主原创文章,未经博主允许不得转载。

Cocos2d-x3.1及3.2实现截屏功能

1、Cocos2d-x3.1 在Cocos2d-x3.2之前,Cocos引擎没有提供截图功能,但是可以通过RenderTexture实现, 1.1首先在CCDirector.h中添加如下代码:并在...
  • yuxikuo_1
  • yuxikuo_1
  • 2014年09月04日 14:04
  • 1949

【cocos2d-js官方文档】十七、事件分发机制

简介 游戏开发中一个很重要的功能就是交互,如果没有与用户的交互,那么游戏将变成动画,而处理用户交互就需要使用事件监听器了。 总概: 事件监听器(cc.EventListener) 封装用户的事件...
  • qinning199
  • qinning199
  • 2014年12月15日 23:37
  • 16690

cocos中Widget 的用法

摘自百度: http://zhidao.baidu.com/link?url=aIjF3FRMMHaAP67BDVhw8uroKelKb3KjYuybQq4XJnIT9x2Sjxm8Uyg4VBux...
  • liziqiang_tieli
  • liziqiang_tieli
  • 2015年06月13日 23:45
  • 2078

实现一个触摸屏幕上可拖拽的正方形

实现一个触摸屏幕上可拖拽的正方形 #container { background-color: black; height:100px; width:100px...
  • luckyone1111
  • luckyone1111
  • 2017年11月07日 01:15
  • 90

cocos2d-js h5横竖屏切换的一种实现方案

主要思路 根据屏幕方向来对场景进行旋转 技术点 对屏幕方向进行监听 const PORTRAIT = 0; const LANDSCAPE = 1; window.addEventListener("...
  • shangdibaozi
  • shangdibaozi
  • 2017年10月31日 16:42
  • 291

cocos2dx触屏响应(单点触摸)CCTouchBegan,CCTouchMove,CCTouchEnd

今天白白跟大家分享一下cocos2dx单点触摸经验。 cocos2dx触摸CCTouch类的单点触摸有四个函数CCTouchBegan,CCTouchMove,CCTouchEnd,CCTouchCa...
  • u010229677
  • u010229677
  • 2013年11月05日 17:46
  • 7220

cocos2d-js 屏幕拖拽

var tmp = this; cc.eventManager.addListener({ event: cc.EventListener.TOUCH_ONE_...
  • zhenyu5211314
  • zhenyu5211314
  • 2016年09月30日 11:34
  • 396

IOS图片和按钮在屏幕中随意拖动

IOS图片和按钮在屏幕中随意拖动 1、先给图片添加手势  //创建一个拖动的手势     UIPanGestureRecognizer *pan=[[UIPanGestureRecognizer...
  • shiningchen322
  • shiningchen322
  • 2016年03月23日 16:26
  • 3103

cocos2d-x 坐标系总结(从如何判断精灵是否在屏幕可见范围谈起)

萌生系统了解这方面的问题这个念头, 是因为今天刚遇到的一个问题。 最近在写一个跑酷游戏,基于cocos2d-x。  在死亡判断的时候,有一个情况,就是主角被移出了屏幕可见范围,则判断为死亡。(玩过天...
  • hitwhylz
  • hitwhylz
  • 2014年02月22日 16:43
  • 4587

HTML5触摸事件(touchstart、touchmove和touchend)

HTML5中新添加了很多事件,但是由于他们的兼容问题不是很理想,应用实战性不是太强,所以在这里基本省略,咱们只分享应用广泛兼容不错的事件,日后随着兼容情况提升以后再陆续添加分享。今天为大家介绍的事件主...
  • zh13544539220
  • zh13544539220
  • 2015年04月08日 11:39
  • 570
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:cocos2d-js 屏幕拖拽
举报原因:
原因补充:

(最多只允许输入30个字)