[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background

Trong phần này, mình sẽ hướng dẫn bạn cách thêm Background và điều chỉnh lại camera cho nó hợp lý và đẹp mắt hơn nha.

Lỗi nhân vật

Thì ở phần trước mình chỉ bạn các xoay nhân vật và sẽ có vài bạn gặp lỗi là khi xoay nhân vật thì nó sẽ rơi xuống hoặc giật giật thì sau đây là cách fix.[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background

Bạn đang bị lỗi đó là do nhân vật nó như thế này, do nó lệch vị trí.

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 29

Các bạn sẽ phải set lại vị trí chính giữa.

Sau đó là sẽ không còn bị vậy nữa nha.

Background

Tải xuống

Ở phần 2 khi mình cung cấp link tải tileset thì nó đã bao gồm cả background rồi, nếu bạn nào xoá rồi thì có thể tải lại ở link sau: Swamp 2D Tileset

Cài đặt

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 30 [Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 31

Bạn tải về và đưa ảnh background ở Folder 2 Background vào trong Folder Assets của game.

Kiểu 1

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 32Các bạn thêm cho mình node ParallaxBackground[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 33

Thêm 1 nút Sprite là con của nút Background.

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 34

Bạn chọn nút Sprite sau đó kéo file ảnh background vào Texture.

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 35

Bạn sẽ được như này.

Và bạn nhớ cho mình là cái khung màu xanh nươc biển chính là cái khung mà người dùng có thể nhìn thấy được.[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 36

Mình sẽ kéo cái background cho vừa với khung xanh.

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 37

Rồi chạy game các bạn sẽ thấy background nó đã xuất hiện và luôn di chuyển theo bạn.

Kiểu 2

Nếu bạn muốn background không di chuyển theo bạn thì làm như sau.

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 38

Bạn tạo thêm 1 nút ParallaxLayer và đưa Sprite vào làm con của nút đó.

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 39

Rồi ở nút ParallaxLayer  -> Motion bạn sẽ thấy phần Mirroring thì ở x các bạn chỉnh lên 1000 cho mình.

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 40

Sau khi chỉnh lên 1000 các bạn sẽ thấy sẽ có thêm 1 cái background nữa xuất hiện và mình gọi đây là Infinity Background.

Bạn thiết kế level bạn đến đâu thì bạn set cái Background nó đến đó.

Camera

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 41

Mình cũng sẽ chỉ bạn thêm cách tối ưu hoá camera nhìn cho đep, nếu bạn nhìn hình trên sẽ thấy không đẹp tý nào.

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 42

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 43Đầu tiên, các bạn phải xem cho mình toạ độ mà bạn muốn camera chỉ di chuyển tới đó bằng cách zoom chỗ bạn muốn lên và xem ở thanh toạ độ.

Ở đây bên trái mình muốn góc nhìn camera tối đa là ở toạ độ 0, bên dưới thì là 550, bên trên là 0 nốt.

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 44

Sau khi có toạ độ mình sẽ vô Player -> Camera2D -> Limit và điền toạ độ vào.[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 45

Mình sẽ được như này sau khi chỉnh xong, nhìn nó rất là ổn nha.

Camera theo từng map

Sẽ có những map khác nhau và camera mỗi map bạn sẽ phải limit khác nhau do đó nếu như bạn chỉnh trong Player thì khi ở map khác sẽ bị lỗi phần này.

Do đó, mình có cách này để bạn có thể chỉnh limit camera theo từng map.[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 46

Bạn vào map bạn muốn sau đó chọn Player chuột phải -> nhấn vào Editable Children ( cho phép bạn chỉnh sửa nút Instance dưới dạng 1 nút con )

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 47

Sau đó, bạn tìm Camera2D và chỉnh lại thôi.

Điều chỉnh game khi phóng to thu nhỏ

Khi phóng to thu nhỏ game theo setting mặc định game sẽ không giữ được như mặc định mà nó sẽ to nhỏ[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 48

Ví dụ như này là khi mình thu nhỏ.

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 49

Còn đây là khi thu nhỏ theo setting khác.

Nó tuỳ thuộc game bạn muốn làm và bạn muốn nó như nào.

[Tạo 2D Platformer Game với Godot] Phần 6: Thêm Background 50

Để được như trên thì các bạn vô Project Settings tìm Display chọn Window và chỉnh ở Mode, Aspect nó có nhiều chế độ để bạn khám phá.

Tổng Kết

Vậy trong phần này mình đã hướng dẫn bạn cách thêm background và điều chỉnh camera sao cho nó hợp lý rồi.

Previous Post Next Post