Found a strange behaviour that when I keep adding or toggle display sprite object. That makes my game screen shakes when toggle some of optional UIs .
Tried to reproduce this issue with simplified codes. Here is the experiment.
The red line shows the original position of first square.png
When I keep adding sprites on the same position, appears that pixels moved, the square not stack up in different positions
When hidding sprite except the first square, seems it back to correct position
The source codes
var MyScene = cc.Scene.extend({
onEnterTransitionDidFinish: function(){
this._super();
this.initComponents();
},
initComponents: function () {
//create additional square container
var node = new cc.Node();
this.node = node;
node.setPosition(90, 90);
this.attach(node);
this.addChild(node);
//draw first square
var sprite = new cc.Sprite("square.png");
sprite.setPosition(50,50);
this.addChild(sprite);
//listen to keyboard, add square / toggle
if ('keyboard' in cc.sys.capabilities) {
cc.eventManager.addListener({
event: cc.EventListener.KEYBOARD,
onKeyPressed: function (keyCode, event) {
switch (keyCode) {
//toggle additional squares
case cc.KEY.q:
this.node.setVisible(!this.node.isVisible());
break;
//attach more squares
case cc.KEY.w:
this.attach(node);
break;
}
}.bind(this)
}, this);
}
//draw measure line
var line = new cc.DrawNode();
line.drawRect(cc.p(130,0), cc.p(132,150),cc.color(255,0,0,255),0);
this.addChild(line);
},
/**
-
Attach more squares
-
@param node
*/
attach: function (node) {
var xp = 0;
var yp = 0;
for (var i = 0; i < 5; i++) {
var sp = new cc.Sprite(“square.png”);
node.addChild(sp);
sp.setPosition(xp * 180, yp * 180);xp++; if (xp > 15) { xp = 0; yp++; }}
}
});
The square
project.json, I have to use webGL, so renderMode is 1
{
“renderMode”: 1,
“project_type”: “javascript”,
“frameRate”: 60,
“isLandscape”: true,
“noCache”: true,
“engineDir”: “frameworks/cocos2d-html5”,
“isPortrait”: false,
“showFPS”: true,
“id”: “gameCanvas”,
“debugMode”: 1,
“jsList”: [
“src/myscene.js”
],
“modules”: [
“cocos2d”,
“extensions”
]
}
Environment:
Cocos2d-JS v3.17
Google Chrome Version 81.0.4044.138 (Official Build) (64-bit)
Windows 10 64 bit