Trong bài viết mình sử dụng thư viện p5js để code, bạn có thể tìm hiểu về thư viện này qua:

• https://p5js.org/
• https://viblo.asia/p/tim-hieu-ve-p5js-phan-1-RnB5p07w5PG
• https://viblo.asia/p/tim-hieu-ve-p5js-phan-2-aWj53kbY56m

Bắt đầu với tạo hình các nhân vật

Zombie:

Người chơi:

Cầm súng:

Zombie thì mình lấy ý tưởng từ minecraft còn người chơi thì lại từ game surviv.io nên mới con hình vuông, con hình tròn vậy

Di chuyển

Người chơi:

Các phím điều khiển: "W, A, S, D"

Zombie:

Của zombie thì sẽ lấy người chơi làm mục tiêu và lao vào tấn công

Bắn súng

Việc vẽ các viên đạn cần một mảng để lưu trữ từng viên, vì vậy sau một thời gian mảng sẽ rất lớn và tốn bộ nhớ, mình cần đặt một khoảng thời gian chết cho viên đạn, và xóa chúng đi.

Ngoài ra mình còn đặt một khoảng thời gian trễ giữa 2 lần bắn khi người dùng giữ chuột.

Một số cái nhỏ nhặt khác như làm hiệu ứng bay của đạn cho đẹp

Cái chết

Phần này thì mình cần phải tính toán đạn có bắn trúng zombie hay không, cách thức thì là đo khỏang cách giữa viên đạn và con zombie thôi, một vật hình vuông thì hơi khó tính, nên mình đặt hitbox của con zombie là hình tròn luôn

Khi bị bắn trúng sẽ mất máu và chết, rồi lại tái sinh thành con khác:

Nhân vật thì hiện tại vẫn bất tử

Hiệu ứng âm thanh

Bạn có thể xem demo bản có âm thanh tại đây:

https://hungkieu.github.io/fly/

Kết thúc

Phần tiếp theo mình sẽ đưa thêm các hiệu ứng, thêm UI cho game, ngoài ra sẽ tối ưu hóa phần code , còn phần 1 đến đây là hết, cảm ơn các bạn đã xem bài viết.