Object visiblity

Help & Support
1

Hello.
I have a house model and i want to show different floors by pressing buttons in UI.
I’m just begin leaning JavaScript and need some help with scripting.
I’ll be glad if someone could help me to write a script with show/hide object by pressing buttons in UI
Thank you and sorry for my English)

2

Hi, if you want just to enable/disable entities you can use enabled to do it making a function when if Key_X wasPressed this.app.root.findByName(‘entityname’).enabled=true or false if you have a model of the floors is better to move the camera, anyway for specific help it’s better if you also give a link to the project. Enjoy.

1 Like
3

My project:
https://playcanvas.com/editor/scene/603115

4

i’m getting the object from scene by ‘attributes.add’ and trying to switch it’s ‘enable’, but nothing happens.
Is there a way to switch ‘enable’ from true to false and back?
Thank you!
Here’s code:

var Floor1Pressed = pc.createScript('floor1Pressed');

Floor1Pressed.attributes.add('activeAsset', {
    type:'asset',
    assetType:'model'
});
    
Floor1Pressed.prototype.onMouseDown = function (event) {
    // If the left mouse button is pressed, change the mesh enabled
    if (event.button === pc.MOUSEBUTTON_LEFT) {
        entity.model.meshInstances[0].enabled = false;
    }
};
5

so first of all the method onMouseDown is never executed.
you should add an initialize method that subscribe for a mouse down event:

// initialize code called once per entity
Floor1Pressed.prototype.initialize = function() {
    this.entity.element.on('mousedown', this.onMouseDown, this);
};

Then in the onMouseDown the variable entity is not defined. You should use this.entity.model...

Finally, I don’t think you want to enable/disable an asset in the project (it would be like to enable/disable a file), but you’ll want to enable/disable an entity in the scene.
So your attribute should be of type ‘entity’ (without assetType) and you should assign to it the floor in the scene that you want to hide.
Then in the onMouseDown function you will do this.entity.activeAsset.enabled = false;

6

Thank you for your help, but i can’t understand how to script this.
I’ll better hire a programmer to make this.

7

One way to do this is to add a tag to all the elements that you want to be hidden. Eg add a ‘floor1’ tag to all the floor 1 entities, ‘floor2’ for all floor 2 etc

Then you can use this.app.root.findByTag to get all the entities as an array with the tag you pass to it and disable/enable them.

2 Likes
8

Yes, this is actually the best approach, for two reasons.

  1. In PlayCanvas editor, grouping objects inside a new parent messes up the position of the children. This doesn’t happen in Unity, and is really really annoying.
  2. Using tags you can have the same entity to be part of more then one logic group.
9

This is a major PITA! Would be great to have an options in settings, or even holding down a key when dragging the entities, to change this behaviour.

1 Like
10

Hello, I tried using this.app.root.findByTag() as an array for changing the cursor in buttons, but it seems to not work. Here’s my code:

var allBtns = this.app.root.findByTag('btn');    
allBtns.element.on('mouseenter', this.onEnter, this);

BtnEvents.prototype.onEnter = function(event){
    // set the cursor to pointer on hover
    document.body.style.cursor = 'pointer';
    var sndFX = this.app.root.findByName('SFX');
    sndFX.sound.play('btnHover'); // play sfx
};

It gives error: Cannot read property ‘on’ of undefined

I always use findByTag like findByName but they don’t seem to work the same way, so I don’t know if I’m using findbytag correctly.

11

HI @nkkll-correa,

Just looking at the code you posted:

Is this portion inside of your initialize function?

12

findByTag returns an array so allBtns is an array of entities.

13

Yeah, it’s in the initialize function

BtnEvents.prototype.initialize = function() {
    var allBtns = this.app.root.findByTag('btn');    
    allBtns.element.on('mouseenter', this.onEnter, this);
};
14

Hi @nkkll-correa,

As @yaustar mentioned, findByTag() returns an array, so you will want to use a forEach() to loop through the results and subscribe to the mouseenter event.

1 Like