Πώς να προσθέσετε τη βαρύτητα στο παιχνίδι σας HTML5 - dummies

Οι υπολογισμοί βαρύτητας αποτελούν μέρος των βιντεοπαιχνιδιών HTML5 από την αρχή. Υπάρχουν πραγματικά δύο είδη βαρύτητας που πρέπει να λάβετε υπόψη. Σε παιχνίδια σε στυλ πλατφόρμας, ο παίκτης βρίσκεται κοντά σε έναν πλανήτη και κάθε βαρύτητα φαίνεται να τραβάει τα πάντα ευθεία.

Όταν ξέρετε πώς να προσθέσετε διανύσματα επιτάχυνσης, η βαρύτητα σε επίπεδο πλατφόρμας είναι πραγματικά εύκολη στην εργασία. Σκεφτείτε τη βαρύτητα ως μια συνεχή δύναμη που πάντα τραβάει κάτω μια μικρή ποσότητα σε κάθε πλαίσιο.

Πώς να προσθέσετε ρουκέτες στη διαδρομή του παιχνιδιού σας

Αυτό το παράδειγμα έχει ένα άλλο ενδιαφέρον χαρακτηριστικό. Όταν πιέζετε το πάνω βέλος, η εικόνα του αυτοκινήτου αλλάζει σε άλλη εικόνα με φλόγες.

Ο κώδικας για το παράδειγμα hoverCar εμφανίζεται εδώ στο σύνολό του:

hoverCar. html var car; πόλη var; παιχνίδι var? Λειτουργία αυτοκινήτου () {tCar = νέο Sprite (παιχνίδι, "hoverCar. png", 70, 50); tCar. setSpeed ​​(0); tCar. hSpeed ​​= 0 tCar. checkKeys = λειτουργία () {tCar. changeImage ("hoverCar.png"); αν (κλειδιάΚατά το [K_LEFT]) { αυτό. hSpeed ​​- = 1 } αν (keysDown [K_RIGHT]) { αυτό. hSpeed ​​+ = 1 } αν (keysDown [K_UP]) { αυτό. addVector (0,.5); αυτό. changeImage ("hoverCarThrust. png") ?} αυτό. changeXby (αυτό το hSpeed); } // τελικά checkKeys tCar. checkGravity = λειτουργία () { αν (αυτό.> 580) { αυτό. setPosition (αυτό το x, 580); } αλλιώς { αυτό. addVector (180,.1). } // τέλος αν } // τελικός έλεγχοςGravity επιστροφή tCar;} // end function def init () {game = new Scene (); αυτοκίνητο = νέο αυτοκίνητο (); πόλη = νέο Sprite (παιχνίδι, "πόλη. png", 800, 600); πόλη. setSpeed ​​(0); πόλη. setPosition (400, 300). παιχνίδι. start ();} // end init λειτουργία ενημέρωσης () {παιχνίδι. Σαφή(); πόλη. εκσυγχρονίζω(); αυτοκίνητο. checkKeys (); αυτοκίνητο. checkGravity (); αυτοκίνητο. update (); // // end update

Πώς να χρησιμοποιήσετε τον φορέα δύναμης στο παιχνίδι σας

Η βαρύτητα είναι στην πραγματικότητα αρκετά απλή. Είναι απλώς ένα διάνυσμα δύναμης. Τα άλλα ενδιαφέροντα μέρη αυτού του παραδείγματος περιλαμβάνουν την αλλαγή της οριζόντιας κίνησης χωρίς αλλαγή της γωνίας εικόνας του αυτοκινήτου και προσαρμογή της εικόνας για την ένδειξη του προωθητήρα. Ακολουθούν τα βήματα:

1. Κατασκευάστε δύο διαφορετικές εικόνες.

   Χρησιμοποιήστε τον επεξεργαστή εικόνων για να δημιουργήσετε δύο διαφορετικές εκδόσεις της εικόνας.

2. Κατασκευάστε ένα συνηθισμένο sprite.

   Όπως και οι περισσότεροι sprites οχημάτων, χρειάζεστε μια μέθοδο checkKeys (). Αυτός είναι ρυθμισμένος με τον συνηθισμένο τρόπο, αλλά η συμπεριφορά είναι λίγο διαφορετική.

3. Ορίστε την προεπιλεγμένη εικόνα.

   Η προεπιλεγμένη εικόνα δεν διαθέτει προωθητήρες. Χρησιμοποιήστε τη μέθοδο changeImage () to make this default image. Όταν οι προωστικές μηχανές είναι ενεργοποιημένες, η εικόνα θα αλλάξει.

4. Χρησιμοποιήστε μια μεταβλητή για να ελέγξετε την οριζόντια ταχύτητα.

   Μπορείτε να δημιουργήσετε τη μεταβλητή hSpeed ​​για να διαχειριστείτε την οριζόντια ταχύτητα του αυτοκινήτου.

5. Ρυθμίστε τα αριστερά και δεξιά βέλη για να τροποποιήσετε το hSpeed.

   Τα αριστερά και δεξιά βέλη τροποποιούν τη μεταβλητή hSpeed.

6. Χρησιμοποιήστε το changeXby για να ρυθμίσετε την οριζόντια ταχύτητα.

   Αφού ελέγξετε όλα τα πλήκτρα, αλλάξτε την τιμή x του αυτοκινήτου στην τρέχουσα τιμή του hSpeed.

7. Το επάνω βέλος προσθέτει ένα διάνυσμα προς τα πάνω.

   Χρησιμοποιήστε τη λειτουργία του now-infamous addVector () για να προσθέσετε ένα μικρό διάνυσμα δύναμης προς τα πάνω όταν ο χρήστης πιέσει το επάνω βέλος. Θυμηθείτε ότι 0 βαθμοί είναι πάνω. Παίξτε γύρω με αυτήν την τιμή για να πάρετε το ποσό ώθησης που θέλετε για το παιχνίδι σας.

8. Εμφανίστε τους προωθητήρες όταν πιέζετε το επάνω βέλος.

   Εάν ο χρήστης πιέζει το βέλος επάνω, θα πρέπει να εμφανίσετε τους προωθητήρες. Χρησιμοποιήστε τη μέθοδο changeImage () για να ρυθμίσετε την εικόνα του sprite σε μια με πυραυλικά πυραύλους.

9. Δημιουργήστε μια μέθοδο checkGravity ().

   Αυτή η μέθοδος θα ονομάζεται κάθε πλαίσιο για να αντισταθμιστεί η βαρύτητα.

10. Ελέγξτε αν βρίσκεστε στο έδαφος.

    Σε αυτό το παράδειγμα, το έδαφος ορίζεται ως τιμή y μεγαλύτερο από 580.

11. Αν δεν είστε στο έδαφος, προσθέστε ένα διάνυσμα δύναμης βαρύτητας.

    Επειδή θα συσσωρευτεί, ο φορέας δύναμης βαρύτητας πρέπει να είναι αρκετά μικρός. Θα χρειαστεί να εξισορροπήσετε τη δύναμη της βαρύτητας και τους προωθητήρες για να πάρετε τη συμπεριφορά που θέλετε. Εάν η βαρύτητα είναι πολύ δυνατή, οι προωθητές δεν θα λειτουργήσουν. Εάν οι προωθητήρες είναι πολύ ισχυροί, το αυτοκίνητο απλώς πετάει στο διάστημα.