javascript 如何在 Phaserjs 中制作无限侧滚动背景?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/21669312/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I make an infinite side scrolling background in Phaserjs?
提问by mage
I'm using phaser.js to make a game and I cannot find any tutorials on how to make the background scroll infinitely. I'd like the background to tile/repeat sideways, and infinitely as the character moves right.
我正在使用 phaser.js 制作游戏,但找不到任何有关如何使背景无限滚动的教程。我希望背景横向平铺/重复,并且随着角色向右移动而无限重复。
I am currently using a camera and having the camera follow the character.
我目前正在使用相机并让相机跟随角色。
Here's my idea about how to do this: Check the position of the camera constantly in update()
, and then move it to the beginning of gameplay (the very left) along with the character at that time. I think that this would probably not be a smooth transition though, so I'm wondering if there is a better way to do it.
这是我关于如何执行此操作的想法:在 中不断检查相机的位置update()
,然后将其与当时的角色一起移动到游戏开始(最左侧)。我认为这可能不会是一个平稳的过渡,所以我想知道是否有更好的方法来做到这一点。
回答by luschn
This can be done with a tile sprite and by moving "tilePosition":
这可以通过瓷砖精灵和移动“tilePosition”来完成:
var bgtile;
function preload () {
game.load.image('bgtile', 'bgtile.jpg');
}
function create () {
bgtile = game.add.tileSprite(0, 0, game.stage.bounds.width, game.cache.getImage('bgtile').height, 'bgtile');
}
function update () {
bgtile.tilePosition.x -= 1;
}