Sådan opretter du brugerdefinerede UI-menuer i Godot ved hjælp af kontrolnoder

Nøgle takeaways

• Brugerdefinerede menuer i Godot kan forbedre engagement og brugeroplevelse ved at give nem navigation og hurtig adgang til spilfunktioner.
• Godot giver et kraftfuldt værktøjssæt til at skabe brugerdefinerede UI-menuer ved hjælp af kontrolnoder i spilmotoren.
• Du kan oprette menuer som startmenuer, pausemenuer og game over-skærme i Godot ved at tilføje passende noder og implementere deres funktionalitet ved hjælp af GDScript.

Brugerdefinerede menuer kan i høj grad forbedre engagementet og brugeroplevelsen af ​​dit Godot-spil. Ved at skabe intuitive og visuelt tiltalende menuer kan du give spillerne nem navigation og hurtig adgang til forskellige spilfunktioner.

Heldigvis giver Godot et kraftfuldt værktøjssæt til at skabe brugerdefinerede UI-menuer ved hjælp af kontrolnoder.

Opsætning af Godot-spillet

For at begynde skal du oprette en 2D-spilscene i Godot spilmotoren

. Tilføj en KinematicBody2D node for spillerkarakteren og vedhæft en CollisionShape2D node til det, definer en rektangelform, der repræsenterer spillerens kollisionsområde.

Koden brugt i denne artikel er tilgængelig i denne GitHub-depot og er gratis for dig at bruge under MIT-licensen.

Inkluder desuden en Sprite2D node for at vise spillerkarakteren visuelt. Nedenfor er et GDScript-kodestykke til at aktivere spillerbevægelse:

udvider KinematicBody2D
konstant HASTIGHED = 200
const GRAVITY = 500
var hastighed = Vector2.ZERO
func _physics_process (delta):
 var move_direction = 0
hvis Input.is_action_pressed("ui_right"):
 move_direction += 1
hvis Input.is_action_pressed("ui_venstre"):
 move_direction -= 1
 velocity.x = move_direction * HASTIGHED
 velocity.y += GRAVITY * delta
 hastighed = move_and_slide (hastighed, Vector2.UP)

I denne kode skal du definere en konstant FART at kontrollere spillerens bevægelseshastighed. Opdater hastighedsvariablen som svar på brugerinput, og kald move_and_slide() at flytte spilleren, mens der tages højde for kollisioner og spillets tyngdekraft.

Opret en startmenu

For at oprette en startmenu i Godot skal du tilføje en kontrolnode som scenens rod. Tilføj en etiketnode som underordnet denne kontrolnode, og indstil dens tekst til Simpelt spil. Du kan tilpasse skrifttypen, størrelsen og farven på etiketten, så den passer til dit spils stil.

Derefter tilføjes en knap-node som underordnet kontrolknude. Indstil knappens tekst til Spille spil. Skriv tilpasset kode til Spille spil knap for at håndtere dens funktionalitet:

udvider kontrol
func _ready():
 var playButton = $Button
 playButton.connect("trykket", selv, "_på_PlayButton_pressed")
func _on_PlayButton_pressed():
# Indlæs spilscenen
 var gameScene = preload("res://GameScene.tscn")

# Overgang til spilscenen
 get_tree().change_scene (gameScene)

Denne kode forbinder trykket signal fra play-knap til _on_Play Button_pressed fungere. Den funktion indlæser spilscenen vha preload() og opretter en instans af det. Den bruger så change_scene() at gå over til spilscenen.

På samme måde kan du tilføje en Afslut knap, som spillere kan bruge til at afslutte spillet:

func _ready():
 var playButton = $Button
 var exitButton = $Button2
 playButton.connect("trykket", selv, "_på_PlayButton_pressed")
 exitButton.connect("trykket", selv, "_on_ExitButton_pressed")
func _on_ExitButton_pressed():
# Afslut spillet
 get_tree().quit()

Denne kode forbinder trykket signal fra udgangsknappen til _on_ExitButton_pressed fungere. Den funktion kalder Afslut() for at forlade spillet.

Opret pausemenuen

For at tilføje en pausemenu til dit Godot-spil skal du oprette en ny scene med en kontrolknude som roden af ​​pausemenuen. Design de visuelle elementer i menuen, herunder en etiket til Pause og knapper for at genoptage spillet, vende tilbage til hovedmenuen og afslutte spillet.

Tilføj scenen som en børneknude i hovedspillet. Tilføj følgende kode i scriptet, der er knyttet til kontrolnoden:

udvider kontrol
func _ready():
 $btnResume.connect("trykket", selv, "_på_resume_button_pressed")
 $btnHome.connect("trykket", selv, "_på_menu_knap_trykket")
 $btnExit.connect("trykket", selv, "_on_exit_button_pressed")
 pause_mode = Node. PAUSE_MODE_PROCESS
 get_tree().paused = falsk
 self.hide()

func _input (hændelse):
hvis event.is_action_pressed("ui_annuller"):
hvisikke self.is_visible_in_tree():
# Sæt spillet på pause, når pausemenuen ikke er synlig
 self.show()
 get_tree().paused = sand
andet:
# Genoptag spillet, når pausemenuen allerede er synlig
 self.hide()
 get_tree().paused = falsk
func _on_resume_button_pressed():
# Skjul pausemenuen og genoptag spillet
 self.hide()
 get_tree().paused = falsk
func _on_menu_button_pressed():
# Vend tilbage til hovedmenuen
 get_tree().change_scene("res://StartMenu.tscn")
func _on_exit_button_pressed():
# Afslut spillet
 get_tree().quit()

I den _parat() funktion, tilslut trykket signal fra knapperne CV, hjem og exit til deres respektive funktioner: _on_resume_button_pressed(), _on_menu_button_pressed(), og _on_exit_button_pressed().

Indstil pause_mode af noden til Node. PAUSE_MODE_PROCESS. Dette gør det muligt for spillet at fortsætte med at køre, mens pausemenuen er synlig. Skjul som standard pausemenuen vha self.hide() og sæt get_tree().pauset til falsk for at sikre, at spillet ikke er sat på pause i starten.

Næste, brug en hvis-erklæring i _input (hændelse) funktion til at kontrollere, om ui_cancel handling er trykket. Hvis pausemenuen ikke er synlig i øjeblikket, kan du sætte spillet på pause ved at vise pausemenuen og indstillingen get_tree().pauset til rigtigt.

Opret et spil over skærmen

For at implementere et spil over skærmen i Godot skal du oprette en separat scene kaldet GameOver.tscn at definere dens UI-elementer og funktionalitet. Du kan tilføje denne scene som en børneknude, når spilleren krydser skærmgrænserne, hvilket indikerer slutningen af ​​spillet.

Åbn en ny scene i Godot, og tilføj en kontrolknude som scenens rod. Inde i kontrolnoden skal du tilføje en etiketnode for at vise Game Over tekst. Tilpas skrifttypen, størrelsen og farven på etiketten i overensstemmelse med dit spils visuelle stil.

Tilføj derefter Knap noder for Spil igen og Afslut muligheder. Placer dem korrekt på skærmen.

Forbind knapsignalerne til deres respektive funktioner for at håndtere handlingerne, når der klikkes på dem. Tilslut f.eks Spil igen knappen til en funktion kaldet onPlay AgainPressed og Afslut knappen til en funktion kaldet onExitPressed.

For at håndtere knapfunktionaliteten skal du definere de tilsvarende funktioner i GDScript-koden for game over-scenen. Her er et eksempel:

udvider kontrol
func _ready():
 $Button.connect("trykket", selv, "onPlayAgainPressed")
 $Button2.connect("trykket", selv, "onExitPressed")
func onPlayAgainPressed():
 var gameScenePath = "res://GameScene.tscn"
 get_tree().change_scene (gameScenePath)

func onExitPressed():
 get_tree().quit() # Luk spilapplikationen

Når du har sat op GameOver.tscn scene og definerede den nødvendige knapfunktionalitet, kan du bruge følgende kode i hovedspilscenen til at vise spillet over skærmen:

udvider KinematicBody2D
func _physics_process (delta):
# Tjek om spilleren har krydset skærmens grænser
 var screen_size = get_viewport_rect().size
hvis velocity.y > screen_size.y eller hastighed.y < 0:
 show_game_over_screen()
func show_game_over_screen():
 get_tree().change_scene("res://GameOver.tscn")

Game Over-skærmen vil se nogenlunde sådan ud med knapper, som spilleren kan genstarte eller afslutte:

Inklusiv yderligere funktioner

Når du opretter brugerdefinerede UI-menuer i Godot ved hjælp af kontrolnoder, har du fleksibiliteten til at tilføje forskellige funktioner for at forbedre funktionaliteten og den visuelle appel af dine menuer. Her er nogle ideer til at overveje.

Animerede overgange

Tilføj jævne overgange mellem forskellige menuskærme, såsom fade-in, slide-in eller skaleringseffekter. Du kan opnå dette ved at ændre egenskaberne for kontrolknuderne over tid ved hjælp af tweens eller animationsafspillere.

Lydeffekter

Implementer lydeffekter for at give lydfeedback, når afspilleren trykker på menuknapperne. Du kan afspille forskellige lyde til knapklik, menuovergange eller andre interaktioner for at få menuerne til at føles mere lydhøre og engagerende.

Godots indbyggede lydsystem gør det nemt at afspille lyde på passende tidspunkter.

Visuelle effekter

Brug shaders eller partikelsystemer til at tilføje visuelle effekter til dine menuer. For eksempel kan du anvende en subtil glødeffekt på udvalgte knapper eller oprette partikeleffekter, der udløses, når visse menuhandlinger forekommer. Disse effekter kan tilføje en poleret og fordybende følelse til din brugergrænseflade.

Baggrunds musik

Overvej at spille ophavsretsfri baggrundsmusik specifik for hver menuskærm for at skabe en mere fordybende atmosfære. Du kan bruge lydstreams eller lydbusser i Godot til at styre baggrundsmusikken og sikre problemfri overgange mellem forskellige numre, mens afspilleren navigerer gennem menuerne.

Lokaliseringsstøtte

Hvis du planlægger at oversætte dit spil til flere sprog, kan du overveje at tilføje lokaliseringsunderstøttelse til dine UI-menuer.

Giv en mekanisme til dynamisk at ændre tekstindholdet i etiketter og knapper baseret på det valgte sprog. Godots lokaliseringsværktøjer og -ressourcer kan hjælpe med at administrere flersprogede brugergrænsefladeelementer.

Husk at teste og gentage dine menuer med rigtige brugere for at sikre, at de ekstra funktioner forbedrer den overordnede brugeroplevelse og er intuitive at navigere i. Vær opmærksom på præstationsovervejelser, især når du bruger animationer og visuelle effekter, for at sikre glatte og responsive UI-interaktioner.

Gør Godot-spil mere engagerende med brugerdefineret brugergrænseflademenu

Brugerdefinerede UI-menuer kan spille en afgørende rolle i spillerengagement. De giver intuitiv navigation, giver nem adgang til spilfunktioner og forbedrer dit spils overordnede visuelle tiltrækningskraft.

Med lidt kreativitet og noget kodning kan du designe menuer, der ikke kun giver essentiel funktionalitet, men som også fanger spillere og forbedrer deres overordnede spiloplevelse. Så begynd at udforske og lave dine egne unikke menuer for at få dine Godot-spil til at skille sig ud fra mængden.