Why is my child object changing its position depending on its parent's anchor ?

Unity Engine
1

Hello,

I made a simple joystick which worked fine. Then I wanted it to be positioned correctly no matter the resolution/screen size (iPhone vs iPad for example).

On my canvas, my joystick is a raw image containing the background of the joystick and another raw image, as a child, containing the actual stick.

I’ve put the parent’s (joystick background) anchor to the bottom of the canvas and according to my tests it seems to correctly position itself depending on screen size. (before, transitioning from iPhone on iPad for example, it would be displayed outside of the screen).

But when I do that, the child (stick), consider its base position as the bottom of its parent, instead of the center, even though I specified in the inspector > rect transform to position it in the middle :

(Unity Editor screenshots under the gif in above link)

If I change the parent’s anchor to the middle of the canvas, everything works fine and the inner stick stays within its parent radius as intended.

Do you know why? I’ve played with many things like local position or offset but it’s just worse. I don’t know what to do anymore. Or maybe I can/must handle the compatibility to different screen sizes differently?

Code : https://textuploader.com/t11s3

Thanks

2

Okay I feel ashamed. In case it could be helpful in the future, I solved it by trying to modify the anchor preset in the rect transform in the hierarchy window :

  • Selected the parent and set pivot + anchor + position in the middle (the state where everything works fine)
  • Then I set the anchor in the bottom as I wanted but not the position nor the pivot

And it works. I was sure I already did it but well it seems not.

3

…potential child abuse.