RNG on images(tiles)

Phaser 3
1

Hi :slight_smile:
If anyone could help with this:

Is it possible to make a function that will give my images(25 tiles, 5x5) a random value(RNG)?

The idea is the images have to change randomly after x seconds, and until a Sprite collides with it.

However, not all of the images have to change simultaneously only some.
Thats why i have to give it a random value first, right?

My first project in Phaser, so i donā€™t have alot of experience in it so far. Thanks for understanding.
If you donā€™t undertand my question, please let me know!

2

:wave:

A random value for what? Or whatā€™s changing?

3

Basically what iā€™m trying to do, is to give every image a number from 1-25,
then make a function which Randomly selects a number from 1-25.
That number which is randomly selected is a image, that has to change to another image.

4

what do you mean by ā€œevery imageā€?
So you allready got something like

this.images[ i ] = this.scene.add.image( x, y, "texturekey", frameNumber )

and now u want to change your image to another frame from your spritesheet?

this.images[ i ].setFrame( newFrameNumber )

Or something like this?

5

As you can see on the picture, iā€™ve 25 images on the canvas.

I want some of the images to randomly change. Iā€™ve the 25 other images ready.
My idea is to give every image a number,
then use the RandomNumber function so that ex. if 12 is selected, it will make image change.

Iā€™ve this:

preload(){

    this.load.image('player', 'billeder/player.png');

    this.load.image('gametilelava1', 'billeder/gametilelava1.png');
}

Iā€™ve been positioning every image by x and y, like this:
this.walls.create(61,61, ā€˜gametilelava1ā€™); //A1
this.walls.create(61,178,ā€˜gametilelava1ā€™); //B1
this.walls.create(61,295,ā€˜gametilelava1ā€™); //C1

Iā€™m sorry if iā€™m not being clear, iā€™m not even sure if what iā€™m asking to do is possible.

tiless
tiless599Ɨ598 4.92 KB

1 Like
6

maybe something like this one:

You have to store each image u want to change later in a variable / array. So you can reference it later on.
And than you can use the ā€œsetFrameā€ or ā€œsetTextureā€ method of ā€œimageā€ game object
https://photonstorm.github.io/phaser3-docs/Phaser.GameObjects.Image.html#setTexture__anchor

Hope this helps you and its pointing in correct direction :slight_smile:

1 Like
7

Yes, you can load 25 images (ā€˜gametilelava1ā€™ through ā€˜gametilelava25ā€™) and then switch them on a game object with setTexture().

Or if they arenā€™t too large you can combine all of them in your image editor and the load 1 spritesheet with 25 frames (0 through 24) and then switch them with setFrame().

8

Thanks for the demonstration, very nice of you to show the solution.
However, being honest with you, i donā€™t understand everything in that code. I must read/see some more tutorials in order to implent in my own project.

Thanks.