frodoe7 Posted May 11, 2016 Share Posted May 11, 2016 firstly I am not beginner at game development at all - but beginner in web game development specially I started with Phaser as it looks good and optimized for mobile games anyway .. I have a strange behavior with my game - I put a rectangle and trying to move it (when I debugged the X axis already changes correctly , but I can't see the rectangle move!!) my codes var game = new Phaser.Game(window.innerWidth,window.innerHeight,Phaser.AUTO); var colors = ["#FF0000" , "#00FF00" , "#0000FF" , "#FFFF00" , "#00FFFF" , "#FFFF00"]; var lst; var hlprs = []; var gameState = { preload: function () { this.game.stage.backgroundColor = "#FFFFFF"; }, create: function () { for (var i = 0 ; i < 8 ; i++) { hlprs[i] = new Phaser.Rectangle((i*200),0,100,20); hlprs[2*i + 1] = new Phaser.Rectangle((i*200),window.innerHeight - 20,100,20); game.debug.geom(hlprs[i] , colors[Math.floor((Math.random() * 6))]); game.debug.geom(hlprs[2*i + 1] , colors[Math.floor((Math.random() * 6))]); } }, update: function () { moving();// it calls moving function and X axis is changes but (the rectangle does not move !!!) } }; function moving() { for (var i = 0 ; i < 8 ; i++) { hlprs[i].offset(-1,0); hlprs[2*i + 1].offset(-1,0); } } game.state.add('GameState' , gameState); game.state.start('GameState'); Link to comment Share on other sites More sharing options...
rich Posted May 11, 2016 Share Posted May 11, 2016 The create function is called just once. The debug canvas is erased and redrawn every frame, so if you want to use Debug to draw a rectangle (and you should _never_ do that in production code btw) then stick the debug.geom calls inside the render function. Link to comment Share on other sites More sharing options...
Recommended Posts