Basic scrolling with a tile map in phaser ce
So there are many ways to go about handing scrolling a tilemap in phaser ce, in this post I will be writing about one of the simplest ways to go about doing so that I have come across so far. This way of doing it should work okay for most projects, but with projects where map data is being generated on the fly at run tile, or projects that involve a very large collection of map data across many files, they way of doing here might not cut it.
1 - what to know
This is a post where I am writing about a basic way to go about scrolling a tile map in phaser ce. This might be the quick and simple way to go about doing it but it might not always be best depending on the project. I still do not have as much experience with tile maps, and all that relates to them, but in the event that I find other ways of doing this that are better when it comes to large maps I will likely write a new post on it, and hopefully update this one.
1.1 - This is a phaser ce 2.x post
2 - A Basic tile map scrolling demo in phaser ce
So for this example I will just put together a quick little demo that involves an external map in the tiled json format, and following a sprite by just using game.camera.follow.
2.1 - Create a little guy sprite
So for starters I will want to start with a method that creates the sprite that the camera will follow first because of the nature of this post. If you are not aware of it to begin with game.camera.follow can be used to make the camera follow a sprite. This is what will be used to have the camera do that.
Once I have this method together then it is just a matter of setting everything else up including of course the tile map.
2.2 - Create the map
Here is the create map method that will be called once I have all other assets loaded during the preload state.
2.3 - Create the layer
When I create a map I will also need to create a layer. Notice that I am also resizing the game world to the size of that layer as well. This is one way to go about resizing the game world, the nice thing about this method is that it sets it to the size of the tile map layer that will be scrolling.
2.4 - The JSON file
Here is the Json file that I will be using for this example. I will not be getting into this json format in detail here, but there is good documentation on it at the tiled website.
2.5 - The Phaser.Game instance
So now it is time to put it all together by working out what needs to get done with the main Phaser.Game instance.
3 - Conclusion
So when this project starts up I am able to move my little guy character around in the map, and things scroll around juts fine. A solution like this seems to work fine when it comes to simple little examples like this, but as things scale up it might fall short.