PIXI.js v3 - Can't change alpha in Particlecontainer

[StefanWeck]

Hey everyone,
 
I've recently upgraded my game to v3. But now i'm running into an issue.
I have a lightmap in a two dimensional array, which holds tiles that have a black sprite. I change the alpha of these sprites to create the idea of lightning. 

 

I used a SpriteBatch in v2, and with the recent update it seemed to make sense to update this to the ParticleContainer.

But now it seems that you can't change the Alpha of items in the ParticleContainer after they are created. In the initial initialization functions you can still change the alpha. In the 2nd gameloop and so on, it's not possbile to change the alpha of these tile sprites in the ParticleContainer. So I can't update my lightning. 

 

I can solve this to just use the Container instead of the ParticleContainer. But I want to know if this is intentional and if it is, why!

 

Thanks in advance and keep up the good work.

 

Stefan
 

[xerver]

Did you set alpha as a dynamic property when creating the particle container?

 

http://pixijs.github.io/docs/PIXI.ParticleContainer.html

[StefanWeck]

That was it! Can't believe I didn't find that. 

 

Thank you!

[eggborne]

Hi, I'm wondering if it's possible to do the same thing for tint, and if so how?

[xerver]

Hi, I'm wondering if it's possible to do the same thing for tint, and if so how?

Unfortunately, no. You can see all the supported properties in the constructor params here:

http://pixijs.github.io/docs/PIXI.ParticleContainer.html

You can also see in the description of the container there that advanced properties (such as tint) are not supported. If you need to use those properties, just use a normal Container.

[eggborne]

Ohhh so sorry, I didn't see that! Thanks!

[guiguiff]

Hello, I'm try to simulate movieclip with ParticleContainer and I have the same problem with alpha resetting. I set every properties to true but nothing happens, every sprites stay to alpha = 1.

I used a clone of this code http://www.goodboydigital.com/pixijs/bunnymark/ and the version 3.0.11 of pixi

 

container = new PIXI.ParticleContainer(60, [true, true, true, true, true]);

I post my code because I missed something

var renderer = PIXI.autoDetectRenderer(1070, 600, {backgroundColor : 0x1099bb});
document.body.appendChild(renderer.view);
var stage = new PIXI.Container();

var bunnys;

var count = 0;
var frame = 0;
var nb = 5;

var loader = new PIXI.loaders.Loader("http://localhost/myFolderGameProject/img/")
	.add('wabbit', 'bunnys.png')
  .load(start);

function start(loader, assets){
	stats = new Stats();
	document.body.appendChild(stats.domElement );
	stats.domElement.style.position = "absolute";
	stats.domElement.style.top = "0px";

	// [scale, position, rotation, uvs, alpha]
	container = new PIXI.ParticleContainer(60, [true, true, true, true, true]);
	stage.addChild(container);

	bunny0 = new PIXI.Texture(assets.wabbit.texture, new PIXI.math.Rectangle(2, 47, 26, 37));
	bunny1 = new PIXI.Texture(assets.wabbit.texture, new PIXI.math.Rectangle(2, 86, 26, 37));
	bunny2 = new PIXI.Texture(assets.wabbit.texture, new PIXI.math.Rectangle(2, 125, 26, 37));
	bunny3 = new PIXI.Texture(assets.wabbit.texture, new PIXI.math.Rectangle(2, 164, 26, 37));
	bunny4 = new PIXI.Texture(assets.wabbit.texture, new PIXI.math.Rectangle(2, 2, 26, 37));

	bunnyTextures = [bunny0, bunny1, bunny2, bunny3, bunny4];

	bunnys = [];

	for (var i = 0; i < nb; i++) 
	{
		bunnys.push(new PIXI.Sprite(bunnyTextures[i]));
		container.addChild(bunnys[i]);
		// bunnys[i].alpha = 0;
	}

	update();
}

function update(){
	stats.begin();
	if(frame == 10){
		
		frame = 0;
		count = (count+1)%nb; // 1,2,3,4,0,1,...

		for(var i = 0; i < nb; i++){
			// reset alpha for all
			bunnys[i].alpha = 0; // this don't work !
			bunnys[i].x = 0; // for debug, i changed his position
		}
		// set alpha for one
		bunnys[count].alpha = 1;
		bunnys[count].x = 200;
	}
	frame++;

	
	renderer.render(stage);
	requestAnimationFrame(update);
	stats.end();
}

Any idea ?

Thanks in advance