How could I go about showing UI after left-clicking on it?

Question

I think the title explains it ok.

Answer 1

You can make something visible with the following code on a script attached to that object

self.visible = true

or this code from a different node

$nodename.visible = true

so you connect whatever you are clicking on screen to this code to make the thing you want visible. Change it to false to make it invisible again.

Comments

OK why doesn't this work? ("Base" is a control node) It's connected to itself.

func _on_Base_gui_input(event: InputEvent) -> void:
    if event is InputEventMouseButton:
        $UI.show()

---

I am a bit confused by this you say its connecting to itself? I assume show() is a function you have written? If it is in the same script then you would have code like this;

func _show():
     self.visible = true

func _input(event):
   if event is InputEventMouseButton:
       show()

you dont need to specify itself with dot notation to call a function in the same script.

---

No show() is not a function I made, it just works? And what should be connected to what?

---

Okay so I think it might be a good idea to go back to basics here, if I wanted to have an item go from invisible to visible on screen I would do it this way, either

a) I would have some object set to be able to be clicked by the mouse, I would have some code similar to the below;

func _input(event):
   if event is InputEventMouseButton:
        self.visible = not self.visible

and this way when the mouse is clicked over the object it would make the object visible if it was invisible and invisible if it was visible.

or

b) I would have a script on a top level node which would look out for a mouse click and check where it happened like this;

func _input(event):
   if event is InputEventMouseButton:
        var pos = get_viewport().get_mouse_position()
        if pos.global_position = someobject.global_position 
               $someobject.functioninscript()

and then in the other object I would have

func functioninscript():
    self.visible = not self.visible

both of these methods work in principle but with the second one you may have to add a + or - to the global position of the object depending on how much tolerance you want in the mouse click over the object.

---

Didn't work. What should be connected to what?

It's setup like this:

v Node
    v CanvasLayer
        v Control
            2 AnimatedSprites & RichTextLabel

---

Okay well this has worked for me, but as for what is connected it depends on your setup. you need something to detect the mouse click to turn it visible or else you need some change such as a boolean to set off the code.

I might for example have another node outside of the canvas layer communicating this. I dont know what you are using to detect when you want the control layer to become visible so I cannot really answer your question. Whatever you are using to detect when you want it to become visible needs to be connected to the script to turn it visible.

---

The Control node named "Base" is connected to the Node that the CanvasLayer is in which "Base" is in.