Σπίτι Προσωπικά Οικονομικά Πώς να προσθέσετε στοιχεία ελέγχου κλίσης στο παιχνίδι σας HTML5

Πώς να προσθέσετε στοιχεία ελέγχου κλίσης στο παιχνίδι σας HTML5

Βίντεο: Exploring JavaScript and the Web Audio API by Sam Green and Hugh Zabriskie 2024

Βίντεο: Exploring JavaScript and the Web Audio API by Sam Green and Hugh Zabriskie 2024
Anonim

Οι κινητές συσκευές έχουν έναν πολύ ενδιαφέροντα μηχανισμό εισαγωγής που σας επιτρέπει να ελέγχετε αντικείμενα σε ένα παιχνίδι HTML5 με κλίση. Αυτό λειτουργεί με ένα ειδικό εργαλείο που ονομάζεται επιταχυνσιόμετρο , το οποίο παρακολουθεί την κίνηση. Το επιταχυνσιόμετρο μετρά πραγματικά την περιστροφή και μπορείτε να το χρησιμοποιήσετε για να έχετε ωραίο έλεγχο κλίσης στο παιχνίδι σας.

Η βιβλιοθήκη simpleGame έχει ένα ειδικό αντικείμενο που ονομάζεται Accel που ενσωματώνει το επιταχυνσιόμετρο. Λειτουργεί πολύ σαν το αντικείμενο Joy.

  1. Δημιουργήστε ένα αντικείμενο Accel.

    Το SimpleGame έχει ένα αντικείμενο Accel. Δημιουργήστε αυτό το αντικείμενο για να ενεργοποιήσετε τη δοκιμή επιταχυνσιόμετρο.

  2. Χρησιμοποιήστε μεθόδους για τον προσδιορισμό της κλίσης.

    Το αντικείμενο Accel έχει ειδικές μεθόδους που ονομάζονται getAX () και getAY () που υποδεικνύουν την ποσότητα περιστροφής.

  3. Τροποποιήστε τις τιμές επιτάχυνσης.

    Οι τιμές AX και AY εμφανίζουν την ποσότητα περιστροφής γύρω από τους άξονες X και Y, αντίστοιχα. Οι τιμές κυμαίνονται από -9 έως 9. Γενικά, θα χρειαστεί να τροποποιήσετε τις τιμές κλίσης για να αποκτήσετε ακριβώς τη συμπεριφορά που θέλετε. Αυτό συνήθως περιλαμβάνει μερικούς απλούς υπολογισμούς μαθηματικών.

Εδώ είναι ο κωδικός για την επιτάχυνση. html:

επιτάχυνση. html var παιχνίδι? var μπάλα? var accel λειτουργία init () {παιχνίδι = νέα σκηνή (); μπάλα = νέο Sprite (παιχνίδι, "redBall. png", 50, 50); accel = νέο Accel (); παιχνίδι. start ();} // end init λειτουργία ενημέρωσης () {παιχνίδι. Σαφή(); newDX = επιτάχυνση. getAY (); newDY = επιτάχυνση. getAX (); newDX * = -5. newDY * = -5. μπάλα. setDX (newDX); μπάλα. setDY (newDY); μπάλα. update ();}

Το επιταχυνσιόμετρο είναι εύκολο στη χρήση:

  1. Κάντε μια μεταβλητή για να κρατήσετε το αντικείμενο επιταχυνσιόμετρο.

    Μπορείτε να καλέσετε το μεταβλητό σας χτύπημα.

  2. Χρησιμοποιήστε την επιτάχυνση. getAX () για να πάρει περιστροφή γύρω από το X.

    Η μέθοδος getAX () επιστρέφει το ποσοστό κλίσης γύρω από τον άξονα Χ. Ο άξονας Χ πηγαίνει από την μία πλευρά στην άλλη στην οθόνη, οπότε η περιστροφή γύρω από το Χ είναι κανονικά δεμένη με κίνηση κατά μήκος του άξονα Y!

  3. Χρησιμοποιήστε το acccel. getAY () για τον καθορισμό της περιστροφής γύρω από το Y.

    Ομοίως, η μέθοδος getAY () περιγράφει το ποσοστό κλίσης κατά μήκος του (κάθετου) άξονα Υ. Κανονικά, θα χρησιμοποιήσετε το getAY () για τον έλεγχο της οριζόντιας κίνησης.

  4. Μην ανησυχείτε για τον άξονα Z.

    Μπορείτε επίσης να διαβάσετε την περιστροφή κατά μήκος του άξονα Z (που πηγαίνει από το κέντρο της οθόνης στη μύτη σας), αλλά αυτό δεν είναι γενικά χρήσιμο.

  5. Υποθέστε (προς το παρόν) ότι η ουδέτερη θέση βρίσκεται ακριβώς επίπεδη σε ένα τραπέζι.

    Θα λάβετε μηδενικές τιμές για getAX () και getAY () όταν η συσκευή βρίσκεται εντελώς ακόμα σε ένα απολύτως επίπεδο τραπέζι.

  6. Πειραματιστείτε με παράγοντες κλιμάκωσης.

    Γενικά θα πρέπει να πολλαπλασιάσετε τα αποτελέσματα getAX () και getAY () κατά κάποιο ποσό για να πάρετε τη συμπεριφορά που θέλετε. Εάν πολλαπλασιάζετε και τα δύο αρνητικά πέντε, θα έχετε τις κατάλληλες τιμές για dy και dx. Θα χρειαστεί να πειραματιστείτε για να πάρετε ακριβώς τη συμπεριφορά που θέλετε.

Πώς να προσθέσετε στοιχεία ελέγχου κλίσης στο παιχνίδι σας HTML5

Η επιλογή των συντακτών

Πώς να δημιουργήσετε Flash CS5 σύμβολα κουμπιών - dummies

Πώς να δημιουργήσετε Flash CS5 σύμβολα κουμπιών - dummies

Για να βελτιώσετε τις ταινίες Adobe Flash Creative Suite 5 μπορούν να χρησιμοποιήσουν τα κουμπιά Flash CS5 για να δώσουν στους χρήστες τον έλεγχο της δράσης με έλεγχο χρόνου και πλοήγηση. Στο Flash, τα κουμπιά είναι ειδικοί τύποι συμβόλων που έχουν σχεδιαστεί για να ανταποκρίνονται σε αλληλεπίδραση με το ποντίκι ή το πληκτρολόγιο, όπως κλικ, ανατροπές και συγκεκριμένα πλήκτρα. Όταν συνδυάζεται με το ActionScript, ...

Πώς να δημιουργείτε κλίσεις στο Adobe Flash CS6 - ανδρείκελα

Πώς να δημιουργείτε κλίσεις στο Adobe Flash CS6 - ανδρείκελα

Adobe Flash CS6 έχει έναν τρόπο για να δημιουργήσετε κλίσεις για να γεμίσετε ένα χώρο που δεν θέλετε να είναι ένα συμπαγές χρώμα. Οι κλίσεις είναι μείγματα μεταξύ δύο ή περισσότερων χρωμάτων που μπορείτε να χρησιμοποιήσετε για να γεμίσετε οποιαδήποτε περιοχή ή σχήμα, ακριβώς όπως ένα συμπαγές χρώμα. Αν κοιτάξετε τον πίνακα Swatches, μπορείτε ...

Η επιλογή των συντακτών

Πώς να γράφετε σημειώσεις στο OneNote 2013 στα Android - ανδρείκελα

Πώς να γράφετε σημειώσεις στο OneNote 2013 στα Android - ανδρείκελα

Το OneNote, όπως οι εκδόσεις iOS και web app, η έκδοση Android του OneNote σάς επιτρέπει να αποκτάτε πρόσβαση και να επεξεργάζεστε σημειώσεις με ένα ελάχιστο σύνολο χαρακτηριστικών σε σύγκριση με τις εκδόσεις desktop του OneNote, όπως το OneNote 2013. Πώς να δημιουργήσετε μια νέα σημείωση στο Android Μπορείτε να δημιουργήσετε ...

2 τρόποι αποστολής και λήψης αλληλογραφίας στο Outlook - ανδρείκελα

2 τρόποι αποστολής και λήψης αλληλογραφίας στο Outlook - ανδρείκελα

Μετά τη διαμόρφωση του λογαριασμού ηλεκτρονικού ταχυδρομείου (S) στο Outlook 2013, η λήψη μηνυμάτων είναι μια αυτόματη διαδικασία. Το Outlook αποστέλλει αυτόματα και λαμβάνει μηνύματα όταν ξεκινάτε και επίσης σε διαστήματα 30 λεπτών (από προεπιλογή) όποτε εκτελείται το Outlook. Η εισερχόμενη αλληλογραφία σας μπαίνει αυτόματα στο φάκελο Εισερχόμενα. Μπορείτε επίσης να ξεκινήσετε μια χειροκίνητη διαδικασία αποστολής / λήψης σε ...

Πώς να γράφετε σημειώσεις στο OneNote 2013 για συσκευές iOS - dummies

Πώς να γράφετε σημειώσεις στο OneNote 2013 για συσκευές iOS - dummies

Για συσκευές IOS. Υπάρχουν πολλές λειτουργίες, παρόλο που η έκδοση του App της OneNote και η πλήρης εφαρμογή OneNote 2013 έχουν περισσότερη λειτουργικότητα. Πώς να δημιουργήσετε μια νέα σημείωση σε συσκευές iOS Μπορείτε να δημιουργήσετε μια νέα σημείωση, ανεξάρτητα από το πού βρίσκεστε στο OneNote, αν βλέπετε ...

Η επιλογή των συντακτών

Πώς να ρυθμίσετε την τοποθέτηση και το μέγεθος στην άκρη Animate - dummies

Πώς να ρυθμίσετε την τοποθέτηση και το μέγεθος στην άκρη Animate - dummies

Adobe Edge Animate CC δεν έχει έλλειψη ρυθμίσεις όσον αφορά την τοποθέτηση και το μέγεθος. Πολλά από αυτά τα χαρακτηριστικά λειτουργούν καλύτερα όταν φωλιάζουν στοιχεία, έτσι θέλετε να κατανοήσετε πώς λειτουργεί ο πίνακας στοιχείων. Η τοποθέτηση αναφέρεται στις συντεταγμένες του στοιχείου που σχετίζεται είτε με το Στάδιο είτε με το γονικό στοιχείο όταν ένα ...

Παγκόσμια ή Εφαρμοσμένες ρυθμίσεις στο Adobe Edge Animate - dummies

Παγκόσμια ή Εφαρμοσμένες ρυθμίσεις στο Adobe Edge Animate - dummies

Adobe Edge Animate CC δεν έχει έλλειψη ρυθμίσεων όταν πρόκειται για την τοποθέτηση και το μέγεθος. Οι ρυθμίσεις "Παγκόσμια" και "Εφαρμοσμένες" δεν τροποποιούν τις ρυθμίσεις, αλλά παρέχουν ένα μέσο για την εμφάνιση της σχετικής τοποθέτησης μεταξύ των ενσωματωμένων στοιχείων. Μπορεί να αναρωτιέστε ότι η διαφορά είναι μεταξύ των ρυθμίσεων Global και Applied. Εδώ είναι η ουσία: Παγκόσμιες ρυθμίσεις ...

Πώς να προσθέσετε ενέργειες σε στοιχεία στο Edge Animate - dummies

Πώς να προσθέσετε ενέργειες σε στοιχεία στο Edge Animate - dummies

Ένα ιδιαίτερα ισχυρό χαρακτηριστικό του Adobe Edge Animate Το CC είναι η δυνατότητα να προσθέσετε στη σύνθεση σας δράσεις, ενεργοποιητές, ετικέτες και χαρακτηριστικά δρομέα. Αυτά τα εργαλεία είναι αυτό που χρησιμοποιείτε για να κάνετε το κινούμενο γραφικό σας διαδραστικό, ώστε το κοινό σας να μπορεί να συμμετέχει σε αυτό που κάνει το κινούμενο σχέδιο σας αντί να πρέπει να καθίσετε εκεί και να παρακολουθήσετε παθητικά. Ένας ...