Parallakse-scrolling er en teknikk som ofte benyttes i 2D-spill for å fremkalle en illusjon av dybde og berike spillets visuelle bakgrunn. Dette oppnås ved at ulike lag i bakgrunnen beveger seg med varierende hastigheter, relativt til kameraets forflytning.
Godot 4 har forenklet implementeringen av parallakse-scrolling betraktelig. Den robuste 2D-motoren tilbyr integrert støtte for parallakse-lag, noe som gir deg mulighet til å skape slående visuelle effekter med minimal anstrengelse.
Konfigurere Godot-spillet
For å starte, opprett et nytt 2D-prosjekt i Godot-spillmotoren og sett opp spillscenen med en spillerkarakter.
Koden som benyttes i denne artikkelen er tilgjengelig i dette GitHub-depotet og kan fritt brukes under MIT-lisensen.
For dette eksemplet, legg til en CharacterBody2D-node for å styre spillerens bevegelser. Inkluder også en CollisionShape2D med en rektangelform og en Sprite2D for å representere spillerkarakteren.
extends CharacterBody2Dvar fart = 200
func _physics_process(delta):
var bevegelse = Vector2()if Input.is_action_pressed('ui_right'):
bevegelse.x += 1if Input.is_action_pressed('ui_left'):
bevegelse.x -= 1if Input.is_action_pressed('ui_down'):
bevegelse.y += 1if Input.is_action_pressed('ui_up'):
bevegelse.y -= 1bevegelse = bevegelse.normalized() * fart
move_and_collide(bevegelse * delta)
Denne koden tillater spillerkarakteren å bevege seg til venstre, høyre, opp og ned ved bruk av piltastene eller tilsvarende inndataenheter.
Etablering av forskjellige lag med ParallaxLayer-noder
Deretter skal du skape parallakse-effekten ved å legge til flere ParallaxLayer-noder i spillscenen. Hver ParallaxLayer vil representere et distinkt lag i bakgrunnen. For å generere en overbevisende parallakse-effekt, er det viktig at lagene som er lengre unna kameraet beveger seg langsommere enn de som er nærmere.
Legg til StaticBody2D-noder med CollisionShape2D i hver ParallaxLayer for å generere interaktive objekter i bakgrunnen. Disse interaktive objektene vil samhandle med spilleren og andre elementer i spillet, noe som bidrar til en mer kompleks og dyptgående spillopplevelse.
Her er GDScript-koden for å generere parallakse-lagene med interaktive objekter:
extends ParallaxBackgroundfunc _ready():
var lag1 = ParallaxLayer.new()
lag1.motion_scale = Vector2(0.2, 0.2)
add_child(lag1)
var static_body1 = StaticBody2D.new()
lag1.add_child(static_body1)var collision_shape1 = CollisionShape2D.new()
var shape1 = RectangleShape2D.new()
shape1.extents = Vector2(32, 32)
collision_shape1.shape = shape1
static_body1.add_child(collision_shape1)
var lag2 = ParallaxLayer.new()
lag2.motion_scale = Vector2(0.5, 0.5)
add_child(lag2)
var static_body2 = StaticBody2D.new()
lag2.add_child(static_body2)var collision_shape2 = CollisionShape2D.new()
var shape2 = RectangleShape2D.new()
shape2.extents = Vector2(64, 64)
collision_shape2.shape = shape2
static_body2.add_child(collision_shape2)
var lag3 = ParallaxLayer.new()
lag3.motion_scale = Vector2(1.0, 1.0)
add_child(lag3)
var static_body3 = StaticBody2D.new()
lag3.add_child(static_body3)var collision_shape3 = CollisionShape2D.new()
var shape3 = RectangleShape2D.new()
shape3.extents = Vector2(128, 128)
collision_shape3.shape = shape3
static_body3.add_child(collision_shape3)
Med denne koden inneholder hvert parallakse-lag nå en StaticBody2D-node med en CollisionShape2D som representerer interaktive objekter i bakgrunnen.
Disse interaktive objektene vil samhandle med spillerens karakter og andre spillelementer, og tilføre mer dybde og kompleksitet i spillopplevelsen.
Bevege forskjellige lag med varierende hastigheter
Etter at du har konfigurert parallakse-lagene dine, må du oppdatere deres posisjoner basert på spillerens bevegelse. Dette vil skape parallakse-effekten, hvor lagene som er nærmere kameraet beveger seg raskere enn de som er lenger unna.
Legg til følgende GDScript-kode i spillerscenen:
extends CharacterBody2Dfunc _physics_process(delta):
...
move_and_collide(bevegelse * delta)
var parallax_background = get_parent()
var motion = -bevegelse * delta
parallax_background.set_scroll_offset(parallax_background.scroll_offset + motion)
Denne koden beregner bevegelsen til parallakse-lagene basert på spillerens bevegelse og oppdaterer rulleforskyvningen til ParallaxBackground-noden i samsvar med dette. Merk bruken av det negative tegnet for å forsikre at lagene beveger seg i motsatt retning av spillerens bevegelse.
Tilfeldig parallakse-scrolling introduserer et element av overraskelse og uforutsigbarhet i spillets bakgrunn. Ved å dynamisk generere og plassere parallakse-lag under spillingen, kan du skape en mer engasjerende og dynamisk opplevelse for spillerne.
For å implementere tilfeldig parallakse-scrolling, legg til nye parallakse-lag med tilfeldige bevegelsesskalaer og posisjoner.
extends ParallaxBackgroundconst MAKS_LAG = 5
const MIN_SKALA = 0.2
const MAKS_SKALA = 1.5
const MIN_HASTIGHET = 0.01
const MAKS_HASTIGHET = 0.03
const MIN_X_POSISJON = -500
const MAKS_X_POSISJON = 500
const MIN_Y_POSISJON = -300
const MAKS_Y_POSISJON = 300func _ready():
for i in range(MAKS_LAG):
create_random_layer()func create_random_layer():
var lag = ParallaxLayer.new()
var skala = lerp(MIN_SKALA, MAKS_SKALA, randf())
lag.motion_scale = Vector2(skala, skala)var x_posisjon = randf_range(MIN_X_POSISJON, MAKS_X_POSISJON)
var y_posisjon = randf_range(MIN_Y_POSISJON, MAKS_Y_POSISJON)
lag.global_transform.origin.x = x_posisjon
lag.global_transform.origin.y = y_posisjonadd_child(lag)
var static_body = StaticBody2D.new()
lag.add_child(static_body)var collision_shape = CollisionShape2D.new()
var shape = RectangleShape2D.new()
shape.extents = Vector2(32, 32)
collision_shape.shape = shape
static_body.add_child(collision_shape)func remove_random_layer():
if get_child_count() > 0:
var random_index = randi() % get_child_count()
var layer_to_remove = get_child(random_index)
remove_child(layer_to_remove)
Denne koden definerer konstanter for å kontrollere tilfeldigheten til parallakse-lagene. Bruk lerp-funksjonen for å interpolere verdier mellom MIN_SKALA og MAKS_SKALA, og generer en tilfeldig bevegelsesskala for hvert nye lag. Denne funksjonen har følgende signatur:
Variant lerp ( Variant from, Variant to, float weight )
Ved å sende resultatet fra randf() som vekt, kan du generere lag med en tilfeldig skala.
Randf_range-funksjonen tilbyr en annen metode for å generere tilfeldige verdier innenfor et spesifikt område. Her benytter create_random_layer-funksjonen den til å generere tilfeldige posisjoner for de nye lagene innenfor et definert område:
var x_posisjon = randf_range(MIN_X_POSISJON, MAKS_X_POSISJON)
Demospillet ditt skal nå se omtrent slik ut:
Inkludering av tilleggsfunksjoner
Parallakse-scrolling gir et solid utgangspunkt for å forbedre det visuelle uttrykket i plattformspillet ditt, men du kan videreutvikle det ved å inkludere flere funksjoner. Her er noen ideer som er verdt å vurdere.
Bakgrunnsobjekter
Lag mer interaktive elementer i dine parallakse-lag, slik som flytende plattformer, bevegelige hindringer eller animerte bakgrunnsfigurer. Disse objektene kan tilføre dybde og interaktivitet til plattformspillet ditt.
Dynamisk belysning
Introduser dynamiske lyseffekter i dine parallakse-lag. Ved å implementere lyskilder og skygger, kan du skape en følelse av realisme og dybde i spillverdenen. Godots lyssystem fungerer godt med 2D-spill og kan forbedre den visuelle kvaliteten betraktelig.
Partikkeleffekter
Integrer partikkelsystemer i dine parallakse-lag for å legge til subtile visuelle effekter. Fallende løv, svevende skyer eller glitrende stjerner kan berike atmosfæren og gjøre spillverdenen mer levende. Du kan også legge til opphavsrettsfrie lydeffekter i spillet ditt.
Dag-natt syklus
Implementer en dag-natt-syklus som justerer fargen og intensiteten til parallakse-lagene basert på tiden på dagen i spillet. Denne dynamiske funksjonen kan gi spillerne en opplevelse i stadig utvikling etter hvert som de spiller.
Selv om parallakse-scrolling kan heve spillets visuelle egenskaper, er det viktig å følge noen beste praksiser for å garantere en smidig og behagelig opplevelse.
Ytelsesoptimalisering
Vær oppmerksom på antallet parallakse-lag og deres kompleksitet. For mange lag eller høyoppløselige ressurser kan forårsake ytelsesproblemer, spesielt på enheter med lavere ytelse. Optimaliser kunstverket og bruk forenklede kollisjonsformer når det er hensiktsmessig.
Lagarrangement
Organiser parallakse-lagene dine med omtanke. Vurder det visuelle hierarkiet og den ønskede dybdeeffekten. Lagene som er nærmest kameraet skal bevege seg raskere, mens de som er lenger unna skal bevege seg saktere.
Kameragrenser
Sett grenser for kamerabevegelsen for å unngå uønsket tomrom eller visuelle feil når spilleren når utkanten av spillverdenen. Dette vil sørge for en sømløs opplevelse for spillerne.
Testing og tilpasning
Test parallakse-scrolling på ulike enheter og skjermstørrelser for å sikre at det ser bra ut og fungerer godt på forskjellige plattformer. Ved å justere bevegelsesskalaene, lagposisjonene og andre parametere, kan du finjustere parallakse-effekten for best mulig resultat.
Å implementere tilfeldig parallakse-scrolling kan øke engasjementet i ditt Godot-spill betraktelig. Tilfeldig parallakse-scrolling innebærer dynamisk generering og plassering av parallakse-lag under spillingen.
Ved å gjøre dette, skaper du en følelse av bevegelse og dynamikk i bakgrunnen, noe som gjør at spillverdenen føles mer levende og uforutsigbar. Spillere vil oppleve et visuelt miljø i kontinuerlig forandring, og dette tilfører et ekstra lag med spenning i spillopplevelsen.