Anda dapat mencapai efek visual yang mengesankan ini hanya dengan menggerakkan objek dengan kecepatan berbeda.

Pengguliran paralaks adalah teknik yang digunakan banyak game 2D untuk menciptakan ilusi kedalaman dan menambah ketertarikan visual pada latar belakang game. Ini mencapai efek dengan menggerakkan berbagai lapisan latar belakang dengan kecepatan berbeda relatif terhadap pergerakan kamera.

Godot 4 mempermudah penerapan pengguliran paralaks. Mesin 2D-nya yang kuat memberikan dukungan bawaan untuk lapisan paralaks, memungkinkan Anda membuat efek visual yang menakjubkan dengan sedikit usaha.

Menyiapkan Game Godot

Untuk memulai, buat proyek 2D baru di mesin permainan Godot dan atur adegan permainan dengan karakter pemain.

Kode yang digunakan dalam artikel ini tersedia di sini repositori GitHub dan gratis untuk Anda gunakan di bawah lisensi MIT.

Untuk contoh ini, tambahkan a KarakterBody2D simpul untuk pergerakan pemain. Tambahkan juga a TabrakanBentuk2D dengan bentuk persegi panjang dan a Sprite2D untuk mewakili karakter pemain.

instagram viewer 
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)

Dengan kode ini, karakter pemain dapat bergerak ke kiri, kanan, atas, dan bawah menggunakan tombol panah atau input serupa.

Membuat Lapisan Berbeda Dengan Node ParallaxLayer

Selanjutnya, buat efek paralaks dengan menambahkan banyak Lapisan Paralaks node ke TKP. Setiap Lapisan Paralaks akan mewakili lapisan latar belakang yang berbeda. Untuk mencapai efek paralaks yang meyakinkan, lapisan yang lebih jauh dari kamera harus bergerak lebih lambat daripada yang lebih dekat.

Menambahkan Tubuh Statis2D node dengan TabrakanBentuk2D di setiap Lapisan Paralaks untuk membuat beberapa objek collidable di latar belakang. Objek yang dapat bertabrakan ini akan berinteraksi dengan pemain dan elemen game lainnya, menambah kedalaman gameplay.

Berikut kode GDScript untuk membuat lapisan paralaks dengan objek yang dapat dikolaborasikan:

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)

Dengan kode ini, setiap lapisan paralaks sekarang berisi a Tubuh Statis2D simpul dengan a TabrakanBentuk2D mewakili objek collidable di latar belakang.

Objek yang dapat bertabrakan ini akan berinteraksi dengan karakter pemain dan elemen game lainnya, menambah kedalaman dan kompleksitas gameplay.

Memindahkan Lapisan Berbeda Dengan Kecepatan Berbeda

Sekarang setelah Anda menyiapkan lapisan paralaks, Anda perlu memperbarui posisinya berdasarkan pergerakan pemain. Ini akan menciptakan efek paralaks, di mana lapisan yang lebih dekat ke kamera bergerak lebih cepat daripada yang lebih jauh.

Tambahkan kode GDScript berikut ke layar Player:

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)

Kode ini menghitung pergerakan lapisan paralaks berdasarkan pergerakan pemain dan memperbarui offset gulir dari node ParallaxBackground. Perhatikan penggunaan tanda negatif untuk memastikan lapisan bergerak berlawanan arah dengan gerakan pemain.

Pengguliran paralaks acak memperkenalkan elemen kejutan dan ketidakpastian ke latar belakang game Anda. Dengan menghasilkan dan memposisikan lapisan paralaks secara dinamis selama bermain game, Anda dapat menciptakan pengalaman yang lebih menarik dan dinamis bagi pemain.

Untuk menerapkan pengguliran paralaks acak, tambahkan lapisan paralaks baru dengan skala dan posisi gerakan acak.

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)

Kode ini mendefinisikan konstanta untuk mengontrol keacakan lapisan paralaks. Menggunakan lerp berfungsi untuk menyisipkan nilai antara MIN_SKALA Dan MAX_SCALE, menghasilkan skala gerak acak untuk setiap lapisan baru. Fungsi ini memiliki tanda tangan berikut:

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

Meneruskan hasil dari randf() karena bobot memungkinkan Anda menghasilkan lapisan dengan skala acak.

Itu randf_range fungsi menawarkan cara lain untuk menghasilkan nilai acak dalam rentang. Di sini, fungsi create_random_layer menggunakannya untuk menghasilkan posisi acak untuk layer baru dalam rentang tertentu:

var x_position = randf_range(MIN_X_POSITION, MAX_X_POSITION)

Game demo Anda sekarang akan terlihat seperti ini:

Termasuk Fitur Tambahan

Pengguliran paralaks memberikan dasar yang kuat untuk peningkatan game platformer Anda daya tarik visual, tetapi Anda dapat melangkah lebih jauh dengan memasukkan fitur tambahan. Berikut adalah beberapa ide untuk dipertimbangkan.

Objek Latar Belakang

Buat lebih banyak elemen interaktif di lapisan paralaks Anda, seperti platform mengambang, rintangan bergerak, atau karakter latar animasi. Objek-objek ini dapat menambah kedalaman dan interaktivitas ke game platformer Anda.

Pencahayaan dinamis

Perkenalkan efek pencahayaan dinamis ke lapisan paralaks Anda. Dengan menambahkan sumber cahaya dan bayangan, Anda dapat menciptakan kesan realisme dan kedalaman di dunia game. Sistem pencahayaan Godot bekerja dengan baik dengan game 2D dan dapat meningkatkan kualitas visual secara signifikan.

Efek Partikel

Integrasikan sistem partikel ke dalam lapisan paralaks Anda untuk menambahkan efek visual yang halus. Dedaunan yang berguguran, awan yang melayang, atau gemerlap bintang dapat mempercantik suasana dan membuat dunia game terasa lebih hidup. Anda juga bisa tambahkan efek suara bebas hak cipta ke permainan Anda.

Siklus Siang-Malam

Terapkan siklus siang-malam yang mengubah warna dan intensitas lapisan paralaks berdasarkan waktu dalam game. Fitur dinamis ini dapat memberi pemain pengalaman yang terus berkembang saat mereka maju melalui permainan.

Meskipun pengguliran paralaks dapat meningkatkan visual game Anda, penting untuk mengikuti beberapa praktik terbaik untuk memastikan pengalaman yang lancar dan menyenangkan.

Optimalisasi Kinerja

Perhatikan jumlah lapisan paralaks dan kerumitannya. Terlalu banyak lapisan atau aset beresolusi tinggi dapat menyebabkan masalah kinerja, terutama pada perangkat yang kurang bertenaga. Optimalkan karya seni Anda dan gunakan bentuk tabrakan yang disederhanakan jika memungkinkan.

Susunan Lapisan

Atur lapisan paralaks Anda dengan cermat. Pertimbangkan hierarki visual dan efek kedalaman yang diinginkan. Lapisan yang paling dekat dengan kamera harus bergerak lebih cepat, sedangkan yang lebih jauh harus bergerak lebih lambat.

Batas Kamera

Tetapkan batasan untuk pergerakan kamera untuk mencegah ruang kosong yang tidak diinginkan atau gangguan visual saat pemain mencapai tepi dunia game. Ini memastikan pengalaman yang mulus bagi para pemain.

Pengujian dan Tweak

Uji pengguliran paralaks Anda di berbagai perangkat dan ukuran layar untuk memastikannya terlihat dan bekerja dengan baik di berbagai platform. Menyesuaikan skala gerak, posisi lapisan, dan parameter lainnya dapat menyempurnakan efek paralaks untuk hasil terbaik.

Menambahkan pengguliran paralaks acak dapat meningkatkan tingkat keterlibatan game Godot Anda secara signifikan. Pengguliran paralaks acak melibatkan pembuatan dan pemosisian lapisan paralaks secara dinamis selama bermain game.

Dengan melakukan ini, Anda menciptakan kesan pergerakan dan dinamisme di latar belakang, membuat dunia game terasa hidup dan tidak dapat diprediksi. Pemain akan mengalami lingkungan visual yang terus berubah, menambah lapisan kegembiraan ekstra untuk pengalaman bermain game mereka.