Paralaksno pomeranje je tehnika koju mnoge 2D igre koriste kako bi stvorile iluziju dubine i unapredile vizuelni aspekt pozadine igre. Ovaj efekat se postiže pomeranjem različitih slojeva pozadine različitim brzinama u odnosu na kretanje kamere.
Godot 4 pojednostavljuje implementaciju paralaksnog pomeranja više nego ikad pre. Njegov moćni 2D sistem pruža ugrađenu podršku za paralaksne slojeve, omogućavajući vam da kreirate zapanjujuće vizuelne efekte sa minimalnim naporom.
Podešavanje igre u Godot okruženju
Za početak, kreirajte novi 2D projekat u Godot game engine-u i postavite scenu igre sa likom igrača.
Kod koji se koristi u ovom tekstu je dostupan na ovom GitHub repozitorijumu i može se koristiti besplatno pod MIT licencom.
U ovom primeru, dodajte CharacterBody2D čvor za kretanje igrača. Zatim, dodajte CollisionShape2D sa pravougaonim oblikom i Sprite2D za vizuelnu reprezentaciju igrača.
extends CharacterBody2D
var speed = 200
func _physics_process(delta):
var velocity = Vector2()
if Input.is_action_pressed('ui_right'):
velocity.x += 1
if Input.is_action_pressed('ui_left'):
velocity.x -= 1
if Input.is_action_pressed('ui_down'):
velocity.y += 1
if Input.is_action_pressed('ui_up'):
velocity.y -= 1
velocity = velocity.normalized() * speed
move_and_collide(velocity * delta)
Sa ovim kodom, igrač se može kretati levo, desno, gore i dole koristeći tastere sa strelicama ili slične kontrole.
Kreiranje različitih slojeva pomoću ParallaxLayer čvorova
Sledeći korak je kreiranje efekta paralakse dodavanjem nekoliko ParallaxLayer čvorova na scenu. Svaki ParallaxLayer će predstavljati drugačiji sloj pozadine. Za ubedljiv paralaksni efekat, slojevi udaljeniji od kamere treba da se kreću sporije od onih koji su bliže.
Dodajte StaticBody2D čvorove sa CollisionShape2D u svaki ParallaxLayer kako biste stvorili objekte u pozadini sa kojima je moguća interakcija. Ovi objekti će komunicirati sa igračem i ostalim elementima igre, dodajući na dubini igračkog iskustva.
Evo GDScript koda za kreiranje paralaksnih slojeva sa objektima koji se mogu sudarati:
extends ParallaxBackground
func _ready():
var layer1 = ParallaxLayer.new()
layer1.motion_scale = Vector2(0.2, 0.2)
add_child(layer1)
var static_body1 = StaticBody2D.new()
layer1.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 layer2 = ParallaxLayer.new()
layer2.motion_scale = Vector2(0.5, 0.5)
add_child(layer2)
var static_body2 = StaticBody2D.new()
layer2.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 layer3 = ParallaxLayer.new()
layer3.motion_scale = Vector2(1.0, 1.0)
add_child(layer3)
var static_body3 = StaticBody2D.new()
layer3.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)
Nakon primene ovog koda, svaki paralaksni sloj sada sadrži StaticBody2D čvor sa CollisionShape2D, koji predstavljaju objekte u pozadini sa kojima je moguća interakcija.
Ovi objekti će biti u interakciji sa igračem i ostalim elementima u igri, doprinoseći dubini i složenosti igračkog iskustva.
Pomeranje različitih slojeva različitim brzinama
Kada ste postavili paralaksne slojeve, potrebno je da ažurirate njihove pozicije u zavisnosti od kretanja igrača. Ovo će stvoriti efekat paralakse, gde se slojevi bliže kameri kreću brže od onih koji su udaljeniji.
Dodajte sledeći GDScript kod na Player scenu:
extends CharacterBody2D
func _physics_process(delta):
...
move_and_collide(velocity * delta)
var parallax_background = get_parent()
var motion = -velocity * delta
parallax_background.set_scroll_offset(parallax_background.scroll_offset + motion)
Ovaj kod računa kretanje paralaksnih slojeva na osnovu kretanja igrača i shodno tome ažurira poziciju ParallaxBackground čvora. Obratite pažnju na upotrebu negativnog znaka kako biste obezbedili da se slojevi kreću u suprotnom smeru od kretanja igrača.
Nasumično paralaksno pomeranje uvodi element iznenađenja i nepredvidivosti u pozadinu vaše igre. Dinamičkim generisanjem i pozicioniranjem paralaksnih slojeva tokom igranja, možete stvoriti dinamičnije i zanimljivije iskustvo za igrače.
Da biste implementirali nasumično paralaksno pomeranje, dodajte nove paralaksne slojeve sa nasumičnim skalama i pozicijama kretanja.
extends ParallaxBackground
const MAX_LAYERS = 5
const MIN_SCALE = 0.2
const MAX_SCALE = 1.5
const MIN_SPEED = 0.01
const MAX_SPEED = 0.03
const MIN_X_POSITION = -500
const MAX_X_POSITION = 500
const MIN_Y_POSITION = -300
const MAX_Y_POSITION = 300
func _ready():
for i in range(MAX_LAYERS):
create_random_layer()
func create_random_layer():
var layer = ParallaxLayer.new()
var scale = lerp(MIN_SCALE, MAX_SCALE, randf())
layer.motion_scale = Vector2(scale, scale)
var x_position = randf_range(MIN_X_POSITION, MAX_X_POSITION)
var y_position = randf_range(MIN_Y_POSITION, MAX_Y_POSITION)
layer.global_transform.origin.x = x_position
layer.global_transform.origin.y = y_position
add_child(layer)
var static_body = StaticBody2D.new()
layer.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)
Ovaj kod definiše konstante za kontrolu nasumičnosti paralaksnih slojeva. Koristi funkciju `lerp` da interpolira vrednosti između `MIN_SCALE` i `MAX_SCALE`, generišući nasumičnu skalu kretanja za svaki novi sloj. Ova funkcija ima sledeći potpis:
Variant lerp ( Variant from, Variant to, float weight )
Prosleđivanje rezultata funkcije `randf()` kao težine omogućava generisanje slojeva sa nasumičnom skalom.
Funkcija `randf_range` nudi još jedan način generisanja slučajnih vrednosti unutar određenog opsega. Ovde, funkcija `create_random_layer` je koristi da generiše nasumične pozicije za nove slojeve unutar određenog opsega:
var x_position = randf_range(MIN_X_POSITION, MAX_X_POSITION)
Vaša demo igra bi sada trebala da izgleda otprilike ovako:
Dodatne funkcionalnosti
Paralaksno pomeranje pruža čvrstu osnovu za poboljšanje vizuelne privlačnosti vaše platformerske igre, ali možete ići korak dalje dodavanjem dodatnih funkcija. Evo nekoliko ideja koje treba razmotriti.
Pozadinski objekti
Napravite više interaktivnih elemenata u paralaksnim slojevima, poput platformi koje lebde, pokretnih prepreka ili animiranih pozadinskih likova. Ovi objekti mogu dodati dubinu i interaktivnost vašoj platformerskoj igri.
Dinamičko osvetljenje
Uvedite dinamičke svetlosne efekte u paralaksne slojeve. Dodavanjem izvora svetlosti i senki možete stvoriti osećaj realizma i dubine u svetu igre. Godotov sistem osvetljenja dobro funkcioniše sa 2D igrama i može značajno poboljšati vizuelni kvalitet.
Efekti čestica
Integrirajte sisteme čestica u paralaksne slojeve da biste dodali suptilne vizuelne efekte. Padajuće lišće, lebdeći oblaci ili svetlucave zvezde mogu poboljšati atmosferu i učiniti da se svet igre oseća življim. Takođe možete dodati i zvučne efekte bez autorskih prava u svoju igru.
Ciklus dan-noć
Implementirajte ciklus dan-noć koji menja boju i intenzitet paralaksnih slojeva u zavisnosti od doba dana u igri. Ova dinamička funkcija može igračima pružiti iskustvo koje se stalno razvija dok napreduju kroz igru.
Iako paralaksno pomeranje može poboljšati vizuelni doživljaj vaše igre, neophodno je da pratite neke najbolje prakse kako biste obezbedili glatko i prijatno iskustvo.
Optimizacija performansi
Imajte na umu broj paralaksnih slojeva i njihovu složenost. Previše slojeva ili resursa visoke rezolucije može dovesti do problema sa performansama, posebno na slabijim uređajima. Optimizujte svoje grafike i koristite pojednostavljene oblike sudara gde je to moguće.
Raspored slojeva
Pažljivo rasporedite paralaksne slojeve. Uzmite u obzir vizuelnu hijerarhiju i željeni efekat dubine. Slojevi koji su najbliži kameri bi trebalo da se kreću brže, dok oni udaljeniji treba da se kreću sporije.
Granice kamere
Postavite granice za kretanje kamere kako biste sprečili neželjeni prazan prostor ili vizuelne greške kada igrač dođe do ivica sveta igre. Ovo osigurava besprekorno iskustvo za igrače.
Testiranje i podešavanje
Testirajte paralaksno pomeranje na različitim uređajima i veličinama ekrana da biste bili sigurni da izgleda i radi dobro na različitim platformama. Podešavanjem skala kretanja, pozicija slojeva i drugih parametara možete fino podesiti efekat paralakse za najbolje rezultate.
Dodavanje nasumičnog paralaksnog pomeranja može značajno da unapredi angažovanje igrača u vašoj Godot igri. Nasumično paralaksno pomeranje podrazumeva dinamičko generisanje i pozicioniranje paralaksnih slojeva tokom igre.
Na taj način stvarate osećaj kretanja i dinamike u pozadini, čineći da se svet igre čini živim i nepredvidivim. Igrači će iskusiti vizuelno okruženje koje se stalno menja, dodajući novi nivo uzbuđenja njihovom iskustvu igranja.