Have UI button follow sprite when it moves up/down in Screen Space - Camera

Hey,

I’m trying to make my UI button follow my 2D sprite when the sprite moves up/down. The movement is good but the positioning is way off screen and i'm not too sure what's causing this offset. I'm thinking that my use

 WorldToScreenPoint() 

isn't implemented correctly. My UI Canvas’ render mode is "Screen Space - Camera". At the moment i can't even see the UI buttons because it's offsetted so much. When i switch the UI Canvas’ render mode to "Screen Space - Overlay" it’s perfect in that it’s exactly where i want the button to be but ideally i'd like to keep "Screen Space - Camera".

The camera that the "Screen Space - Camera" is using is following the sprite but i don't think that should really cause any issues. I'm learning towards that the problem is my conversion and it's not a settings problem because when switching to "Screen Space - Overlay" it is pretty much perfect.

The code which i'm using right now:

Code (CSharp):

1. Vector3 mySpritePosition = myCamera.WorldToScreenPoint(mySprite.gameObject.transform.position);
2. myUIButton.transform.position = new Vector3(myUIButton.transform.position.x, mySpritePosition.y, myUIButton.transform.position.z);

Really hope to get some feedback on this and any help will be appreciated!


Any help will be appreciated!

 

In Overlay mode, the transform.position of a canvas sprite object will correspond 1:1 to the pixel position of the object. In Camera mode, this is no longer the case, since the canvas is now in a different position and a much smaller size. You will want to position the object via its rectTransform attributes (most likely anchoredPosition) instead.

 

Hmm using anchoredPosition definitely changed up the results and now the y position is appearing in scene unfortunately it's not where i want it. I did notice that when i did just anchoredPosition the entire mySpritePosition i.e.

myUIButton.transform.position = mySpritePosition

it'd be way off as well so there's something going on that i'm not too sure...

 

Thats how I do it

Code (CSharp):

1. Vector2 tempScreenPos = CameraManager.instance.userCamera.WorldToScreenPoint(cg.transform.position);
2.                 cg.canvasTransform.anchoredPosition = tempScreenPos;

You sure using the right camera?

 

Ahhh @asd234w4r5 & @Madgvox you guys were both right. The problem was that i was combining both transform with <RectTransform>().anchoredPosition in the new Vector position. So when using overlay i should ONLY stick to transform (and not use it conjunction with <RectTransform>().anchoredPosition) and when using screen space i should ONLY stick with <RectTransform>().anchoredPosition. Aweeeesome!

Thank you both for responding it definitely helped me a lot!