Πώς να δημιουργήσετε αντικείμενα Sprite για το παιχνίδι HTML5 - dummies

Για να κάνετε πολύ ισχυρά παιχνίδια HTML5, θα θελήσετε να είστε σε θέση να δημιουργήσετε τα δικά σας sprites που κάνουν ακριβώς τι θέλετε να κάνουν. Αφού κάνετε ένα αντικείμενο, μπορείτε να του δώσετε χαρακτηριστικά και συμπεριφορά.

Πώς να φτιάξετε ένα αντικείμενο sprite stock για το παιχνίδι σας

Για να ξεκινήσετε, ρίξτε μια ματιά σε αυτό το απλό αντικείμενο:

critter var game? var critter; λειτουργία init () {παιχνίδι = νέα σκηνή (); critter = νέος Sprite (παιχνίδι, "critter. gif", 30, 30); critter. setSpeed ​​(0); παιχνίδι. αρχή ();} ενημέρωση λειτουργίας () {παιχνίδι. Σαφή(); critter. update ();}

Πρόκειται για ένα εξαιρετικά απλό πρόγραμμα. Δημιουργεί μια σκηνή και ένα μοναδικό σκίτη που ονομάζεται critter. Αυτή τη στιγμή, το critter δεν κάνει πολλά.

Πώς να δημιουργήσετε το δικό σας sprite παιχνιδιών

Τα αντικείμενα Sprite είναι μεγάλα, αλλά δεν θα ήταν τρομερό εάν το ίδιο το critter ήταν ένα αντικείμενο και ακόμα καλύτερα αν ήταν ένα νέο αντικείμενο βασισμένο στο ξωτικό? Θα μπορούσε να ξεκινήσει με όλα τα βασικά χαρακτηριστικά του sprite, αλλά θα μπορούσατε να προσθέσετε νέες δυνατότητες για να διαφοροποιήσετε τα critters από άλλα sprites.

Ρίξτε μια ματιά στο CritterConstructor. html για να δείτε έναν τρόπο να το κάνετε:

critter var game? var critter; συνάρτηση Critter () {tCritter = νέο Sprite (παιχνίδι, "critter.gif", 30, 30); tCritter. setSpeed ​​(0); επιστροφή tCritter;} λειτουργία init () {game = new Scene (); critter = νέο Critter (); παιχνίδι. αρχή ();} ενημέρωση λειτουργίας () {παιχνίδι. Σαφή(); critter. update ();}

Αυτό το πρόγραμμα λειτουργεί ακριβώς όπως το τελευταίο, αλλά είναι οργανωμένο λίγο διαφορετικά.

• Υπάρχει μια λειτουργία που ονομάζεται Critter () . Είναι σημαντικό ότι η συνάρτηση είναι το όνομα ενός αντικειμένου και είναι επίσης κεφαλαιοποιημένη. Αυτή είναι μια πολύ ειδική λειτουργία, επειδή χρησιμοποιείται για να ορίσει ένα αντικείμενο Critter ().

• Η συνάρτηση Critter () δημιουργεί ένα προσωρινό αντικείμενο sprite. Μέσα στη συνάρτηση Critter (), βλέπετε ένα προσωρινό αντικείμενο sprite που ονομάζεται tCritter (). Πρόκειται για ένα νέο σπρίτ.

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

• Επιστρέψτε το προσωρινό αντικείμενο Critter . Το τέλος της ειδικής συνάρτησης Critter () επιστρέφει το sprite, αλλά τώρα δεν είναι μόνο ένα sprite, αλλά ένα critter.

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

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

Δεν γίνεται ο τρόπος επίσημης κληρονομιάς JavaScript, αλλά ο μηχανισμός που εμφανίζεται εδώ είναι πιο κατανοητός από τον "σωστό" τρόπο και είναι παρόμοιος με τον τρόπο κληρονομιάς σε πολλές άλλες γλώσσες. Δεν υπάρχει τίποτα κακό με αυτήν την προσέγγιση, αλλά μερικές φορές θα δείτε άλλες προσεγγίσεις στη κληρονομιά στο JavaScript.