maxshuty Posted March 29, 2016 Share Posted March 29, 2016 For simplicity I have a game and I'm trying to get my car to hit a wall. I've tried searching and I've tried several things as you'll see below, I'm not sure why I can't get it to work. Here is the code in my create function: create: function () { game.physics.startSystem(Phaser.Physics.ARCADE); this.carSprite = game.add.sprite(game.world.centerX, game.world.centerY, 'car'); game.physics.arcade.enable(this.carSprite); this.timer = game.time.events.loop(300, this.addRoad, this); } Then in my update function: update: function () { game.physics.arcade.overlap(this.carSprite, this.wallSprite, this.scoring, null, this); } I am creating the wallSprite like this: addOneRoadSection: function (x, y) { this.scoreCalculator += 1; if (this.scoreCalculator == 10) { this.scoreCalculator = 0; this.wallSprite = game.add.sprite(x + 100, y, 'wall'); game.physics.arcade.enable(this.wallSprite); this.wallAnimation = this.wallSprite .animations.add('wallAnimation'); this.wallSprite.animations.play('wallAnimation', 30, true); this.wallSprite.body.velocity.y = 100; this.wallSprite.checkWorldBounds = true; this.wallSprite.outOfBoundsKill = true; } } I am calling addOneRoadSection like this: addRoad: function () { this.addOneRoadSection(this.xValue, 0); } addRoad is being called in create using this.timer` So in summary what this is doing is that when the scoreCalculator is ten, it add's a wall. That works fine, the wall is animated fine, but the collision detection does not work at all. I tried moving the code inside of the if statement to my create function and it works fine with collision detection (but other things break so I can't keep it there). What am I doing wrong? I have a suspicion that this.wallSprite may be referring to something else at the time it is called in update? Link to comment Share on other sites More sharing options...
maxshuty Posted March 29, 2016 Author Share Posted March 29, 2016 So I figured this out. What was happening was that my initial inclination of me of me creating a new sprite and that over writing the other one was right. Here is how I solved the issue: in `create`: create: function(){ //Create a wallSprite array var wallSprite = []; } Now that I have an array when I add a new `wallSprite` in `addOneRoadSection` I can add the physics to each sprite like this: addOneRoadSection: function (x, y) { this.wallSprite.push(game.add.sprite(x + 100, y, 'wall')); game.physics.arcade.enable(this.wallSprite[this.wallSprite.length -1]); this.wallAnimation = this.wallSprite[this.wallSprite.length - 1].animations.add('wallAnimation'); this.wallSprite[this.wallSprite.length - 1].animations.play('wallAnimation', 30, true); this.wallSprite[this.wallSprite.length -1].body.velocity.y = 100; this.wallSprite[this.wallSprite.length - 1].checkWorldBounds = true; this.wallSprite[this.wallSprite.length -1].outOfBoundsKill = true; } Finally in `update` I just need to do this: for (var i = 0; i < this.wallSprite.length; i++) { game.physics.arcade.overlap(this.car, this.wallSprite, this.scoring, null, this); } Voila - collision detection works for every sprite now. Link to comment Share on other sites More sharing options...
drhayes Posted March 30, 2016 Share Posted March 30, 2016 I'm glad you solved this! You can also use a group instead of an Array. That will give you utility methods like getFirstAlive, which you can use for object pooling, which is something I think you'll need as you create lots of walls. Link to comment Share on other sites More sharing options...
Recommended Posts