Jump to content

Not able to make sprite interaction to work


Recommended Posts

I'm trying to build a simple game menu, containing some clickable sprites, which will be used as buttons to navigate around the menu.

( I'm using the latest pixi.js (v4.3.5) )

Structure of my app:

  • loader.module ( makes use of the pixi.loaders.Loader )
  • events.module (basic event sub/pub module)
  • base.view
  • menu.view ( extends base.view )
  • game.main

How it all works now ?

Both all resources and ui elements have to be explicitly defined, before initializing the view.

so in the menu.view, the follwoing attributes have to be defined.

 this.resources = [
      { name: 'start', src: 'img/start.png'},
      { name: 'start2', src: 'img/start2.png'}

   this.ui = [{
        name: 'start', /// resource name
        type: 'img',
        pos: { x: 0, y: 0 }

Now I only need to call view.init() to get it all loaded and drawn. On the visual side, evrything works perfectly, however the 'start' sprite (which has it's interactive and buttonMode set to true) is not reacting to any mouse events.

The below method is responsible for getting the required resource and returning a new sprite. It also enables the actual interaction functionality as part of this process. But the test function is never triggered for some reason.

__getSpriteObject( element ){
        let sprite = new PIXI.Sprite( this.loader.loader.resources[ element.name ].texture );
        sprite.x = element.pos.x;
        sprite.y = element.pos.y;

        sprite.interactive = true;
        sprite.buttonMode = true;
        console.log( sprite )

        sprite.on('pointerdown', function(){
        return sprite;

If the above info isn't sufficient , here is also a working example.

Also posted this question on SO: http://stackoverflow.com/questions/42272895/not-able-to-make-sprite-interaction-to-work


Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...