How to make UI controls whose position is linked to game objects (2D game)?

Help
,
1

Godot Version

4.6.1

Question

I want to display UI controls whose position is bound to game objects. For example:

  • hints about the actions that will be performed when interacting with the interactive element (button)
  • enemies’ health level (progress bar)

I tried to place the controls as child nodes of the game object. In this case, the UI control nodes inherit the camera scale and are affected by light sources. I need the scale to be constant and the lighting does not affect the display of the interface.

I also tried to place UI controls in a separate CanvasLayer, but then I need to set their position using a script.

Can someone tell me how to make UI controls whose position is linked to game objects?

3

2D or 3D?

4

2D (sorry, I added the tag, but I didn’t specify the type of game in the topic title)

5

You need to translate between the screen coordinates and the 2D world coordinates. @normalized just answered this question for someone last week, but I cannot find the post.

6

Thanks for the answer!

I’ve already done the coordinate transformation

keyboardShortcut.Position = GetViewportTransform() * node.GlobalPosition

But I don’t like updating the coordinates with the script. It seems to me that the position of the hint is shaking when the camera is moving.

7

The only alternative I can think of is to use graphics instead of text and display them as a Sprite2D. Then you don’t have to translate. And for your health bar, use a Progress Bar Shader on a Sprite2D.

8

How else would you update? You can parent and use light mask layers to exclude from lighting but you’d still need a line of code to reverse-scale the camera zoom.

1 Like