Jump to content

Extended Phaser.Sprite object seems to take issue with Groups?


NewGuy
 Share

Recommended Posts

Hello again, I've run into an issue I can't seem to solve by mindlessly Googling. Essentially I've created a class 'Card' that extends Phaser.Sprite and when I create these card objects and try add them to a cards group, they don't get added at all!? Why is this? I also have a class 'maingame' which holds my standard Phaser.Game funcs (preload, create, update). I create a number of cards inside a for loop in my create func like so;
 

...//inside create()for (var i = 0; i < num_cards; i ++) {    card = new Card(this.game, this.game.width/2, this.game.height/2,                    'card_unknown', this.order_array[i], scale);    card.scale.setTo(scale, scale);    card.anchor.setTo(0.5, 1.5);    card.angle = angle * i;    this.cards.add(card); //cards is a Phaser.Group    this.card_count ++;    this.game.add.existing(card);    }console.log(this.cards.children);...

As you can see, I try to take a look inside my cards.children array which is empty! ( [ ] ). 

My Card class is implemented like so;
 

class Card extends Phaser.Sprite {    c_id: number;    c_scale: number;    c_side: number = 0; //This represents the side showing, 0 = back, 1 = front.    c_flipping: boolean = false;    c_face: string;    constructor(game: Phaser.Game, x: number, y: number, key: string, id: number, scale: number) {        super(game, x, y, key);        this.c_id = id;        this.c_scale = scale;        this.c_face = cards[id];        this.inputEnabled = true;        this.events.onInputDown.add(this.flip, this);    }    flip() {        if (flipCount < 2) {            this.c_flipping = true;            flipCount ++;            flipList.push(this);        }    }    //------------------    //Game loop    //------------------    update() {        //For the record, there's likely an elegant tween or some mechanic        //that would do the flipping for me but I was interested in seeing        //if I could do it. It works! But it's ugly. So ugly.        if (this.c_flipping) {            if (this.c_side == 0) {               if (this.scale.x > 0) {                  this.scale.x -= 0.1;                  if (this.scale.x <= 0){                      this.c_side = 1;                      //It doesn't matter what side it is, just flip the                      //frame from 0 - 1 or 1 - 0 as we'll only ever have                      //two frames!                      if (this.key == 'card_unknown')                          this.loadTexture(cards[this.c_id]);                      else                          this.loadTexture('card_unknown');                  }               }            }            else if (this.c_side == 1) {                if (this.scale.x < this.c_scale) {                    this.scale.x += 0.1;                    if (this.scale.x >= this.c_scale) {                      this.c_flipping = false;                      this.c_side = 0;                    }                }            }        }    }}

So yeah, basically I'd like to add my custom sprite objects to a group but it isn't working. I get the impression I don't understand groups well enough? Or maybe the correct method of extending Phaser.Sprite? Any help would be greatly appreciated!

(ps. please don't laugh at my card flipping code, it was just for a giggle)

Link to comment
Share on other sites

    this.cards.add(card); //cards is a Phaser.Group    this.card_count ++;    this.game.add.existing(card);

This part is your problem...

You are adding them to the this.cards group, then removing them from the group and adding them to the stage...

This line is not needed at all: this.game.add.existing(card);

You add the this.cards group to the stage, not each individual card...

Link to comment
Share on other sites

As simple as that, love it. Changed my loop up to this;

 

...for (var i = 0; i < num_cards; i ++) {    card = new Card(this.game, this.game.width/2, this.game.height/2,                    'card_unknown', this.order_array[i], scale);    card.scale.setTo(scale, scale);    card.anchor.setTo(0.5, 1.5);    card.angle = angle * i;    this.cards.add(card);    this.card_count ++;}this.game.add.existing(this.cards);...

Thanks, Xeke. You da man  :D

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

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