hindmost Posted August 30, 2016 Share Posted August 30, 2016 I'm trying to make a top-down game where the player sprite is fixed in the center of screen and the background is moving (scrolling) in the direction opposite to the player's direction, so it results in effect of the player's movement. I started with Invaders example. It uses TileSprite and its tilePosition property to make vertical scrolling of the background. This works good for linear scrolling in fixed direction (vertical or horizontal). But in my case I need implement scrolling (i.e. movement) in any direction. Furthermore I need such physics features as acceleration and drag to be applied to the player sprite. Here is a sort of what I want to get:http://phaser.io/sandbox/OoPDpTwx As can be seen it features constant movement only, no acceleration and other physics stuff. And I had to calculate angular movement manually. How can I reproduce such effect using Phaser physics? I've tried to enable camera following to the player sprite like here. Here is my code:http://phaser.io/sandbox/dowAsYWa But it doesn't work. What am I doing wrong? Link to comment Share on other sites More sharing options...
lumoludo Posted August 31, 2016 Share Posted August 31, 2016 So the reason the camera doesn't follow your player in the last example you linked is because the Phaser camera clamps to the game's world bounds. Be default, the world bounds are going to be set to the game.width and game.height I believe, or in this case, the size of the iframe that the game is running in. You can manually set the game bounds in your create function, like so: var ReallyLargeWidth = 99999; var ReallyLargeHeight = 99999; game.world.setBounds(-ReallyLargeWidth/2, -ReallyLargeHeight/2, ReallyLargeWidth, ReallyLargeHeight); Obviously though, this isn't infinitely scrolling. This will only scroll up to whatever number you decide to use. As a different approach, you could try this trick that appeared to work when I was playing around in your example: 1. Take out the game.camera.follow(player); line in your create function, as it won't be necessary. 2. In your update function, add the following line of code after your player movement: game.world.setBounds(player.x - game.width/2, player.y - game.height/2, game.width, game.height); This snippet will update the world bounds to always be centered around the player. It's similar to having the camera follow your player, but it isn't restricted by the world bounds as it just changes what they are every update. You'll need to tile your background still, but hopefully this will get you closer to where you are aiming. samme 1 Link to comment Share on other sites More sharing options...
samme Posted August 31, 2016 Share Posted August 31, 2016 Hi hindmost, I would try move the player with Arcade Physics nullify camera bounds camera tracks the player tileSprite is fixedToCamera tileSprite scrolls opposite to the camera position See http://phaser.io/sandbox/GfVFRAlU/play symof 1 Link to comment Share on other sites More sharing options...
samme Posted August 31, 2016 Share Posted August 31, 2016 For angular motion with Arcade Physics see http://phaser.io/examples/v2/arcade-physics/asteroids-movement . Here you can move the World bounds with the player as @lumoludo suggested: http://phaser.io/sandbox/QIpZGrVr/play lumoludo 1 Link to comment Share on other sites More sharing options...
hindmost Posted August 31, 2016 Author Share Posted August 31, 2016 @lumoludo, @samme, thank you very much! Link to comment Share on other sites More sharing options...
lumoludo Posted August 31, 2016 Share Posted August 31, 2016 @samme Ah, yes, your solution looks a bit nicer than mine. I didn't see that bounds.centerOn() function. Link to comment Share on other sites More sharing options...
Recommended Posts