Jump to content

checkOverlap method in Phaser


weratius
 Share

Recommended Posts

Hi!

 

I'd like to ask you smth. guys:

 

Have you ever tried to use a checkOverlap method, that checks whether dragging element is overlapped lying one or not.

 

Here is the code:

checkOverlap: function(spriteA, spriteB) {   var boundsA = spriteA.getBounds();   var boundsB = spriteB.getBounds();   return Phaser.Rectangle.intersects(boundsA, boundsB);}

I always have bugs with that: sometimes when I'm dragging element and overlap another one this method returns false, but elements are overlapped

 

Why does that happen?

 

Thank you in advance)

Link to comment
Share on other sites

looks like i was not clear enough.can you show code where you use this method?

I use that in the update method (sorry, I can't show whole my code, because I 7 interfaces). I just to need to remove collisions on the overlapping

 

I just need to check whether one sprite overlaps another one or not while dragging the first one, that's all

 

How is it better to do that?

 

I saw another topic http://www.html5gamedevs.com/topic/6488-rectangle-collides-with-spritebody/ where the answer was to use the "body" property, but I can't do that, because my sprites have fixedToCamera property and also they can be dragged

 

I will appreciate any help, thank you!

Link to comment
Share on other sites

Why don't you use Arcade already implemented overlap() method?

 

Doc : http://phaser.io/docs/2.3/Phaser.Physics.Arcade.html#overlap

checkOverlap: function(a,  {        return game.physics.arcade.overlap(a, ;}

I did smth like this

 

But there are still problems: I'm dragging a sprite, overlapping another one, but it returns false

 

I don't get it at all

Link to comment
Share on other sites

Please check this example. It does exactly what you're looking for : http://phaser.io/examples/v2/sprites/overlap-without-physics

In your example is the same that I did

 

I have problem with overlapping,  I'm dragging a sprite, overlap another one, but it still returns false

 

I have problems that it sometimes returns false when I overlap them

 

in console I see smth like this: 

false

5 true

2 false

6 true

and so on

 

but they are overlapped

 

here is the code:

update: function() {        if(this.dragStarted) {          //some code          var key = // smth happens;          // some code          this.checkOverlapWeaponInHold(key);        }},checkOverlapWeaponInHold: function(holdKey) {        var weapons = this.itemsObject.items;        if(weapons[holdKey] != null) {            if(weapons[holdKey].item != null && weapons[holdKey].item.type == 'weapon' && this.checkOverlap(this.draggingElement, weapons[holdKey].item)) {                this.weaponInHoldOveredKey = holdKey;            }         } },
checkOverlap: function(a, B) {
 
        var boundsA = a.getBounds();
        var boundsB = b.getBounds();
 
        return Phaser.Rectangle.intersects(boundsA, boundsB);
    },
 
stopDrag: function(currentElement) {  
 
        if(this.weaponInHoldOveredKey != 0) {
this.changeWeaponPlace(currentElement, this.weaponInHoldOveredKey);
            this.weaponInHoldOveredKey = 0;
 
        } 
 
        this.dragStarted = false;  
        this.draggingElement = {};
    },
 
changeWeaponPlace: function(currentElement, overedKey) {
 
        console.log('overedKey = ', overedKey);
 
        var lyingElement = this.itemsObject.items[overedKey].item;
        
        //animation
        game.add.tween(currentElement.cameraOffset).to({ x: lyingElement.cameraOffset.x, y: lyingElement.cameraOffset.y }, 250, Phaser.Easing.Linear.None, true);
        game.add.tween(lyingElement.cameraOffset).to({ x: this.START_X, y: this.START_Y }, 250, Phaser.Easing.Linear.None, true);
//place changing
var newObject1 = $.extend(true, {}, playerInfoObject[currentElement.key]);
        var newObject2 = $.extend(true, {}, playerInfoObject[overedKey]);
 
        playerInfoObject[overedKey] = $.extend(true, {}, newObject1);
        playerInfoObject[currentElement.key] = $.extend(true, {}, newObject2);
 
        newObject1 = {};
        newObject2 = {};
//flags
this.itemsObject.items[currentElement.key].item.changed = true;
        this.itemsObject.items[overedKey].item.changed = true;
 
        //ajax
        this.sendSwapItem(currentElement.key, overedKey);
    }
 
Link to comment
Share on other sites

could you try this?

update: function() {        if(this.dragStarted) {          //some code          var key = // smth happens;          // some code          this.checkOverlapWeaponInHold(key);        }},checkOverlapWeaponInHold: function(holdKey) {        var weapons = this.itemsObject.items;        if(weapons[holdKey] != null) {console.log(weapons[holdKey].item);console.log(this.draggingElement);            if(weapons[holdKey].item != null && weapons[holdKey].item.type == 'weapon' && this.draggingElement.overlap(weapons[holdKey].item) {                this.weaponInHoldOveredKey = holdKey;            }         } },

and check in both console logs:

1-both ARE sprites

2-the value of weapons[holdKey].item.type

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.

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

  • Recently Browsing   0 members

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