DisplayObjectContainer toDataURL?

[Sebi]

Hello guys,

 

I need some help. Let's say, I have N pixi text elements. In this case, N = 3.

 

So:

 

[Element 1]

 

[Element 2]

 

[Element 3]

 

And those are supposed to move together on my screen. (Yes, I do need different text elements, linebreak is no option)

So I have put them in a DOC and just moving the DOC around.

 

Now I was wondering if there is a way to get something like toDataURL for my DOC? Then I could just destroy the DOC and the text elements after I got the data url and create one single sprite that is moving around.

 

Or even toDataURL for my text element and then I create a temporary canvas to put hem together.

 

So yea.. I don't know how I can move a bunch of elements together on my screen.

[benny!]

Have a look at RenderTexture.

[Sebi]

Sweet! Thanks.

 

So.. since im fairly new to game programming, I have written some functions on my own and I would like to know your opinions on that.

// [...]stageWidth: 800,font: "10px GraphicPixel",strokeSize: 3,drawText: function(text, x, y, align, color, strokeColor) {	var textobj = new PIXI.Text(text, {		font: this.font, 		fill: color || "white", 		align: align || "left", 		stroke: strokeColor || "#373737", 		strokeThickness: this.strokeSize	});	textobj.position.x = x;	textobj.position.y = y;	return textobj;},drawMultiColoredText: function(text, x, y, centered) {	var container = new PIXI.DisplayObjectContainer();	var child = null, textwidth = 0;        container.position.x = x || 0;        container.position.y = y || 0;	for(var i = 0; i < text.length; i++) {		child = this.drawText(text[i][0], textwidth, 0, "left", text[i][1], text[i][2]);		textwidth += child.width + 2;		container.addChild(child);	}		if(centered) {		container.position.x = Math.round((this.stageWidth - textwidth) / 2);	}	return { 		container: container, 		width: textwidth	};},demo: function() {	var textobj = this.drawMultiColoredText([		["[VIP]", "#FFDF00", "#7C6604"],		// mark player as VIP		["Plane:", "#FF7B00", "#660000"],		// rebirth indicator		["Name", "#ffffff", "#000000"],			// player name		["Rank", "#ffffff", "#000000"],			// honor rank		["Guild", "#FFDF00", "#7C6604"]			// mode (guild/party/...)	], null, 30, true);	this.stage.addChild(textobj.container);}

Output:

 

Thats why I asked here, because I thought keeping all those pixi.text elements alive is unnecessary.

Is there already an equivalent to my function in pixi? I'm glad about every line of code that I can save in my project

 

I'll try to change my function to RenderTexture later.

[benny!]

The method call of "drawMultiColoredText" looks way too complicated IMHO. Don't know the exact use-case of that method - but it looks like a beast to call throughout your game/application. 

 

In addition - why e.g. is "2" a constant here - and cannot be changed?

 

textwidth += child.width + 2;

 

Personally, it looks like you try to make a general purpose method out of a method - which actually is created for a specific reason. That's why I would simplifiy it and just have a central method which looks like this, e.g.:

getCustomText( tag, rebirth, name, rank, guild )

Just my 2cts.

[Sebi]

The method call of "drawMultiColoredText" looks way too complicated IMHO. Don't know the exact use-case of that method - but it looks like a beast to call throughout your game/application. 

 

In addition - why e.g. is "2" a constant here - and cannot be changed?

 

 

Personally, it looks like you try to make a general purpose method out of a method - which actually is created for a specific reason. That's why I would simplifiy it and just have a central method which looks like this, e.g.:

getCustomText( tag, rebirth, name, rank, guild )

Just my 2cts.

 

The constant is just an additional spacing between words. Not neccessary tho. (Was thinking about measuring the width of a space instead)

 

Your suggestion is not bad but there might be other cases when I want to call it. I could put your getCustomText on top of that tho for easier access / manipulation later on as in "drawEntityName" in my game renderer.

The main use is for the title-tags above players, imho really important to color parts of it differently, not only because it looks nicer but to make it easier to read and avoid confusion.

 

Other cases would be announcements like "PlayerXY just won a [item] at [ingame Event]", here I would color the player name / item name differently than the rest of the announcement because if the player name was "You" then it would be weird to read "You just won ..".

 

So based on the announcement, which is supposed to pop up on the screen, the amount of arguments might differ, therefor the array.

 

On a sidenote:

You are right on it to put this in an EntityName function, because vip/plane/rank/mode don't have to be created over and over, instead I can just reuse the texture, the amount of possible textures is limited in that case. ("[VIP]", "1st Rebirth", "2nd Rebirth", "Guild", "Party", "Evil", "King", "Emperor"..) only the name texture has to be unique for each player