cocos 制作触摸多选牌仿操作类似欢乐斗地主选牌操作

一直关注cocos2dx  使用cocosCreator  支持typescript/js  做了一个触摸多选牌仿操作类似欢乐斗地主选牌操作 选出要出的多张牌上一张图片效果

提供给有需要的同志们  代码是typescript 可以转成js 注释部分是拖动一张牌拖动效果暂时没用注释了 

private initPokerTouch() {
        // 设置多选牌
        let n = this.mHold[0];
        n.on(cc.Node.EventType.TOUCH_CANCEL, e => { this.pokerParentTouch(e, n); }, this);
        n.on(cc.Node.EventType.TOUCH_START, e => { this.pokerParentTouch(e, n); }, this);
        n.on(cc.Node.EventType.TOUCH_MOVE, e => { this.pokerParentTouch(e, n); }, this);
        n.on(cc.Node.EventType.TOUCH_END, e => { this.pokerParentTouch(e, n); }, this);
    }

    private mTouchStart = cc.Vec2.ZERO; // 记录 第一次触摸点
    private mSelectCardColor = cc.Color.WHITE.fromHEX("#D3D3D3");
    private sCardY = 30;
    private pokerParentTouch(e, n: cc.Node = null) {
        switch (e.type) {
            // this.btnTouchTime = new Date().getTime();
            case cc.Node.EventType.TOUCH_END:
            case cc.Node.EventType.TOUCH_CANCEL:
                // console.log("cardid:", n.getComponent(Card).mPoker.id);
                // this.btnTouchTime = new Date().getTime();
                // if (this.mDragBtnObj) {
                //     let a = new cc.Rect(this.mDragBtnObj.position.x, this.mDragBtnObj.position.y, this.mDragBtnObj.width, this.mDragBtnObj.height);
                //     let b = new cc.Rect(n.position.x, n.position.y, n.width, n.height);
                //     this.node.removeChild(this.mDragBtnObj);
                //     this.mDragBtnObj = null;
                //     if (!cc.Intersection.rectRect(a, b)) {
                //         // console.log("无交集") // 进行出牌
                //         if (this.isDeal) this.doClick(n.getComponent<cc.Button>(cc.Button));
                //         else console.log("不是出牌玩家");
                //     }
                // }
                {
                    let touches = e.getTouches();
                    let touchLoc = touches[0].getLocation();
                    // console.log("move:" + touchLoc.x + "," + touchLoc.y)
                    let touchPos = this.node.convertToNodeSpace(touchLoc); //将坐标转换为当前节点坐标 屏幕node或者是全屏的node
                    if (e.type == cc.Node.EventType.TOUCH_START) this.mTouchStart = touchPos;
                    let tp = this.mTouchStart.x < touchPos.x ? this.mTouchStart : touchPos;
                    let rect = cc.rect(tp.x, tp.y, Math.abs(this.mTouchStart.x - touchPos.x) + 2, 200000); // 加2保证点自己点击上 高度值足够高避免触摸屏幕的时候控件是半个的情况会失去触摸控件情况
                    // console.log(tp, touchPos, rect);
                    for (let i = 0; i < this.mHold[0].childrens.length; i++) {
                        let card = this.mHold[0].childrens[i];
                        let cardRect = card.getBoundingBoxToWorld();
                        cardRect.width -= (i == this.mHold[0].childrens.length - 1) ? 0 : card.width * 0.5; // 最后一张牌不进行剪切一半
                        if (cc.rectIntersectsRect(cardRect, rect)) {
                            card.setPositionY(card.y == this.sCardY ? 0 : this.sCardY);
                        }
                        else {
                            // card.setPositionY(0);
                        }
                        card.color = cc.Color.WHITE;
                    }
                }
                break;
            case cc.Node.EventType.TOUCH_START:
            case cc.Node.EventType.TOUCH_MOVE:
                let touches = e.getTouches();
                let touchLoc = touches[0].getLocation();
                // console.log("move:" + touchLoc.x + "," + touchLoc.y)
                let touchPos = this.node.convertToNodeSpace(touchLoc); //将坐标转换为当前节点坐标 屏幕node或者是全屏的node
                if (e.type == cc.Node.EventType.TOUCH_START) this.mTouchStart = touchPos;
                let tp = this.mTouchStart.x < touchPos.x ? this.mTouchStart : touchPos;
                let rect = cc.rect(tp.x, tp.y, Math.abs(this.mTouchStart.x - touchPos.x) + 2, 200000); // 加2保证点自己点击上 高度值足够高避免触摸屏幕的时候控件是半个的情况会失去触摸控件情况
                // console.log(tp, touchPos, rect);
                for (let i = 0; i < this.mHold[0].childrens.length; i++) {
                    let card = this.mHold[0].childrens[i];
                    let cardRect = card.getBoundingBoxToWorld();
                    cardRect.width -= (i == this.mHold[0].childrens.length - 1) ? 0 : card.width * 0.5;// 最后一张牌不进行剪切一半
                    if (cc.rectIntersectsRect(cardRect, rect)) {
                        card.color = this.mSelectCardColor;
                    } else {
                        card.color = cc.Color.WHITE;
                    }
                }

                // if (new Date().getTime() - this.btnTouchTime > 50) { // 进行设置
                //     let delta = e.touch.getDelta();
                //     if (!this.mDragBtnObj) {
                //         this.isSetDragBtn = true;
                //         this.mDragBtnObj = cc.instantiate(n);
                //         this.mDragBtnObj.children[1].active = false;
                //         this.node.addChild(this.mDragBtnObj);
                //         console.log("nnnnnn:", n.getPositionY());
                //         if (n.getPositionY() == this.mCardPosY || Math.abs(n.getPositionY() - this.mCardPosY) < 3) // 如果是这个坐标进行设置
                //             this.doClick(n.getComponent<cc.Button>(cc.Button), true);
                //     }
                //     this.mDragBtnObj.x += delta.x;
                //     this.mDragBtnObj.y += delta.y;
                // } else console.log("dsddssddssddsdssdsdsdsd")
                break;
        }
    }