I am trying to display some element wrapped up inside another element, and just display a certain part of them (limited in a rect)
I tried to use .clip()
on the parent element, but then i got a lot of strange results : like if I change the parent x
and y
, let say I put parent.y = 20
, then for some reason, the children inside the .clip()
will be displayed like they also had y = 20
beside the fact they're y = 0
; so in the end, children double the y
of their parent (20 from the origin like their parent and then for some reason another 20 inside the parent)
What I don't understand is if I inspect a child, its y
is 0 and its real_Y
is 20, but on my screen it is obviously 40
When I remove .clip()
from the parent, everything works properly but I need to crop the display of the children in a rect
So is it some kind of bug, or maybe I am doing something wrong, or maybe there is another way to do what i want beside the .clip()
example images of the issue
(source: hostingpics.net)
(source: hostingpics.net)
There is also another "bug" way more annoying, when i am using a radius to a child, it simply breaks the .clip() of the parent
Code should be something like that (in ready):
el1 = this.createElement();
el2 = this.createElement();
el1.rect(0, 0, 376, 212);
el1.clip();
el2.drawImage('slot');
el2.x = 200;
el1.append(el2);
stage.append(el1);
with this I have the first picture, if I add el1.y = 20
I have the second picture, so I would have to add el2.y = -20
to get what I really want