Cocos2d-js：当从一个应用程序迁移到另一个应用程序时，对在浏览器上运行的cocos2d-js应用程序产生影响 [英] Cocos2d-js: effect on cocos2d-js application running on browser while a move from one application to another application

问题描述

我正在浏览器上运行cocos2d网站上提供的跑酷游戏。一切正常，但是当我从浏览器移至升华文本并返回浏览器时，正在运行的播放器开始表现出一些意外行为，播放器从其位置消失，几秒钟后它掉落在地上然后启动每当我从一个应用程序移到另一个应用程序时，它都会再次运行。

i was running parkour game given on cocos2d website on my browser. everything was working fine, but when i move from my browser to sublime text and returned to my browser, the running player start to show some unexpected behaviour, the player disappeared from its position and and after few second it fall on the ground and then start running again .whenever i move from one application to another it happens.

我不知道它为什么会发生。有人可以告诉我如何防止这种情况发生吗？

i don't why its happening. could some one tell me how to prevent this from happen?

以下是动画层的代码：-

here is the code for animation layer:-

       var AnimationLayer = cc.Layer.extend({
spriteSheet: null,
runningAction: null,
sprite: null,
space:null,
body:null,
shape:null,

ctor:function (space) {
    this._super();
    this.space = space;
    this.init();

    this._debugNode = cc.PhysicsDebugNode.create(this.space);
    this._debugNode.setVisible(false);
    // Parallax ratio and offset
    this.addChild(this._debugNode, 10);
},
init:function () {
    this._super();

    // create sprite sheet
    cc.spriteFrameCache.addSpriteFrames(res.runner_plist);
    this.spriteSheet = cc.SpriteBatchNode.create(res.runner_png);
    this.addChild(this.spriteSheet);


    // init runningAction
    var animFrames = [];
    for (var i = 0; i < 8; i++) {
        var str = "runner" + i + ".png";
        var frame = cc.spriteFrameCache.getSpriteFrame(str);
        animFrames.push(frame);
    }

    var animation = cc.Animation.create(animFrames, 0.1);
    this.runningAction = cc.RepeatForever.create(cc.Animate.create(animation));


    //create runner through physic engine
    this.sprite = cc.PhysicsSprite.create("#runner0.png");
    var contentSize = this.sprite.getContentSize();
    // init body
    this.body = new cp.Body(1, cp.momentForBox(1, contentSize.width, contentSize.height));
    this.body.p = cc.p(g_runnerStartX, g_groundHight + contentSize.height / 2);
    this.body.applyImpulse(cp.v(150, 0), cp.v(0, 0));//run speed
    this.space.addBody(this.body);
    //init shape
    this.shape = new cp.BoxShape(this.body, contentSize.width - 14, contentSize.height);
    this.space.addShape(this.shape);

    this.sprite.setBody(this.body);
    this.sprite.runAction(this.runningAction);

    this.spriteSheet.addChild(this.sprite);

    this.scheduleUpdate();
},

getEyeX:function () {
    return this.sprite.getPositionX() - g_runnerStartX;
}});

这是playScene.js的代码：-

and this is the code for playScene.js:-

    var PlayScene = cc.Scene.extend({
space:null,
gameLayer:null,
// init space of chipmunk
initPhysics:function() {
    this.space = new cp.Space();
    // Gravity
    this.space.gravity = cp.v(0, -350);
    // set up Walls
    var wallBottom = new cp.SegmentShape(this.space.staticBody,
        cp.v(0, g_groundHight),// start point
        cp.v(4294967295, g_groundHight),// MAX INT:4294967295
        0);// thickness of wall
    this.space.addStaticShape(wallBottom);
},
onEnter:function () {
    this._super();
    this.initPhysics();



    this.gameLayer = cc.Layer.create();

    //add three layer in the right order
    this.gameLayer.addChild(new BackgroundLayer(), 0, TagOfLayer.background);
    this.gameLayer.addChild(new AnimationLayer(this.space), 0, TagOfLayer.Animation);
    this.addChild(this.gameLayer);
    this.addChild(new StatusLayer(), 0, TagOfLayer.Status);

    this.scheduleUpdate();

},
update:function (dt) {
    // chipmunk step
    this.space.step(dt);
    var animationLayer = this.gameLayer.getChildByTag(TagOfLayer.Animation);
    var eyeX = animationLayer.getEyeX();

    this.gameLayer.setPosition(cc.p(-eyeX,0));
}

}）;

推荐答案

好的，这在某些情况下可能会解决，也可能无法解决，但是在深入研究之后，最大的怀疑似乎是在帧速率下花栗鼠的计算步​​骤不足

Ok, this may or may not solve the issue some scenarios, but after looking at it profoundly, the biggest suspect seems to be a lack of steps in the calculations of Chipmunk when the framerate drops (which appears to happen when you resize or minimize/maximize the screen).

我发现的与修复最接近的东西来自论坛中的帖子，我对此进行了改编像这样：在更新函数中有 this.space.step（dt）; 的地方，将其更改为以下内容：

The closest thing to a fix that I've found comes from a lead in this post in the forums, and which I've adapted it like this: where you have this.space.step(dt); in your update function, change it for the following:

var timeWindow = 1/60; //replace by your configured FPS rate if it's not 60
var steps = Math.ceil(dt / timeWindow);
var i = 0;
for (; i < steps; i++) {
  this.space.step(timeWindow);
}

这应确保即使您的应用程序速度降至60fps以下，物理仿真也将是已正确更新，此问题将不再发生。

This should ensure that even if your application drops below 60fps the physics simulation will be updated properly, and this problem should not happen anymore.

这篇关于Cocos2d-js：当从一个应用程序迁移到另一个应用程序时，对在浏览器上运行的cocos2d-js应用程序产生影响的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！