rpiller Posted April 14, 2014 Share Posted April 14, 2014 I can't seem to get my player character to move. It seems phaser gets updated so much and things change so much that any tutorial I find online is outdated. How am I supposed to setup an move a character in an rpg top down style game? Here is what I do: var w = window.innerWidth * window.devicePixelRatio, h = window.innerHeight * window.devicePixelRatio;var game = new Phaser.Game(w, h, Phaser.Auto, 'game', { preload: preload, create: create, update: update });var map;var layer1;var layer2;var layer3;var cursors;var player;function preload() { game.load.tilemap('map', 'content/maps/test.json', null, Phaser.Tilemap.TILED_JSON); game.load.image('tiles', 'content/images/tileset.png', 32, 32); game.load.image('player', 'content/images/phaser-dude.png') game.load.spritesheet('player', 'content/images/test.png', 24, 32, 12);}function create() { map = game.add.tilemap('map'); map.addTilesetImage('base', 'tiles'); layer1 = map.createLayer('Ground'); layer1.resizeWorld(); layer2 = map.createLayer('Object'); layer2.resizeWorld(); layer3 = map.createLayer('Object2'); layer3.resizeWorld(); player = game.add.sprite(150, 320, 'player'); player.animations.add('north.walk', [0, 1, 2], 6, true); player.animations.add('east.walk', [3, 4, 5], 6, true); player.animations.add('south.walk', [6, 7, 8], 6, true); player.animations.add('west.walk', [9, 10, 11], 6, true); cursors = game.input.keyboard.createCursorKeys(); game.camera.follow(player);}function update() { //player.body.setZeroVelocity(); if (cursors.left.isDown) { player.body.x -= 2; player.animations.player('west.walk'); } else if (cursors.right.isDown) { player.body.x += 2; player.animations.player('south.walk'); } if (cursors.up.isDown) { player.body.y -= 2; player.animations.player('north.walk'); } else if (cursors.down.isDown) { player.body.y += 2; player.animations.player('east.walk'); }} Link to comment Share on other sites More sharing options...
Raikoh Posted April 14, 2014 Share Posted April 14, 2014 You need to enable physic on your player sprite : game.physics.enable(player) and change to that : player.body.velocity.x = 2 Link to comment Share on other sites More sharing options...
Martiny Posted April 14, 2014 Share Posted April 14, 2014 If I'm not wrong, the "body" is part of Arcade Physics. So you'll need to start it in your create function and enable it to player.function create() {game.physics.startSystem(Phaser.Physics.ARCADE);// the rest of your code..//player = game.add.sprite(150, 320, 'player');game.physics.enable(player, Phaser.Physics.ARCADE);//..}Should work, I guess. If you don't want to work with Arcade Physics, I think removing the "body" (just player.y += 2; for instance), should work. Link to comment Share on other sites More sharing options...
rpiller Posted April 14, 2014 Author Share Posted April 14, 2014 OK, so setting the velocity gives more of an asteroid type of movement which doesn't really work for an RPG game. If I take away the body and just do player.x or y then is there a way for me to have the player collide with some tiles in the map? Link to comment Share on other sites More sharing options...
Raikoh Posted April 14, 2014 Share Posted April 14, 2014 Look at the examples you will see a lot of stuff that will help you very quickly. http://examples.phaser.io/ Link to comment Share on other sites More sharing options...
rpiller Posted April 14, 2014 Author Share Posted April 14, 2014 Thanks Raikoh there are some good stuff there, but I'm sort of shocked there isn't any RPG top/down style example since they are so popular with 2D games. That sort of is the style I'm going for. Link to comment Share on other sites More sharing options...
Martiny Posted April 14, 2014 Share Posted April 14, 2014 Is this the movement you are trying to achieve? https://googledrive.com/host/0Byme41zCWn4pdlJ6ekJjaExOTXc/ Here's the code:var sprite1;var speed = 5; function preload() { game.load.image('sprite1', 'assets/bird.png'); }function create() { sprite1 = game.add.sprite(200, 200, 'sprite1'); game.physics.enable(sprite1, Phaser.Physics.ARCADE);}function update() { if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) { sprite1.body.x -= speed; } if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) { sprite1.body.x += speed; } if (game.input.keyboard.isDown(Phaser.Keyboard.UP)) { sprite1.body.y -= speed; } if (game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) { sprite1.body.y += speed; }}Without velocity. Link to comment Share on other sites More sharing options...
rich Posted April 14, 2014 Share Posted April 14, 2014 Thanks Raikoh there are some good stuff there, but I'm sort of shocked there isn't any RPG top/down style example since they are so popular with 2D games. That sort of is the style I'm going for. Like this one? http://examples.phaser.io/_site/view_full.html?d=groups&f=depth+sort.js&t=depth%20sort xnamex 1 Link to comment Share on other sites More sharing options...
rpiller Posted April 14, 2014 Author Share Posted April 14, 2014 I don't see any tile collision in either of those examples. Normally the character wouldn't be able to walk on certain tiles. So the question would be how do you move the character with +/- x & y but still get tile collision on the tilemap. The sorting seems interesting but I would almost expect to be able to place the characters into a certain layer so the sorting is handled that way. Normally you would have a background layer, object layer, & foreground layer. Trees are generally placed in 2 layers. The trunk of the tree in one layer that the player collides with, and the top part of the tree in the foreground layer so the characters are drawn behind them when they walk "behind" the tree. Link to comment Share on other sites More sharing options...
blues_driven Posted October 23, 2014 Share Posted October 23, 2014 You have to choose a layer to enable collision on like this:map.setCollisionByExclusion([], true, layer1);and then set your player sprite to collide with it in the update function like this:game.physics.arcade.collide(player.sprite, layer1); Dread Knight 1 Link to comment Share on other sites More sharing options...
Recommended Posts