I'm making a sword game in which you have to collect coins to get big and you fight people. Here's what I have so far:
Notice how the player gets bigger as it collects coins. After a while, you get so big that you cover the entire screen.
I realized I have to zoom out the camera based on the players size.
This is what I have for camera (in create function)
this.cameras.main.startFollow(this.mePlayer);
I added this line of code before it:
this.cameras.main.setZoom(0.5)
Now it turns like this. The text is all smaller and for some reason my tileSprite background breaks too.
Here is the code for the text.
//killcounter
this.killCount = this.add.text(window.innerWidth / 1.5, 0, 'Kills: 0', {
fontFamily: 'Georgia, "Goudy Bookletter 1911", Times, serif'
}).setFontSize(40).setDepth(101);
this.killCount.scrollFactorX = 0
this.killCount.scrollFactorY = 0
//player+fpscounter
this.playerCount = this.add.text(this.cameras.main.worldView.x*this.cameras.main.zoom, this.cameras.main.worldView.y*this.cameras.main.zoom, 'Players: 0' + "\nFPS: 0", {
fontFamily: 'Georgia, "Goudy Bookletter 1911", Times, serif'
}).setFontSize(20).setDepth(101);
this.playerCount.scrollFactorX = 0
this.playerCount.scrollFactorY = 0
this is the code for my camera
this.cameras.main.startFollow(this.mePlayer);
...and this is the code for my background
//in create function
this.background = this.add.tileSprite(0, 0, window.innerWidth, window.innerHeight, 'background').setOrigin(0).setScrollFactor(0, 0);
this.background.fixedToCamera = true;
//in update function
this.background.setTilePosition(this.cameras.main.scrollX, this.cameras.main.scrollY);
Is there a way I can keep the text locked so that when the camera zooms out, it stays at the same position?
Thanks to samme for helping me solve this.
In the end I created another camera called UICamera.
I used the ignore
function to ignore all of the game objects on that camera.
And I ignored all the text, minimap, ui, and tilesprite background on the main camera.
Then, to zoom out, I would just zoom out the main camera and adjust the tileSprite scale manually.