question about stage property in v3

[Mathieu Anthoine]

Hi,

 

As the stage is no longer a Stage Object and stage property has been removed from the DisplayObjects, how can we know when a DisplayObject is on the stage or not ?

 

I asked few days ago about dispatching an event when objects are added to the stage or remove (like in AS3), but I don't find the events dispatched by DisplayObject in the documentation, is there a place to find them ?

 

Last question: As stage is only a classic Container now, it seems possible to change the stage on the fly changing only the Container to render (renderer.render(myContainer)). In this case, are the whole DisplayObjects will dispatched a removed or added "to stage" event ?

 

Thank for your help.

 

[xerver]

There is no add/remove event that talks about the stage. There are events when an object is added/removed to/from containers though.

 

The child will emit an 'added' event when added to a container, and the child will emit a 'removed' event when removed from a container. Rendering a different container doesn't add/remove any children so no events are emitted.

[Mathieu Anthoine]

So tell me if I'm wrong: there's no way to know if a DisplayObject is in the displayList or not ?

[bubamara]

Not sure, what exactly are you trying to achieve, but if your concern is performance of hidden DisplayObjects, then no worries.

DisplayObject with visible property set to false isn't rendered (and with alpha <=0 as well)

 

You can check whether DisplayObject is in scene graph by checking if DisplayObject.parent === null 

[Mathieu Anthoine]

Not sure, what exactly are you trying to achieve, but if your concern is performance of hidden DisplayObjects, then no worries.

DisplayObject with visible property set to false isn't rendered (and with alpha <=0 as well)

 

You can check whether DisplayObject is in scene graph by checking if DisplayObject.parent === null 

 

About hidden DisplayObjects I'm aware of the performances and use it a lot, it's a great implementation thank you

 

DisplayObject.parent is not enough to know if a DisplayObject is on the DisplayList (added to the stage) it only allows to know if it's added to a parent. 

 

 

You'll find the exact issue I have without ADDED_TO_STAGE event or if there's no way to know if a DisplayObject is on the displayList (thing that was possible in Pixi v2).

 

It's a case that arrives very often:

 

http://www.html5gamedevs.com/topic/15067-question-about-worldtransform-in-v2-and-v3/

[xerver]

The quick answer is: No, there is no way to know if an object in an arbitrary container is being rendered without walking the tree.

 

The longer answer is: Your code shouldn't care, there are almost no cases where you *need* to know if an object is in the rendering tree because you likely shouldn't have more than one tree and only the ones being rendered should be updated.

[Mathieu Anthoine]

The longer answer is: Your code shouldn't care, there are almost no cases where you *need* to know if an object is in the rendering tree because you likely shouldn't have more than one tree and only the ones being rendered should be updated.

 

Why it could be interesting to know if a DisplayObject is added to the displayList ? Prevent for example a collision test between a DisplayObject that is added to the displayList and an other that is not (because worldTransform of DisplayObject not on the displayList are wrong or not updated).

It's not critical, it's possible to do another way but it was easier in Pixi v2.

 

Now, why I was interested to have an addedToStage event ? Prevent the bug of worldTransform described here : http://www.html5gamedevs.com/topic/15067-question-about-worldtransform-in-v2-and-v3/ but you're right, added event is enough, I can call an updateTransform of a DisplayObject when it is added. 

 

But at the end, I was wondering if it could be fixed directly in Pixi, you just need to add an updateTransform of childs when they are added in a Container. Do I need to post a bug ?

Container.prototype.addChildAt = function (child, index){    // prevent adding self as child    if (child === this)    {        return child;    }    if (index >= 0 && index <= this.children.length)    {        if (child.parent)        {            child.parent.removeChild(child);        }        child.parent = this;        // FIX        child.updateTransform();

[xerver]

That isn't a bug, the worldTransform is used for rendering. It is updated in the render loop. If you need to use the worldTransform outside the render loop then you should update it yourself.

 

Adding the code you posted above just makes objects update their transform twice when they are added/removed from a container.

 

If anything, what you want is a new feature that allows the "renderer.render()" call to skip updating transform completely so you can do it on your own. That way you can update, do your game logic, then call render and skip the internal update.

[Mathieu Anthoine]

Ok so if I don't add childs in one particular order (http://www.html5gamedevs.com/topic/15067-question-about-worldtransform-in-v2-and-v3/) I have to wait one render (one frame) after a addChild if I want to have correct worldTransform ?

 

It seems really weird to me to get two behaviors. Maybe an "onUpdate" event could be more interesting than "onAdded" because it will be at this moment that you can really use the DisplayObject, not before.

[xerver]

I don't think you understand what I am saying. updateTransform is for rendering, if you are not rendering you are using it for something it was not meant for.

 

If you want to use it for something it was not meant for, you need to do that manually (that is, call updateTransform() yourself).

 

If you want to optimally be able to gather input, update state, update transform, do more things with updated transforms, then render; you should put in a feature request. In the mean time, nothing is stopping you form doing what I just said. The render() call will just also update the transform again when you go into the render loop.

 

> It seems really weird to me to get two behaviors.

 

There is only one behavior, an object's transform is updated for rendering. 

 

> Maybe an "onUpdate" event could be more interesting than "onAdded" because it will be at this moment that you can really use the DisplayObject, not before.

 

This is not true, you can do whatever you want with an object immediately when you add it. If you want to use a property that is only for rendering internally for something else besides that, it is up to you to ensure that it is updated outside the render loop. Just call updateTransform().

 

I find your post that you keep linking to really hard to believe. The order you add objects in doesn't matter. If it does, then that is a bug and you should open a GitHub issue with links to running examples that reproduce the issue. toGlobal updates the transform of the object you are calling it on. If its parent has never been updated, then it will be wrong. If your steps in your post are in a single frame, with no rendering in between steps then I find it hard to believe that toGlobal is right in one order but not the other.

 

That being said, knowing when something is in the rendering tree still doesn't help you with what you are asking for. In the tree is not the same as transform is updated. What case do you have that needs toGlobal() immediately for a deep child that you haven't even drawn yet? Please provide concrete examples, this is just too abstract.

[Mathieu Anthoine]

Sorry for the misunderstanding, I realize that there was a wrong mix up between worldTransform and toGlobal in my example.

 

== WRONG ORDER ==

 

1) I add a DisplayObjectContainer A to the stage and apply some transformations ( scale, positions...)

2) I create a DisplayObjectContainer B but don't added it to the stage

3) I add a Sprite C in B

4) render

5) I add B in A

6) I log worldTransform of C => wrong worldTransform

 

== RIGHT ORDER ==

 

1) I add a DisplayObjectContainer A to the stage and apply some transformations ( (scale, positions...)

2) I create a DisplayObjectContainer B but don't added it to the stage

3) I add B in A

4) render

5) I add a Sprite C in B

6) I log worldTransform of C => right worldTransform

 

Now to be more precise on what do I do and why I need the exact worldTransform in  these cases:

 

In PixiJs v2, I created a hitTest method inspired by the private hitTest method of InteractionData and this method uses worldTransform. In this case, if the worldTransform doesn't return the good result at the right moment the collision result fails.

 

Your precisions are totally right and clear, toGlobal updates the wordTransform when it's called, my problem is the worldTransform not updated when it's directly used.

And you're right, I'm using a behavior that is not exposed to users in first place. So the solution is clearly what you explained, use updateTransform manually when I need it.

Fortunately in Pixiv3 there's the onadded event that helps

 

PS: I see that InteractionData has changed a lot between v2 and v3 and that there's no longer the hitTest method. Maybe there's a new manner of doing hitTest in v3 that avoid me to manually call updateTransform

 

In anyway, thanks for your help

[d13]

my problem is the worldTransform not updated when it's directly used.

 

v3.0 has a new (undocumented) method called `getGlobalPosition` that updates `worldTransform` immediately.

 

https://github.com/GoodBoyDigital/pixi.js/issues/796

https://github.com/GoodBoyDigital/pixi.js/blob/07e4e26f8fd404524a7ebaa73c210de3d8f2cf25/src/extras/getGlobalPosition.js#L3-L27

 

 

You can use it on any display object like this:

sprite.getGlobalPosition().x;sprite.getGlobalPosition().y;

I don't know if this will help you for your problem, but I found it invaluable for doing certain types of collision tests that were impossible or very difficult in previous versions of Pixi.

[Mathieu Anthoine]

Thank you for the information, it's good toto know getGlobalPosition()

Even if I often calculate other coordinates than x and y.