2D UI in 3D implementation

[NaleVex]

Sorry in advance for any mistakes I made in this text, I hope you will understand meanings of my suggestion.

Since there is no built-in ways of implementation interactable UI into 3D world, here is my little suggestion:
Two new nodes: 3D Canvas Viewport and 3D UI Ray

3D Canvas Viewport (3DCV)

Allows to render child 2D nodes (all CanvasItem class) in 3D world. Behaves as PlaneMesh where on it's face 2D nodes projected and it's back is transparent or filled with color, or mirrors 2D image from front. User may change it's size, position and rotation. Plane size is given as whole screen so UI nodes layout properties of anchors and alignments will work properly.

3D UI Ray (3DUR)

Allows player to interact with 3DCV. Basically behaves like usual RayCast3D node, but for only purpose. The first 3DCV Ray hit triggers standart behaviour of 2D child nodes, such as mouse_entered/exited, button_down/up, pressed and so on.

Overall of how it works

Both nodes required to be used. As example 3DCV node will have this structure:

• Node3D (world scene root)
  • 3D Canvas Viewport
    • Container
      • Button
      • Button
      • Label
      • Sprite2D

This means that 3DCV will render all buttons, label and sprite2d as setted in their 2D layout on flat surface somewhere in world. Then we have 3D UI Ray setted at the same position as our camera on FirstPerson character scene, so it will emit ray right at the center of where we look. Now when we look at 3DCV node in world, ray will emit at some specific point on CV activating signal 3DUIRayInside in that CV. This signal also returns relative position of UR hit on CV plane surface. Now we can use this signal and built-in 3DCV methods that will simulate cursor movement on UI and 2D nodes inside it, so buttons will change color when cursor is over and so on. In UR we also may use methods to emulate clicks on CV, that will call specific signal in CV with given attribute that will be used to actually interact with nodes inside.

As this is just a suggestion, many additional features and parameters are possible, here I wrote only main idea of how I see this should work.

[AThousandShips]

This is very specific, most games don't feature this form of ui, so best as a plugin or a template

[AThousandShips]

And for the rendering part the demo projects already has how to do it

[NaleVex]

I tried GUI in 3D example and it doesn't give hopes, too clunky and overwhelming to implement.

[AThousandShips]

How is the rendering part clunky? I'm not talking about the input

[AThousandShips]

It's literally something that can be done just in scene files, no script required (unless you want billboard functionality)

[Sauermann]

Similar to #6524
An example of how to handle input in this setting with GDScript: godotengine/godot#72657 (comment)

[FourGames]

Related: #11881