How to change scenes

Help & Support
#1

link:PlayCanvas | HTML5 Game Engine
is this good

#2

@MATURE At first glance I see you have the scene change script attached to both the button and itā€™s text element. Not sure this will work.

#3

it didnt work

#4

@MATURE Could you let me know what didnā€™t work. As I see from the project link you have provide there have been no changes.
image

Both the Button and the Text have the script.

#5

https://launch.playcanvas.com/1756965?debug=true
when i click the start button I doesnā€™t work

#6

Hi @MATURE!

It seems there is a problem with your script.

Probably you renamed the script?

image
image888Ɨ167 9.21 KB

If you parse the script you can see this in the editor too.

image

I suggest to remove the script from the entity and add it again.

2 Likes
#7

@MATURE @albertos is correct. You will need to remove the script from the txt element and keep it removed. Also, remove it from the button. There is an error in your script. Here is the correction.

var Scenes = pc.createScript('scenes');
Scenes.attributes.add('sceneName', {type: 'string'});

// initialize code called once per entity
Scenes.prototype.initialize = function() {
    this.entity.button.once('click', function() {
        this.app.scenes.changeScene(this.sceneName);
    }, this);
};

The very first line is where the issue is. Notice that the var Is Scenes with capital S. The pc.createScript must be different. As you can see I just changed it to scene no capital S. Save this correction and re add to your button.

You also seem to have a very large asset which is the mandalorian ship. It may take long to load this.

1 Like
#8

it changes the scenes but it says
Cannot read properties of undefined (reading ā€˜onceā€™)

#9

@MATURE I have loaded your project and ran it. I am not seeing the error but did notice your changes to the Menu.js script. Is there a reason you have decided to make the button a variable?

var Menu = pc.createScript('menu');
Menu.attributes.add('sceneName', {type: 'string'});

Menu.prototype.initialize = function() {
    var button = this.entity.button;
    if (button) {
        button.once('click', function() {
            this.app.scenes.changeScene(this.sceneName);
        }, this);
    }
};

I am not really sure if using the same term ā€œbuttonā€ is causing what you are seeing or not. I am using Chrome what browser are you using?

#10

also chrome
it allows easier and more efficient access to the button component throughout the script. This way, the script can attach an event listener to the buttonā€™s ā€œclickā€ event, and when clicked, it will change the scene to the one specified by the ā€œsceneNameā€ attribute.

#11

now it doesnt show the error thanks