Using sprites as buttons to do different things.

[ez2rfc]

Hi guys! I'm pretty new to java script and babylon.

 

I want to use sprites that makes different result for my scene.

 

so i tried to do coding like below

 

 

 //Create a manager for the Dinning's sprite animation    var spriteDinning = new BABYLON.SpriteManager("icon_Dinning", "textures/dining.png", 1, 200, scene);    var Dinning = new BABYLON.Sprite("Dinning", spriteDinning);    Dinning.position = new BABYLON.Vector3(-10.11, 6.8, 13.2);    Dinning.isPickable = true;    Dinning.size = 2;        var spriteSleeping = new BABYLON.SpriteManager("icon_Sleeping", "textures/beds.png", 1, 200, scene);    var Sleeping = new BABYLON.Sprite("Sleeping", spriteSleeping);    Sleeping.position = new BABYLON.Vector3(10.11, 6.8, 13.2);    Sleeping.isPickable = true;    Sleeping.size = 2;    scene.onPointerDown = function (evt) {        if (Dinning.hit) {            Dinning.position = new BABYLON.Vector3(0,0,0);        }        if (Sleeping.hit) {            Sleeping.position = new BABYLON.Vector3(0, 5,0);        }    };

 

But it seems not to be working How sad is this....

 

Anybody can help me?

[GameMonetize]

Hello, there is no hit property on sprites. You need to use scene.pickSprite

 

You should check this demo to see how it works: http://www.babylonjs-playground.com/?8

[iiceman]

Hi ez2rfc and welcome to the forum!

 

First of all, do you know the playground? http://www.babylonjs-playground.com/# You can recreate your problems there and then show us you code as an live example and we try to help you out by directly editing your code.

 

Second: you are lucky because Deltakosh added this to the framework not too long ago. As you can see in this playground here: http://www.babylonjs-playground.com/?8 you can click the trees, which are sprites, and then the rotate a bit.  So how does that work - I think the important part is this here:

    // Picking    spriteManagerTrees.isPickable = true;    spriteManagerPlayer.isPickable = true;    scene.onPointerDown = function (evt) {        var pickResult = scene.pickSprite(this.pointerX, this.pointerY);        if (pickResult.hit) {            pickResult.pickedSprite.angle += 0.5;        }    };

The scene.pickSprite function already does all the complicated things you you and returns you a pick ruslt with the information about what sprite has been clicked. All you have to do now is to check if some actually got hit (pickruslt.hit) and then which of your sprites has been hit (pickresult.pickedSprite). Depending on that you can now change the position of the picked sprite.

 

I hope that helps. Let us know if you need more help, maybe create a playground next time so we can try things out with your code!

 

 

I jsut saw Deltakosh answered faster, but I still post this answer ... just because