motion-canvas / motion-canvas

Visualize Your Ideas With Code
https://motioncanvas.io
MIT License
15.93k stars 597 forks source link

TXT does not move with parent Line when tweening #1020

Open timonkrebs opened 6 months ago

timonkrebs commented 6 months ago

Describe the bug When i have a child node I expect it to always move with the parent. This is the case for Txt in Circles etc. but seems to be a bug with Line as a parent.

To Reproduce (https://stackblitz.com/edit/stackblitz-starters-xumqnr?file=my-animation%2Fsrc%2Fscenes%2Fexample.tsx)

"test2" is a child node of the second appearing line. It but does not inherit the position of the parent.

Expected behavior When i have a child node I expect it to always move with the parent.

Package versions:

aarthificial commented 6 months ago

Your example works correctly, test2 would move together with its parent if you were to change the parent's position. I think you assume that the line's position is somehow calculated based on its points but that is not true. You're not changing the position property so the origin of the line stays in the same place.

If you want to position something at the center of the line you can use getPointAtPercentage to calculate what that position would actually be:

view.add(
  <Line
    // ...
  >
    <Txt
      // ...
      position={() => line2ref().getPointAtPercentage(0.5).position}
    >
      test2
    </Txt>
  </Line>
);
timonkrebs commented 6 months ago

Thank you. That would be nice if it was documented. I think I make a PR for the docs. Is there a reason why the origin schould not be moved? I think it would be convenient and the usage more intuitive and less verbose if the origin would be moved.

aarthificial commented 6 months ago

There's currently no way to move the origin. Child nodes are always positioned relative to the parent's transform.

timonkrebs commented 6 months ago

I meant that it would be intuitive if points={[rect().right, circle2.left]} also changed the origin of the Line itself which would also move the children.

Why should the origin not move if the points moved. I think moving the origin to getPointAtPercentage(0.5).position would be reasonable when the points change. Or what is the reason not to do it?

aarthificial commented 6 months ago

Again, given the current implementation, there's no way to move the origin of the node used by the children without modifying the position of the node itself. And you cannot modify the position of the Line based on the points because points are positioned relative to that position. You could make the points be defined relative to the position of the Line's parent but then you'd lose the ability to move all points at once or rotate them.