Bagaimana Menambahkan Efek Drift ke Game HTML5 Anda

Anda dapat menggunakan vektor kekuatan dengan cara yang menarik dalam permainan HTML5 Anda. Banyak game balap termasuk mekanisme penyaradan atau penyimpangan. Mendapatkan perilaku ini benar membutuhkan matematika yang sangat canggih, namun Anda bisa membuat perkiraan yang masuk akal dari perilaku ini tanpa terlalu banyak usaha.

Gambar ini tidak cukup. Anda benar-benar perlu melihat ini sebagai program kerja karena sangat keren. Saat Anda menggerakkan perahu di sekitar layar, perahu melayang dan tergelincir. Ini sangat menyenangkan untuk dimainkan.

Cara menambahkan perilaku melayang ke objek permainan Anda

Untuk mendapatkan perilaku melayang sederhana, cukup tambahkan vektor kekuatan kecil ke arah kapal saat ini terlepas dari apakah pengguna saat ini menekan pedal gas.

Teknik ini adalah kompromi antara gerak berbasis ruang (dimana vektor gaya ditambahkan hanya saat akselerator ditekan) dan perilaku mobil standar (di mana arah perjalanan selalu mengikuti hidung kendaraan). Setiap frame memiliki sedikit setiap perilaku.

Inilah kodenya:

melayang. permainan var html; perahu var; fungsi Boat () {tBoat = new Sprite (permainan, "boat. png", 100, 50); tBoat checkKeys = function () {console. log (kecepatan ini); jika (keysDown [K_LEFT]) {this. changeImgAngleBy (-5);} if (keysDown [K_RIGHT]) {this. changeImgAngleBy (5);} if (keysDown [K_UP]) {this. addVector (this getImgAngle (), 2);} ini. addVector (ini getImgAngle (), (ini kecepatan / 20)); } // akhiri checkKeys tBoat. checkDrag = function () {speed = ini. getSpeed ​​(); kecepatan * =. 95; ini. setSpeed ​​(kecepatan);} kembali tBoat;} fungsi init () {game = new Scene (); permainan. setBG ("# 000066"); perahu = perahu baru (); permainan. start ();} // akhirin fungsi init update () {game. bersih(); perahu. checkKeys (); perahu. checkDrag (); perahu. update ();}

Cara menambahkan melayang ke sprite permainan Anda

Ini adalah prosedur yang sangat sederhana.

1. Bangun model kendaraan standar.

   Pertimbangkan untuk membuat perahu, hanya untuk variasi.

2. Gunakan vektor gaya untuk akselerasi.

   Sekali lagi, Anda mengendalikan kecepatan secara manual, jadi mekanisme addVector () memberi Anda kekuatan besar. Vektor gaya akselerasi (yang digunakan pada tombol panah panah atas) bisa menjadi nilai literal, namun tidak perlu berukuran besar. Karena Anda benar-benar akan menambahkan vektor gaya kedua, Anda mungkin ingin menurunkan vektor percepatan.

3. Tambahkan vektor gaya kecil setiap frame.

   Kekuatan vektor utama hanya terjadi bila Anda mempercepat, namun vektor sekunder sekunder ditambahkan setiap frame. Vektor ini menuju ke arah yang sedang dihadapi kapal saat ini.Vektor gerak kecil ini akan mensimulasikan momentum. Penting agar vektor kekuatan ini menjadi persentase kecepatan daripada nilai literal. Jika Anda selalu bergerak maju satu piksel, misalnya, perahu tidak akan pernah berhenti.