Phaser 3 simple score system

Hi all,

I’m extremely new to coding and Phaser in general. I am trying to create a very simple scoring system with coins and was wondering what would be the best way. I’ve tried to follow some tutorials but it just gives me a black screen every time. At the moment all I have is this;

this.load.image(“coin”, ‘assets/coin.png’);
this.apple = this.physics.add.sprite(200, 290, ‘coin’);

Hi
What inspect element shows in your browser?
Can you upload all your code here?

1 Like

You need to give us more about what code you have. You can use htttps://www.jsfiddle.net or just format code here.

You can follow this tutorial, Phaser official tutorial for making your first game, which has a score system with collectible items like you want: https://phaser.io/tutorials/making-your-first-phaser-3-game/part1
You can find it in Phaser labs as well, every step in it: https://labs.phaser.io/index.html?dir=games/firstgame/&q=

Phaser labs can be your rescue many times for examples of may aspects of Phaser usage (cause docs, are no offense, but not very beginner/game-developer friendly): https://labs.phaser.io/

1 Like

Making your first Phaser 3 game has a simple scoring.

1 Like

Sorry for late response, had to take care of personal stuff.

As fselcukcan mentioned the Phaser official tutorial, I decided to try it out and it didn’t give me the black screen, yaay. However, I’m unable to move now and the coins just fly through the map.

Here’s the jsfiddle to my code - https://jsfiddle.net/r3dmnvgo/

This is what console shows me;
Annotation%202019-12-03%20135855

First of all for the fiddles you need to add the scripts as well, from resources in the side panel :slight_smile:

You simply need to call the player as this.player since this is the way you have created it. There is nothing defined as player in your code.

For the coins, stars, fly through do you mean through the world bounds. If so make the collide with the world bounds: star.setCollideWorldBounds(true); inside the stars.children.iterate you have written. Also there may be a way to do this with the group, stars for convenience. Not sure about those currently. But if you bound the bottom of the world by putting a ground platform which you set to collide with stars then you will not need this. Stars will hit the ground and not fly through. I guess you have some problem with placement or creation of your platforms but I do not know what ii is?

In the fiddle could not see you star assets.

Also the assets cannot be found anymore in the fiddle, naturally, you can add their phaser labs address if you want the assets in the official tutorial. Pattern like https://labs.phaser.io/src/games/firstgame/assets/dude.png.

1 Like

You can use https://codepen.io/pen?template=XYJaQE.

1 Like

Thank you very much. I managed to successfully implement the stars and score counter. And yes, I do have some issues with my platforms, I can walk through the side of the platform inside the model itself.

At the moment I am trying to stop the game as soon as every single coin is collected and output a winning message but no luck in that.

let winScreen = false;

function gameWin() {
if (score == 150)
this.add.text(64, 64, ‘YOU WIN’, { fontSize: ‘32px’, fill: ‘#000’ });
winScreen = true;
}

How do I call this function when all of the coins are collected? It doesn’t seem to be working. 150 is the maximum points you can achieve.