Bagaimana Menambah Graviti untuk Permainan HTML5 Anda - pengkitaan graviti

Pengiraan graviti telah menjadi sebahagian daripada permainan video HTML5 dari awal lagi. Sebenarnya terdapat dua jenis graviti untuk dipertimbangkan. Dalam permainan gaya platform, pemain adalah dekat dengan planet, dan semua graviti muncul untuk menarik semuanya terus ke bawah.

Apabila anda tahu bagaimana untuk menambah vektor percepatan, graviti gaya platform sebenarnya mudah untuk digunakan. Fikirkan graviti sebagai kekuatan yang berterusan selalu menarik sedikit jumlah setiap bingkai.

Bagaimana untuk menambah roket ke perjalanan permainan anda

Contoh ini mempunyai satu lagi ciri menarik yang lain. Apabila anda menekan anak panah atas, imej kereta akan ditukar kepada imej lain dengan api.

Kod untuk contoh hoverCar ditunjukkan di sini secara keseluruhannya:

hoverCar. html var kereta; var bandar; permainan var; fungsi Kereta () {tCar = Sprite baru (permainan, "hoverCar. png", 70, 50); tCar. setSpeed ​​(0); tCar. hSpeed ​​= 0 tCar. checkKeys = function () {tCar. changeImage ("hoverCar. png"); jika (keysDown [K_LEFT]) { ini. hSpeed ​​- = 1 } jika (keysDown [K_RIGHT]) { ini. hSpeed ​​+ = 1 } jika (keysDown [K_UP]) { ini. addVector (0,.5); ini. changeImage ("hoverCarThrust. png") ;} ini. changeXby (hSpeed ​​ini); } // check cekKeys tCar. checkGravity = function () { if (this. y> 580) { ini. setPosition (ini. x, 580); } lain { ini. addVector (180,. 1); } // end jika } // end checkGravity return tCar;} // end car def function init () {game = Scene new (); kereta = Kereta baru (); bandar = Sprite baru (permainan, "bandar png", 800, 600); bandar. setSpeed ​​(0); bandar. setPosition (400, 300); permainan. mulakan ();} / update akhir fungsi panas () {permainan. jelas (); bandar. kemas kini (); kereta. checkKeys (); kereta. checkGravity (); kereta. kemas kini ();} // akhir kemas kini

Cara menggunakan vektor daya dalam permainan

Graviti sebenarnya agak mudah. Ini hanya vektor daya. Bahagian-bahagian lain yang menarik contoh ini melibatkan perubahan gerakan mendatar tanpa mengubah sudut imej kereta dan menyesuaikan imej untuk menandakan pembuli. Berikut adalah langkah-langkah:

1. Bina dua imej yang berbeza.

   Gunakan editor imej anda untuk membina dua versi imej yang berlainan.

2. Bina sprit biasa.

   Seperti kebanyakan sprite kenderaan, anda memerlukan kaedah checkKeys (). Yang satu ini ditubuhkan dengan cara biasa, tetapi tingkah laku agak berbeza.

3. Tetapkan imej ke lalai.

   Imej lalai tidak mempunyai tujahan. Gunakan kaedah changeImage () untuk menjadikannya imej lalai. Apabila tujah dihidupkan, imej akan ditukar.

4. Gunakan pembolehubah untuk mengawal kelajuan mendatar.

   Anda boleh membuat pemboleh ubah hSpeed ​​untuk menguruskan kelajuan mendatar kereta.

5. Tetapkan anak panah kiri dan kanan untuk mengubah suai hSpeed.

   Kekunci anak panah kiri dan kanan mengubah suai pemboleh ubah hSpeed.

6. Gunakan changeXby untuk menetapkan kelajuan mendatar.

   Selepas memeriksa semua kekunci, ubah nilai x kereta kepada nilai semasa hSpeed.

7. Anak panah atas menambah vektor ke atas.

   Gunakan fungsi addVector () sekarang yang terkenal untuk menambah vektor daya kecil ke atas apabila pengguna menekan anak panah atas. Ingat bahawa 0 darjah adalah. Bermain-main dengan nilai ini untuk mendapatkan jumlah teras yang anda mahukan untuk permainan anda.

8. Tunjukkan tujah apabila anak panah atas ditekan.

   Jika pengguna menekan anak panah atas, anda perlu menunjukkan tujahan. Gunakan kaedah changeImage () untuk menetapkan imej sprite kepada yang mempunyai tujahan roket.

9. Bina kaedah checkgravity ().

   Kaedah ini akan dipanggil setiap bingkai untuk mengimbangi graviti.

10. Semak untuk mengetahui sama ada anda berada di lapangan.

    Dalam contoh ini, tanah ditakrifkan sebagai nilai y yang lebih besar daripada 580.

11. Jika anda tidak berada di lapangan, tambahkan vektor daya graviti.

    Oleh kerana ia akan berkumpul, vektor daya graviti perlu agak kecil. Anda perlu mengimbangi kekuatan graviti dan tujahan untuk mendapatkan tingkah laku yang anda inginkan. Sekiranya graviti terlalu kuat, tujahan tidak akan berfungsi. Sekiranya tujahan terlalu kuat, kereta hanya terbang ke ruang angkasa.