TextureRect GUI doesn't display properly

Godot Version

Godot 4.2.2

Question

Hi all,

I’ve recently taken it upon myself to learn Godot, so apologies if this is something easy I may have missed.

I am trying to instantiate a TextureRect scene attached to an Area2D scene multiple times to allow the creation of a string of displayed characters that the player is instructed to press in a specific order. However, I’ve found that even with applying a ColorRect as a child of the TextureRect, instantiating the object in the code of the Area2D scene doesn’t display anything.

Here is the code for my Area2D scene. Is there something I’m missing?

extends Area2D

@onready var key = preload("res://scenes/key_input_gui.tscn")

var catch_sequence = []
var inputs = ["up", "down", "left", "right", "interact", "click"]
var freeze = false

@export var difficulty = 4
@export var speed = 120

func _physics_process(delta):
	pass

func _on_input_event(viewport, event, shape_idx):
	if event is InputEventMouseButton and event.button_index == MOUSE_BUTTON_LEFT and !freeze:
		freeze_fish()
		display_sequence()

func freeze_fish():
	freeze = true
	speed = 0

func display_sequence():
	create_catch_sequence()
	create_gui()

func create_gui():
	var count = 0
	for i in catch_sequence:
		var newKey = createKey(i)
		newKey.position = Vector2(100, 100)
		## newKey.position = Vector2(self.position.x + 75 + (count * 100), self.position.y - 50)
		print("New key created! Number: ", str(count + 1), " Type: ", i, " Data: ", str(newKey), " Position: ", str(newKey.position.x), " ", str(newKey.position.y))
		count += 1

func createKey(type):
	var newKey = key.instantiate()
	match type:
		"up":
			newKey.texture = load("res://assets/Light/W_Key_Light.png")
		"down":
			newKey.texture = load("res://assets/Light/S_Key_Light.png")
		"right":
			newKey.texture = load("res://assets/Light/D_Key_Light.png")
		"left":
			newKey.texture = load("res://assets/Light/A_Key_Light.png")
		"click":
			newKey.texture = load("res://assets/Light/Mouse_Left_Key_Light.png")
		"interact":
			newKey.texture = load("res://assets/Light/E_Key_Light.png")
	return newKey

func create_catch_sequence():
	var inputSpread = difficulty 
	var inputAmount = difficulty
	
	if difficulty > 6:
		inputSpread = 5
	
	while catch_sequence.size() < inputAmount:
		catch_sequence.append(inputs[randi() % inputSpread])
		
	print(catch_sequence)

P.S. The current position is just 100,100 right now, but I was wondering if it is possible to grab the size of the TextureRect scene and apply it as I have commented in line 33. Is there a way to accomplish this?

Welcome to Godot! :slight_smile: In order for the scene to display, you need to add it to the scene tree first, using the add_child function:

func create_gui():
	var count = 0
	for i in catch_sequence:
		var newKey = createKey(i)
		add_child(newKey) # <-- this was missing
		newKey.position = Vector2(100, 100)
		print("New key created! Number: ", str(count + 1), " Type: ", i, " Data: ", str(newKey), " Position: ", str(newKey.position.x), " ", str(newKey.position.y))
		count += 1

That will add the instance as a direct child of the scene this script is attached to and then position it relative to the global position of that parent. So if the parent is at (50, 50) and you set the child position to (100, 100), it will end up at (150, 150).

Regarding your line 33: Yes, that’s possible. But in this case it’s probably easiest to spawn a BoxContainer and let it do all the heavy lifting for you.