I’m currently at the town interactions of my game where my 3D player-character travels to the towns and interact with the menu, however when testing the game, the UI is so small, though the parameters were correct.
I am not sure what I am looking at here. Your panel seems to take up about a third of the width of your screen, and canvas layers are rendered independently on the viewport. Your other pictures though show just a tiny blank box? Is that supposed to be your panel, if so, where is the text? If you have overwritten the labels etc with blank strings the panel will (depending on your settings) shrink to the content, in the case of empty strings for text, virtually nothing. If I have misunderstood I apologise in advance.
Do you want a 2D UI on the screen in front of the game, or do you want a 3D UI that’s actually in the world?
If you want to do a classical 2D console RPG style UI, you can have a separate viewport displaying 2D that sits in front of the 3D scene, and control sections of it with node visibility. If your font is too small, or not the font you want, you probably want to look at themes and theme overrides.
Yup, the tiny black box is supposed to be the panel, and the 1st picture should have showed up with its panel, though it already appears on the top left part of the screen in-game (2nd picture), and when it reaches the town (the big purple boxes, 2nd and 3rd pic), the supposed to be panel from the first picture is moved to the center-left part of the screen (3rd pic), though i made a script attached to the “TownMenu” CanvasLayer Node to do that behavior.
I want a 2D UI to show up in the 3D world by interacting objects, such as that box (which is a town), though i’m having problems with the UI part because the box is too small, and it’s not properly displaying the proper UI I’ve set up from the 1st picture.
What does your TownMenu script contain? Seems like all your text is being deleted. Setting the Anchor Preset may also remove set size, unless it’s the custom minimum size property.
# town_menu.gd
extends CanvasLayer
@onready var button_talk = $VBoxContainer/Control/VBoxContainer/ButtonTalk
@onready var button_shop = $VBoxContainer/Control/VBoxContainer/ButtonShop
@onready var button_rest = $VBoxContainer/Control/VBoxContainer/ButtonRest
@onready var button_leave = $VBoxContainer/Control/VBoxContainer/ButtonLeave
func _ready():
visible = false
button_talk.pressed.connect(_on_talk_pressed)
button_shop.pressed.connect(_on_shop_pressed)
button_rest.pressed.connect(_on_rest_pressed)
button_leave.pressed.connect(_on_leave_pressed)
func show_menu():
print("TownMenu: Showing menu")
visible = true
func hide_menu():
visible = false
func _on_talk_pressed():
print("Talking to the mayor...")
func _on_shop_pressed():
print("Shopping...")
func _on_rest_pressed():
print("Resting at the tavern...")
func _on_leave_pressed():
hide_menu()
Part of the Player script:
if town_menu:
print("TownMenu found, type: ", town_menu.get_class())
# Direct manipulation instead of calling show_menu()
town_menu.visible = true
town_menu.layer = 1
# Find and show the panel directly
var panel = town_menu.get_node_or_null("Panel")
if not panel:
panel = town_menu.get_node_or_null("Panel")
if panel:
panel.visible = true
panel.show() # Force update
print("Panel made visible directly")
var viewport_size = get_viewport().size
panel.position = Vector2(viewport_size.x * 0.25 - panel.size.x / 2, viewport_size.y / 2 - panel.size.y / 2)
print("Panel positioned at center-left of screen")
else:
push_error("Panel not found in TownMenu!")
else:
push_error("TownMenu still not found!")
target_town = null
Though the only script i only put was to make the panel visible or invisible if entering the village