How do I create an in-game button?

Help & Support
,
1

I am trying to create a button that whenever the player’s hit box enters the button’s collision box that triggers another script to move something. Right now I am just trying to get it to work and I have no idea how to.

// code here
Script A

Button.prototype.initialize = function() {
    if (this.target) {
        this.entity.collision.on('triggerenter', this.onTriggerEnter, this);
    }
};
Button.prototype.onTriggerEnter = function() {
};

Script B

UnlockDoor.prototype.initialize = function() {
};

UnlockDoor.prototype.update = function(dt) {

    var y = -.003;
    if (otherscript == true){
        forceY = this.entity.translateLocal(0,y,0);
    };
};
2

see some of these examples:PlayCanvas Examples

3

Sorry but I don’t think any of these examples are what I am looking for. What I am trying to do is have a cylinder that whenever the hit box is entered by the player then it activates and opens a door.

5

Hi @UpbeatRobin and welcome!

It looks like you mean ‘trigger’ instead of ‘button’. It’s a little bit difficult to give an useful answer on your question, because you need a couple of different things.

Below an example based on your own scripts. For this the player entity need a Player tag and the door entity need to have the name Door.

Trigger.prototype.initialize = function() {
    this.entity.collision.on('triggerenter', this.onTriggerEnter, this);
};

Trigger.prototype.onTriggerEnter = function(entity) {
    if (entity.tags.has('Player')) { 
        this.app.root.findByName('Door').script.unlockDoor.unlocked = true;
    }
};

UnlockDoor.prototype.initialize = function() {
    this.unlocked = false;
};

UnlockDoor.prototype.update = function(dt) {
    if (this.unlocked === true){
        console.log('Open');
    }
};

Instead of using the update function you can execute a function with a tween to open the door.

https://developer.playcanvas.com/en/tutorials/tweening/

6

Thank you so much for this.