How can I add more objects to a layout group?

Suggestions & Feedback
1

I’ve this layout group which as you can see, it has 5 objects inside:
image

At the moment I wanted to add a new object inside it, it doesn’t clone the object and it only shows the last one that I have:

image

image
image1913×236 29.4 KB

This is my test script:

Tests.prototype.onClick = function(event)
{
    if (this.allLives.length > 1) {
    /* Less life */
        this.lessLife();
    } else {
        /* More life */
        this.moreLife(event);
    }
};

Tests.prototype.lessLife = function(event)
{
    var allLives =this.app.root.findByName("healthMenuLives").children;
    if (this.allLives.length > 1)
    {
        var life = allLives.slice(-1)[0].name;
        this.app.root.findByName(life).enabled = false;
        allLives.slice(-1)[0].destroy();
        console.log(life, allLives);
    } else {
        alert("Ya no te quedan vidas");
        /* Call end game method */
    }
};

Tests.prototype.moreLife = function(event)
{
    var allLives = this.app.root.findByName("healthMenuLives").children;
    if (allLives.length > 0 && allLives.length < 5)
    {
        var newLife = allLives.slice(-1)[0].clone();
        var name = parseInt(newLife.name.substr(newLife.name.length - 1), 10) + 1;
        newLife.name = "health" + name.toString();
        allLives.push(newLife);
        console.log("health" + name.toString(), allLives);
    } else {
        alert("Ya no puedes tener más vida");
        /* Do nothing due to you have full life */
  }
2

Hi @Axel_Saucedo,

It isn’t easy to debug this out of context, but the following line looks suspicious:

I think here you are removing one life and at the same time adding a new one, this way you end up with a single life again?

What happens if you put it like this:

var newLife = allLive[0].clone();

And then the thing I think it’s missing here, instead of manually adding it to the children area, use the formal method of adding it to the hierarchy. That will trigger the layout group update:

// remove this line
// allLives.push(newLife);

// replace it with this
this.app.root.findByName('healthMenuLives').addChild(newLife);
1 Like
3

Thank you so much, with the next line I was trying to get the laast child name to add a new clone with different name, that why I’ve this lines:

var newLife = allLives.slice(-1)[0].clone();
var name = parseInt(newLife.name.substr(newLife.name.length - 1), 10) + 1;
newLife.name = "health" + name.toString();

Adding this, fix my bug:

this.app.root.findByName('healthMenuLives').addChild(newLife);
2 Likes
4

Right, so you usually don’t want to rely on the order of the children. The children might also contain a graph node, which is not what you want to clone. The fix you showed is a preferred way.

Also, don’t forget that an entity is a simple Object, and as such you can add your own properties to it. For example, instead of parsing the strings to integers, you can do something like:

var currentLives = 4;
var lifeIndicator = new Entity();
lifeIndicator.livesCount = currentLives;
lifeIndicator.name = currentLives.toString();

// at some point later
lifeIndicator.livesCount--;
lifeIndicator.name = 'lives: ' + lifeIndicator.livesCount.toString(); 
// "lives: 3"
1 Like