CocosCreator物理引擎Demo源码分析(3)-stick-arrow

缺乏、安全感 2022-05-25 23:49 298阅读 0赞

stick-arrow示例展示了如何动态发射刚体飞往目标点。

## 技术点 ##

1、触摸屏幕发射刚体，计算起点和目标点的夹角，设置刚体的线性速度。  
2、在Update中不断施加一个作用力到刚体尾部，使它能一直往目标点飞去。  
3、在碰撞上后，动态计算并设置WeldJoint的属性，使刚体和碰撞体按一定角度连接起来，不致于自然掉落。

## 源码分析 ##

#### arrow.js ####

arrow.js代码功能是处理碰撞之后的逻辑，主要是动态计算和设置WeldJoint关节的属性。

cc.Class({
        extends: cc.Component,
    
        properties: {
    
        },
    
        // LIFE-CYCLE CALLBACKS:
    
        onLoad () {
            this.weldJoint = this.getComponent(cc.WeldJoint);
        },
    
        // 每次处理完碰撞体接触逻辑时被调用
        onPostSolve: function(contact, selfCollider, otherCollider) { 
            // 获取冲量信息 注意：这个信息只有在 onPostSolve 回调中才能获取到
            var impulse = contact.getImpulse();
            // normalImpulses: 法线方向的冲量
            // PTM_RATIO: 物理单位与像素单位互相转换的比率，一般是 32。
            if (Math.abs(impulse.normalImpulses[0]) < cc.PhysicsManager.PTM_RATIO) return;
    
            let joint = this.weldJoint;
    
            if (joint.enabled) {
                joint.enabled = false;
                return;
            }
    
            if (otherCollider.node.name === 'arrow') {
                return;
            }
    
            let arrowBody = selfCollider.body;
            let targetBody = otherCollider.body;
            // 将 arrowBody 本地坐标系下的点转换为世界坐标系下的点
            let worldCoordsAnchorPoint = arrowBody.getWorldPoint(cc.v2(0.6, 0));
    
            joint.connectedBody = targetBody;
            // 将给定的世界坐标系下的点转换为 arrowBody 本地坐标系下的点
            joint.anchor = arrowBody.getLocalPoint(worldCoordsAnchorPoint);
            // 将给定的世界坐标系下的点转换为 targetBody 本地坐标系下的点
            joint.connectedAnchor = targetBody.getLocalPoint(worldCoordsAnchorPoint);
            joint.referenceAngle = targetBody.node.rotation - arrowBody.node.rotation;
    
            joint.enabled = true;
        },
    });

#### shoot-arrow.js ####

shoot-arrow.js代码功能是发射刚体，并在刚体飞行过程中不断计算和施加作用力。

cc.Class({
        extends: cc.Component,
    
        properties: {
            arrow: {
                type: cc.Node,
                default: null
            }
        },
    
        onEnabled: function() {
            this.debugDrawFlags = cc.director.getPhysicsManager().debugDrawFlags;
            cc.director.getPhysicsManager().debugDrawFlags = 
                cc.PhysicsManager.DrawBits.e_jointBit |
                cc.PhysicsManager.DrawBits.e_shapeBit
                ;
        },
    
        onDisable: function() {
            cc.director.getPhysicsManager().debugDrawFlags = this.debugDrawFlags;
        },
    
        // LIFE-CYCLE CALLBACKS:
    
        onLoad () {
            this.node.on(cc.Node.EventType.TOUCH_START, this.onTouchBegan, this);
            this.arrowBodies = [];
        },
    
        onTouchBegan: function(event) {
            let touchLoc = event.touch.getLocation();
            let node = cc.instantiate(this.arrow);
            node.active = true;
            let vec = cc.v2(touchLoc).sub(node.position);
            // 通过反正切函数得到触摸点和arrow出生点之间的夹角角度
            // 乘以 180/3.14159 是为了把弧度转化为角度
            node.rotation = -Math.atan2(vec.y, vec.x) * 180 / Math.PI;
            cc.director.getScene().addChild(node);
    
            // 返回向量的长度
            let distance = vec.mag();
            // 返回归一化后的向量，再乘以800
            let velocity = vec.normalize().mulSelf(800);
            // 设置刚体的线性速度
            let arrowBody = node.getComponent(cc.RigidBody);
            arrowBody.linearVelocity = velocity;
    
            this.arrowBodies.push(arrowBody);
        },
    
        update: function (dt) {
            let dragConstant = 0.1;
            let arrowBodies = this.arrowBodies;
            for (let i = 0; i < arrowBodies.length; i++) { 
                let arrowBody = arrowBodies[i];
                let velocity = arrowBody.linearVelocity;
                let speed = velocity.mag();
                if (speed === 0) {
                    continue;
                }
                let direction = velocity.normalize();
    
                // 将世界坐标系下的(1,0)向量转换为刚体本地坐标系下的向量
                let pointingDirection = arrowBody.getWorldVector(cc.v2(1, 0));
                let flightDirection = arrowBody.linearVelocity;
                let flightSpeed = flightDirection.mag();
                // 向量归一化，让这个向量的长度为 1
                flightDirection.normalizeSelf();
    
                // 向量之间进行点乘
                let dot = cc.pDot(flightDirection, pointingDirection);
                let dragForceMagnitude = (1 - Math.abs(dot)) * flightSpeed * flightSpeed * dragConstant * arrowBody.getMass();
                // 得到arrowBody尾部的世界坐标
                let arrowTailPosition = arrowBody.getWorldPoint(cc.v2(-80, 0));
                // 施加一个力到arrowBody刚体的尾部(世界坐标系)
                arrowBody.applyForce(flightDirection.mul(-dragForceMagnitude), arrowTailPosition, false);
            }
        },
    });