Ta osupljiv vizualni učinek lahko dosežete preprosto s premikanjem predmetov z različnimi hitrostmi.

Drsenje s paralakso je tehnika, ki jo uporabljajo številne 2D igre, da ustvarijo iluzijo globine in dodajo vizualno zanimivost ozadju igre. Učinek doseže s premikanjem različnih plasti ozadja z različnimi hitrostmi glede na gibanje kamere.

Godot 4 omogoča lažje kot kdaj koli prej implementacijo drsenja po paralaksi. Njegov zmogljiv 2D motor zagotavlja vgrajeno podporo za plasti paralakse, kar vam omogoča ustvarjanje osupljivih vizualnih učinkov z minimalnim naporom.

Nastavitev igre Godot

Za začetek ustvarite nov 2D projekt v igralni motor Godot in nastavite sceno igre z likom igralca.

Koda, uporabljena v tem članku, je na voljo tukaj Repozitorij GitHub in je brezplačen za uporabo pod licenco MIT.

Za ta primer dodajte a CharacterBody2D vozlišče za gibanje igralca. Dodajte tudi a CollisionShape2D s pravokotno obliko in a Sprite2D da predstavlja igralčev lik.

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)

S to kodo se lahko igralec premika levo, desno, gor in dol z uporabo puščičnih tipk ali podobnih vnosov.

Ustvarjanje različnih plasti z vozlišči ParallaxLayer

Nato ustvarite učinek paralakse z dodajanjem več ParallaxLayer vozlišča do scene. Vsak ParallaxLayer bo predstavljal drugačno plast ozadja. Da bi dosegli prepričljiv učinek paralakse, bi se morale plasti, ki so bolj oddaljene od kamere, premikati počasneje od bližjih.

Dodaj Statično telo2D vozlišča z CollisionShape2D v vsakem ParallaxLayer ustvariti nekaj predmetov, ki jih je mogoče trčiti v ozadju. Ti predmeti, ki jih je mogoče trčiti, bodo sodelovali z igralcem in drugimi elementi igre ter dodali več globine igranju.

Tukaj je koda GDScript za ustvarjanje plasti paralakse s predmeti, ki jih je mogoče trčiti:

extends ParallaxBackground

func _ready():
# Create the first parallax layer
var layer1 = ParallaxLayer.new()
layer1.motion_scale = Vector2(0.2, 0.2)
add_child(layer1)

# Add a StaticBody2D with CollisionShape2D to the first layer
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)

# Create the second parallax layer
var layer2 = ParallaxLayer.new()
layer2.motion_scale = Vector2(0.5, 0.5)
add_child(layer2)

# Add a StaticBody2D with CollisionShape2D to the second layer
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)

# Create the third parallax layer
var layer3 = ParallaxLayer.new()
layer3.motion_scale = Vector2(1.0, 1.0)
add_child(layer3)

# Add a StaticBody2D with CollisionShape2D to the third layer
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)

S to kodo vsak sloj paralakse zdaj vsebuje a Statično telo2D vozlišče z a CollisionShape2D predstavlja predmete, ki jih je mogoče trčiti v ozadju.

Ti predmeti, ki jih je mogoče trčiti, bodo sodelovali z igralčevim likom in drugimi elementi igre ter dodali več globine in kompleksnosti igranja.

Premikanje različnih plasti z različno hitrostjo

Zdaj, ko imate nastavljene plasti paralakse, morate posodobiti njihove položaje glede na igralčevo gibanje. To bo ustvarilo učinek paralakse, kjer se plasti, ki so bližje kameri, premikajo hitreje od tistih, ki so bolj oddaljene.

V sceno predvajalnika dodajte naslednjo kodo GDScript:

extends CharacterBody2D

func _physics_process(delta):
...
move_and_collide(velocity * delta)

# Update parallax layers based on player movement
var parallax_background = get_parent()
var motion = -velocity * delta
parallax_background.set_scroll_offset(parallax_background.scroll_offset + motion)

Ta koda izračuna gibanje slojev paralakse na podlagi gibanja igralca in ustrezno posodobi odmik drsenja vozlišča ParallaxBackground. Upoštevajte uporabo negativnega predznaka, da zagotovite, da se plasti premikajo v nasprotni smeri gibanja igralca.

Naključno pomikanje po paralaksi v ozadje vaše igre vnese element presenečenja in nepredvidljivosti. Z dinamičnim ustvarjanjem in pozicioniranjem slojev paralakse med igranjem lahko ustvarite bolj privlačno in dinamično izkušnjo za igralce.

Če želite izvesti naključno pomikanje po paralaksi, dodajte nove plasti paralakse z naključnimi lestvicami in položaji gibanja.

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():
# Add a new parallax layer with a random motion scale
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)

# Add a StaticBody2D with CollisionShape2D to the new 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():
# Remove a random parallax 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)

Ta koda definira konstante za nadzor naključnosti slojev paralakse. Uporabi lerp funkcijo za interpolacijo vrednosti med MIN_SCALE in MAX_SCALE, ki generira naključno lestvico gibanja za vsako novo plast. Ta funkcija ima naslednji podpis:

Variant lerp ( Variant from, Variant to, float weight )

Prenos rezultata iz randf() saj teža omogoča ustvarjanje plasti z naključno lestvico.

The razpon_randf ponuja drug način generiranja naključnih vrednosti znotraj obsega. Tu jo funkcija create_random_layer uporablja za generiranje naključnih položajev za nove plasti v določenem obsegu:

var x_position = randf_range(MIN_X_POSITION, MAX_X_POSITION)

Vaša demo igra bi zdaj morala izgledati nekako takole:

Vključno z dodatnimi funkcijami

Pomikanje po paralaksi zagotavlja trdno osnovo za izboljšavo vaše platformske igre vizualno privlačnost, vendar jo lahko naredite še dlje z vključitvijo dodatnih funkcij. Tukaj je nekaj idej, ki jih je treba upoštevati.

Predmeti v ozadju

Ustvarite več interaktivnih elementov v svojih slojih paralakse, kot so lebdeče platforme, premikajoče se ovire ali animirani liki v ozadju. Ti predmeti lahko vaši platformski igri dodajo globino in interaktivnost.

Dinamična osvetlitev

V plasti paralakse dodajte dinamične svetlobne učinke. Z dodajanjem virov svetlobe in senc lahko ustvarite občutek realizma in globine v svetu igre. Godotov sistem osvetlitve dobro deluje z 2D igrami in lahko bistveno izboljša vizualno kakovost.

Učinki delcev

Integrirajte sisteme delcev v vaše plasti paralakse, da dodate subtilne vizualne učinke. Padajoče listje, lebdeči oblaki ali lesketajoče se zvezde lahko izboljšajo vzdušje in naredijo svet igre bolj živ. Lahko tudi dodajte zvočne učinke brez avtorskih pravic vaši igri.

Cikel dan-noč

Izvedite cikel dan-noč, ki spremeni barvo in intenzivnost plasti paralakse glede na čas dneva v igri. Ta dinamična funkcija lahko igralcem nudi nenehno razvijajočo se izkušnjo, ko napredujejo skozi igro.

Medtem ko lahko pomikanje s paralakso izboljša vizualne podobe vaše igre, je bistveno, da upoštevate nekaj najboljših praks, da zagotovite gladko in prijetno izkušnjo.

Optimizacija zmogljivosti

Bodite pozorni na število slojev paralakse in njihovo kompleksnost. Preveč slojev ali sredstev visoke ločljivosti lahko povzroči težave z zmogljivostjo, zlasti na manj zmogljivih napravah. Optimizirajte svoje umetnine in uporabite poenostavljene trčne oblike, kjer je to mogoče.

Razporeditev plasti

Premišljeno razporedite plasti paralakse. Upoštevajte vizualno hierarhijo in želeni učinek globine. Plasti, ki so najbližje kameri, bi se morale premikati hitreje, tiste bolj oddaljene pa počasneje.

Meje kamere

Nastavite meje za gibanje kamere, da preprečite neželen prazen prostor ali vizualne napake, ko igralec doseže robove sveta igre. To zagotavlja brezhibno izkušnjo za igralce.

Testiranje in prilagajanje

Preizkusite drsenje po paralaksi na različnih napravah in velikostih zaslona, ​​da zagotovite, da izgleda in deluje dobro na različnih platformah. S prilagajanjem lestvic gibanja, položajev plasti in drugih parametrov lahko natančno prilagodite učinek paralakse za najboljše rezultate.

Če dodate naključno pomikanje po paralaksi, lahko znatno povečate stopnjo angažiranosti vaše igre Godot. Naključno pomikanje po paralaksi vključuje dinamično generiranje in pozicioniranje plasti paralakse med igranjem.

S tem ustvarite občutek gibanja in dinamike v ozadju, zaradi česar se svet igre zdi živ in nepredvidljiv. Igralci bodo izkusili nenehno spreminjajoče se vizualno okolje, ki bo dodalo dodatno plast razburljivosti svoji igralni izkušnji.