Wie füge ich grundlegende Weltkollision mit PhaserJS hinzu?

Question

ich an einem neuen Spiel arbeite die PhaserJS Bibliothek für HTML5 und bin ratlos mit einem Problem, das ich in habe ausgeführt werden. Ich benutze die P2-Physik-Engine für grundlegende Plattform-Physik und ich bin nicht in der Lage, die Weltgrenzen-Kollision zu arbeiten. Hier ist mein Code:

Game.js

function create() { 
    game.world.setBounds(0, 0, 800, 300); 
    game.physics.startSystem(Phaser.Physics.P2JS); 
    game.physics.p2.restitution = 0.8; 

    player.create(game); 
    player.instance.body.collideWorldBounds = true; 
} 

Player.js

Player.prototype.create = function(game) { 
    this.instance = game.add.sprite(100, 100, 'player'); 
    game.physics.p2.enable(this.instance, Phaser.Physics.P2JS); 

    this.cursors = game.input.keyboard.createCursorKeys(); 
}; 

Im Moment ist mein Verständnis, dass ich die Welt Grenzen setzen müssen durch „game.world.setBounds Aufruf (width, height) "und überprüfe dann die Grenzen, indem du" player.instance.body.collideWorldBounds = true; "aufruft, aber das Spieler-Sprite geht immer noch durch die Grenzen. Jede Hilfe wird sehr geschätzt. Vielen Dank!

EDIT: Ich bin mit PhaserJS 2.0.7.

Answer 1

Sie möchten vielleicht aktualisieren Phaser 2.1.1, wie es scheint, dass sie dieses Problem dort behoben haben.

Sie können das von this example sehen.

Hier ist der Quellcode für dieses Beispiel:

var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update }); 

function preload() { 

    game.load.image('stars', 'assets/misc/starfield.jpg'); 
    game.load.spritesheet('ship', 'assets/sprites/humstar.png', 32, 32); 

} 

var ship; 
var starfield; 
var cursors; 

function create() { 

    starfield = game.add.tileSprite(0, 0, 800, 600, 'stars'); 

    game.physics.startSystem(Phaser.Physics.P2JS); 

    game.physics.p2.restitution = 0.8; 

    ship = game.add.sprite(200, 200, 'ship'); 
    ship.scale.set(2); 
    ship.smoothed = false; 
    ship.animations.add('fly', [0,1,2,3,4,5], 10, true); 
    ship.play('fly'); 

    // Create our physics body. A circle assigned the playerCollisionGroup 
    game.physics.p2.enable(ship); 

    ship.body.setCircle(28); 

    // This boolean controls if the player should collide with the world bounds or not 
    ship.body.collideWorldBounds = true; 

    cursors = game.input.keyboard.createCursorKeys(); 

} 

function update() { 

    ship.body.setZeroVelocity(); 

    if (cursors.left.isDown) 
    { 
     ship.body.moveLeft(200); 
    } 
    else if (cursors.right.isDown) 
    { 
     ship.body.moveRight(200); 
    } 

    if (cursors.up.isDown) 
    { 
     ship.body.moveUp(200); 
    } 
    else if (cursors.down.isDown) 
    { 
     ship.body.moveDown(200); 
    } 

} 

Answer 2

In meinem Spiel hatte ich p2.setBoundsToWorld zu nennen die p2 Physik Grenzen zu aktualisieren, um die Welt Grenzen entsprechen:

function create() { 
    game.world.setBounds(0, 0, 800, 300); 
    game.physics.startSystem(Phaser.Physics.P2JS); 
    game.physics.p2.setBoundsToWorld(true, true, true, true, false); 

Die Signatur wird wie folgt dar:

setBoundsToWorld: function (left, right, top, bottom, setCollisionGroup)