treshaque

How to drag sprite from a scaled or rotated group

Recommended Posts

Hi everybody,

 

Here's my problem. I have a group, which I scale or rotate. Now if I drag a sprite in it, the sprite moves totally wrong. Its shift is scaled and rotated too!

var gr = game.add.group() ;var sp = gr.create( 100, 100, 'face' ) ;gr.scale.x = -2 ;sp.enableInput = true ;sp.input.enableDrag( true ) ; 

Say, if the group is flipped by group.scale.x = -1, the sprite motion will be mirrored: the sprite and the cursor go different directions. Looks more like a bug of dragging. I'd appreciate any practical advice or workarounds. I have a big tree of nested groups, do I need to implement a multistage cast of the input coordinates?

 

Thank you.

Share this post


Link to post
Share on other sites

At the moment I use the following:

function transformParentToChild( x, y, group ){    x -= group.x ; y -= group.y ;    var sin = Math.sin( group.rotation ), cos = Math.cos( group.rotation ) ;    var x_ = x * cos + y * sin, y_ = y * cos - x * sin ;    return [ x_ / group.scale.x, y_ / group.scale.y ] ;}function transformScreenToGroup( x, y, group ){    if ( group.parent ){        var mid = transformScreenToGropup( x, y, group.parent ) ;        x = mid[ 0 ] ; y = mid[ 1 ] ;    }    return transformParentToChild( x, y, group ) ;}...
sprite.events.onDragStart.add( function(){ env.draggee = sprite ; }, this ) ;
sprite.events.onDragStop.add( function(){ env.draggee = null ; }, this ) ;

...

var pos = transformScreenToGroup( game.input.x, game.input.y, env.draggee.parent ) ;

env.draggee.x = pos[ 0 ] ;

env.draggee.y = pos[ 1 ] ;

...

 

Have I missed the standard way to transform world/screen coordinates to/from group?

Share this post


Link to post
Share on other sites

You want to look at the 'getLocalPosition' method of the Input class.

    /**    * This will return the local coordinates of the specified displayObject based on the given Pointer.    * @method Phaser.Input#getLocalPosition    * @param {Phaser.Sprite|Phaser.Image} displayObject - The DisplayObject to get the local coordinates for.    * @param {Phaser.Pointer} pointer - The Pointer to use in the check against the displayObject.    * @return {Phaser.Point} A point containing the coordinates of the Pointer position relative to the DisplayObject.    */    getLocalPosition: function (displayObject, pointer, output) {.......

You can access the global Input instance as the property called 'input' of your main game or current state instance.

Share this post


Link to post
Share on other sites

You want to look at the 'getLocalPosition' method of the Input class.

    /**    * This will return the local coordinates of the specified displayObject based on the given Pointer.    * @method Phaser.Input#getLocalPosition    * @param {Phaser.Sprite|Phaser.Image} displayObject - The DisplayObject to get the local coordinates for.    * @param {Phaser.Pointer} pointer - The Pointer to use in the check against the displayObject.    * @return {Phaser.Point} A point containing the coordinates of the Pointer position relative to the DisplayObject.    */    getLocalPosition: function (displayObject, pointer, output) {.......

You can access the global Input instance as the property called 'input' of your main game or current state instance.

 

How did I miss this method.  This solves a TON of things for me!  Thanks!

Share this post


Link to post
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.

Guest
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.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.