Jump to content

What Can Groups Do?


Recommended Posts



So I think I'm spending too much time repeating code over and over again I'm wondering what I should actually be using groups for. 


I'll use my statue as an example;

        //Statue        this.statueGroup = this.add.group();        statue = this.statueGroup.create(80,52, 'statue');        statue.animations.add('fire', [0,1,2,3,], 10, true);        statue.animations.play('fire');        statue1 = this.statueGroup.create(128,52, 'statue');        statue1.animations.add('fire', [0,1,2,3,], 10, true);        statue1.animations.play('fire');        statue.body.immovable = true;        statue1.body.immovable = true;

Here all I have is 2 sprites (the same sprite) drawn at different locations, I want to apply the same animation, and play it at the same time but I created it twice for each statue. Should I be creating the animation for the group? and then playing it for the group? 

What should I be using these groups for thanks!

Link to comment
Share on other sites

To answer your question about what groups do: presently I use groups for a few purposes

  • Separating entities into different display layers
  • Easy collision handling
  • Sprite recycling (this is a new revelation of mine, and super useful)

In your case, I think Rich posted something about this a few months ago: http://www.html5gamedevs.com/topic/2794-how-to-add-an-animation-to-a-group-sprite/

Link to comment
Share on other sites

I do not know your purposes of your group. I show to you how I using my groups (I'm not phaser pro). Maybe it will be useful.

var waypointsXY = {'waypoint_1': {'x':1454, 'y':353},'waypoint_2': {'x':1454, 'y':853} };// Data of waypoints items - it's potential group elements

If you using TILED map, you can store this elements in map directly via Tiled Objects



    waypoints = game.add.group();    for(var key in waypointsXY) {        waypoints.create(waypointsXY[key].x, waypointsXY[key].y, 'wall');        ///MORE CODE... you can apply animation here    }//We get all objects from waypointsXY and put to the  group "waypoints"


    game.physics.overlap(object, waypoints, check, null, this);    //Simple check overlaping between object and group waypoints and if true - call check() functon

Your collision handler function:

 check: function(object, waypoint) { // YOUR CODE if object ovelapping your with group item // for ex. I'm operate with getIndex() index variable of item, and return to the update method, where I used getAt() method to get group element    },
Link to comment
Share on other sites


  • Recently Browsing   0 members

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