Ελεγκτές Arduino: 10 βήματα (με εικόνες)

2024 Συγγραφέας: John Day | [email protected]. Τελευταία τροποποίηση: 2024-01-30 08:38

Ένα σύστημα ελεγκτή παιχνιδιών Arduino που χρησιμοποιεί το Arduino και τη βιβλιοθήκη p5.js. Η ιδέα αυτού είναι η δημιουργία ενός έργου Arduino που αναπαράγεται εύκολα και επεκτείνεται. Οι συνδέσεις του ελεγκτή έχουν σχεδιαστεί για να χρησιμοποιούν μια δέσμη διαφόρων αισθητήρων και εισόδων που μπορούν να εναλλάσσονται ανάλογα με τον κάθε ελεγκτή.

Αυτό το έργο έχει επίσης σχεδιαστεί για να χρησιμοποιεί τη βιβλιοθήκη JavaScript p5.js μαζί με τη βιβλιοθήκη p5.play που έχει σχεδιαστεί για το p5.js. Αυτές οι βιβλιοθήκες μας επιτρέπουν να προγραμματίζουμε τα παιχνίδια μας με ευκολία. Ο ιστότοπος p5.play διαθέτει ένα σωρό σεμινάρια και παραδείγματα για τους χρήστες να δημιουργούν παιχνίδια για αυτόν. Αυτό το έργο επιτρέπει στους χρήστες να εξασκήσουν τις δεξιότητες ανάπτυξης υλικού και λογισμικού.

Βήμα 1: Τι θα χρειαστείτε

Εργαλεία:

• Συγκολλητικό σίδερο
• Κόλλα μετάλλων
• Συρματόσχοινα
• Πλευρικά κοπτικά
• Πένσα

Σκεύη, εξαρτήματα:

• Συμβατός πίνακας Arduino (χρησιμοποίησα Sparkfun Redboard καθώς και Arduino Uno και Leonardo)

• Perf Board:

  • Πράσινες σανίδες 8cm x 6cm
  • Aduino Uno shield perf board

• Διάφοροι αισθητήρες

  • Joysticks
  • Κουμπιά (με αντιστάσεις, 10k ohms, για να πάτε μαζί τους)
  • Ποτενσιόμετρα
  • Flex αισθητήρες
  • Αισθητήρες πίεσης
  • Και τα λοιπά…

• Σύρμα:

  • Single Wire (χρησιμοποίησα 26 AWG Solid)
  • Σύρμα από κορδέλα και πτυχώσεις
• Κεφαλίδες Break Away (Τουλάχιστον 20 από αυτές)

• Προαιρετικό υλικό (μπορείτε αντ 'αυτού να χρησιμοποιήσετε χαρτόνι και γραβάτες με φερμουάρ):

  • Καλώδια Breadboard και jumper για πρωτότυπο
  • Τρισδιάστατα τυπωμένα περιβλήματα
  • Συνδετήρες υλικού (χρησιμοποίησα βίδες M2.5)

Λογισμικό:

• Arduino IDE

• p5.js βιβλιοθήκη

  P5.παίξτε επίσης βιβλιοθήκη

• σελ 5. σειριακός έλεγχος
• Node.js

Βήμα 2: Δημιουργία: του διανομέα της κονσόλας, ρύθμιση της ασπίδας

Συγκολλήστε τις κεφαλίδες στον πίνακα τέχνης Arduino Uno shield.

• Ξεκίνησα με τις επικεφαλίδες ασπίδων (ισχύ, αναλογική και ψηφιακή)
• Ακολουθούν οι καρφίτσες κεφαλίδας 2x5. Μπορείτε να χρησιμοποιήσετε κεφαλίδες 2x5 ή μόνο 2 σειρές από 5 κεφαλίδες που απομακρύνονται. Τα ευθυγράμμισα με Α3 και Α4 κάθετα και άφησα 2 κενά μεταξύ τους.

Βήμα 3: Χτίσιμο: Ο διανομέας της κονσόλας, η καλωδίωση της ασπίδας

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

Θέλετε να δώσετε προσοχή στο σχηματικό (το σχήμα Eagle είναι διαθέσιμο για λήψη) κατά τη δρομολόγηση αυτών των καλωδίων. Μπορείτε επίσης να δείτε τον οδηγό χρωμάτων για να σας βοηθήσει σε αυτό.

Η ιδέα αυτού του σχεδιασμού ασπίδας είναι να επιτρέπει 3 αναλογικές εισόδους και 5 ψηφιακές εισόδους από κάθε χειριστήριο. Αυτό εκμεταλλεύεται πλήρως όλες τις αναλογικές εισόδους σε ένα Arduino Uno καθώς και τα υπόλοιπα καλώδια στο καλώδιο κορδέλας μας.

Βήμα 4: Δημιουργία: οι ελεγκτές, ρύθμιση των εξαρτημάτων σας

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

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

Το επόμενο βήμα είναι να κολλήσετε το καλώδιο της κορδέλας σας στον πίνακα perf.

1. Απογυμνώστε και κολλήστε το καλώδιο της κορδέλας
2. Συγκολλήστε το καλώδιο κορδέλας στο επάνω κέντρο του πίνακα perf.

Το επόμενο βήμα είναι να δρομολογήσετε τα καλώδια σας. Ξεκίνησα καλωδίωση του ρεύματος (5V/κόκκινο σύρμα) και της γείωσης (καφέ σύρμα) στους αισθητήρες πρώτα. Στη συνέχεια, συνδέω τις αναλογικές εισόδους. Το βρήκα εύκολο να χρησιμοποιήσω το πορτοκαλί καλώδιο (Analog A0 ή A3) για οριζόντια κίνηση και το κίτρινο καλώδιο (Analog A1 ή A4) για κάθετη κίνηση.

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

Ανέβασα ένα γρήγορο σχήμα του χειριστηρίου χειριστηρίου μου αν θέλετε να το ρίξετε μια ματιά σε αυτό. Από το διάγραμμα pin-out, μπορείτε να δείτε τη δυνατότητα κάθε σύνδεσης ελεγκτή (3 αναλογικές εισόδους και 5 ψηφιακές).

Βήμα 5: Προαιρετικό: Περιβλήματα

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

Μπορείτε να βρείτε τα τρισδιάστατα μοντέλα μου προσαρτημένα σε αυτό το βήμα. Έχω δημιουργήσει περιβλήματα για τον κόμβο τόσο για το Arduino Uno/Leonardo όσο και για το Sparkfun RedBoard (αυτός ο πίνακας είναι λίγο ευρύτερος και χρησιμοποιεί μίνι USB).

Για τα χειριστήρια, μπορείτε να τα συνδέσετε με βίδες M2.5. Κράτησα το παξιμάδι στο πλάι του PCB και χρησιμοποιώ ένα πλυντήριο και τη βίδα στο κάτω μέρος.

Έχω συμπεριλάβει επίσης το τρισδιάστατο μοντέλο για τα ρυθμιστικά κουμπιού για τα ποτενσιόμετρα που χρησιμοποίησα.

Μπορείτε να βρείτε όλα τα αρχεία 3D στο GitHub.

Βήμα 6: Προγραμματισμός: Arduino

Ας ξεκινήσουμε με τη δημιουργία ενός απλού σκίτσου για δοκιμή. Προτείνω να χρησιμοποιήσετε το σεμινάριο που δημιουργήθηκε από το ITP στο NYU που βρίσκεται εδώ. Για να κάνετε αυτό το σεμινάριο, θα πρέπει να έχετε εγκαταστήσει το p5.serialcontroll και το node.js. Σε αυτό το σεμινάριο, θα εισαχθείτε στη ρύθμιση ενός Arduino για την αποστολή σειριακών δεδομένων που μπορούν να χρησιμοποιηθούν από τη βιβλιοθήκη javascript, p5.js. Μπορείτε να χρησιμοποιήσετε το διανομέα και τον ελεγκτή που δημιουργήσαμε στα προηγούμενα βήματα για να το κάνετε αυτό, ή μπορείτε να αντιγράψετε τα κυκλώματα που παρουσιάζονται στο σεμινάριο. Αυτό το σεμινάριο χρησιμοποιεί τον αναλογικό πείρο εισόδου A0 στο Arduino Uno, ο οποίος αντιστοιχεί στο πορτοκαλί καλώδιο του πρώτου ελεγκτή σας.

Το επόμενο σεμινάριο που θα θέλετε να ακολουθήσετε μπορείτε να το βρείτε εδώ. Αυτό το σεμινάριο θα σας καθοδηγήσει στη ρύθμιση πολλαπλών εισόδων και τη χρήση τους στο p5.js. Στο σεμινάριο, χρησιμοποιούνται οι αναλογικές είσοδοι A0 και A1. Αυτά θα αντιστοιχούν στα πορτοκαλί και κίτρινα καλώδια στον ελεγκτή 1 του συστήματός μας.

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

// ελεγκτής 1const int dig2 = 2; // μπλε const int dig3 = 3; // μωβ const int dig4 = 4; // γκρι const int dig5 = 5; // λευκό const int dig6 = 6; // μαύρο // χειριστήριο 2 const int dig7 = 7; // μπλε const int dig8 = 8; // μωβ const int dig9 = 9; // γκρι const int dig10 = 10; // white const int dig11 = 11; //μαύρος

void setup () {

Serial.begin (9600); while (Serial.available () <= 0) {Serial.println ("γεια"); // αποστολή καθυστέρησης έναρξης μηνύματος (300). // περιμένετε 1/3 δευτερόλεπτο} pinMode (dig2, INPUT); pinMode (dig3, INPUT); pinMode (dig4, INPUT); pinMode (dig5, INPUT); pinMode (dig6, INPUT); pinMode (dig7, INPUT); pinMode (dig8, INPUT); pinMode (dig9, INPUT); pinMode (dig10, INPUT); pinMode (dig11, INPUT); }

void loop () {

if (Serial.available ()> 0) {// διαβάστε το εισερχόμενο byte: int inByte = Serial.read (); // διαβάστε τον αισθητήρα:

// ANALOG Controller 1

int analog0 = analogRead (A0); int analog1 = analogRead (A1); int analog2 = analogRead (A2); // ANALOG Controller 2 int analog3 = analogRead (A3); int analog4 = analogRead (A4); int analog5 = analogRead (A5); // DIGITAL Controller 1 int digital2 = digitalRead (dig2); int digital3 = digitalRead (dig3); int digital4 = digitalRead (dig4);

int digital5 = digitalRead (dig5);

int digital6 = digitalRead (dig6); // DIGITAL Controller 2 int digital7 = digitalRead (dig7); int digital8 = digitalRead (dig8); int digital9 = digitalRead (dig9); int digital10 = digitalRead (dig10); int digital11 = digitalRead (dig11); // εκτύπωση των αποτελεσμάτων: Serial.print (analog0); // [0] Serial.print (","); Serial.print (analog1); // [1] Serial.print (","); Serial.print (analog2); // [2] Serial.print (","); // Start Controller 2 data Serial.print (analog3); // [3] Serial.print (","); Serial.print (analog4); // [4] Serial.print (","); Serial.print (analog5); // [5] Serial.print (","); Serial.print (digital2); // [6] Serial.print (","); Serial.print (digital3); // [7] Serial.print (","); Serial.print (digital4); // [8] Serial.print (","); Serial.print (digital5); // [9] Serial.print (","); Serial.print (digital6); // [10] Serial.print (","); // Εκκίνηση ελεγκτή 2 δεδομένων Serial.print (digital7); // [11] Serial.print (","); Serial.print (digital8); // [12] Serial.print (","); Serial.print (digital9); // [13] Serial.print (","); Serial.println (digital10); // [14] Serial.print (","); Serial.println (digital11); // [15]}}

Αυτός ο κωδικός στέλνει τα σειριακά δεδομένα και από τους δύο ελεγκτές μας ως πίνακα 16 αριθμών. Οι πρώτοι 6 από αυτούς τους αριθμούς είναι οι αναλογικές μας εισόδους (που κυμαίνονται από 0-1023) και οι υπόλοιπες 10 τιμές είναι οι ψηφιακές μας τιμές (0 ή 1).

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

Βήμα 7: Προγραμματισμός: HTML

Μόλις εγκαταστήσουμε και λειτουργήσουμε το Arduino, μπορούμε να ξεκινήσουμε τον προγραμματισμό των ιστοσελίδων μας. Ο κώδικας HTML είναι πολύ απλός.

σώμα {padding: 0; περιθώριο: 0;}

Ο κώδικας html απλώς συνδέει τα αρχεία javascript μαζί. Το μεγαλύτερο μέρος του κώδικα μας θα συμβεί στο σκίτσο.js αρχείο μας.

Βήμα 8: Προγραμματισμός: P5.js και Javascript

Μόλις εγκαταστήσουμε το HTML μας, μπορούμε να δουλέψουμε στο JavaScript. Εάν δεν το έχετε κάνει ήδη, θα πρέπει τώρα να κατεβάσετε το p5.js καθώς και το p5.play και να τα προσθέσετε στο φάκελο βιβλιοθηκών στον κατάλογο για τον ιστότοπό σας.

• p5.js
• σελ5.παίξτε

Στο προηγούμενο βήμα, ρυθμίσαμε το αρχείο HTML για να καλέσουμε τις βιβλιοθήκες p5.js και p5.play. Το ρυθμίσαμε επίσης για να χρησιμοποιεί το αρχείο sketch.js, όπου θα κάνουμε το μεγαλύτερο μέρος του προγραμματισμού μας. Παρακάτω είναι ο κωδικός για τον σκελετό μας. Μπορείτε επίσης να το βρείτε εδώ.

// Serial Variablesvar serial; // μεταβλητή για να διατηρήσει μια παρουσία της βιβλιοθήκης σειριακής θύρας var portName = 'COM4'; // συμπληρώστε το όνομα της σειριακής σας θύρας εδώ // Παγκόσμια μεταβλητή παιχνιδιού ---------------

// Λειτουργία εγκατάστασης ----------------------

setup λειτουργίας () {createCanvas (640, 480); σειριακό = νέο p5. SerialPort (); // δημιουργήστε μια νέα παρουσία της βιβλιοθήκης serial.on ('list', printList); // ορίστε μια λειτουργία επανάκλησης για το συμβάν λίστας σειριακών σειρών serial.on ("συνδεδεμένο", serverConnected); // επανάκληση για σύνδεση με το διακομιστή serial.on ('open', portOpen); // επανάκληση για το άνοιγμα της θύρας serial.on ('data', serialEvent); // επανάκληση όταν έρχονται νέα δεδομένα serial.on ('error', serialError)? // επανάκληση για σφάλματα serial.on ("κλείσιμο", portClose); // επανάκληση για το κλείσιμο της θύρας serial.list (); // λίστα των σειριακών θυρών serial.open (portName); // άνοιγμα σειριακής θύρας} // Συνάρτηση σχεδίασης ----------------------- λειτουργία draw () {background (0); // μαύρο φόντο} // Ερμηνεύστε τα σειριακά δεδομένα εδώ ---------- λειτουργία serialEvent () {// διαβάστε μια συμβολοσειρά από τη σειριακή θύρα // έως ότου λάβετε την επιστροφή μεταφοράς και τη νέα γραμμή: var inString = σειριακή. readStringUntil ('\ r / n'); // ελέγξτε για να δείτε ότι υπάρχει πράγματι ένα ssetring εκεί: if (inString.length> 0) {if (inString! == 'hello') {// αν το χαιρετήσετε, αγνοήστε το var sensors = split (inString, ', ')? // διαιρέστε τη συμβολοσειρά στα κόμματα εάν (sensors.length> 16) {// εάν υπάρχουν δεκαέξι στοιχεία (6 αναλογικά, 10 ψηφιακά) // Χρησιμοποιήστε δεδομένα αισθητήρα εδώ:

}

} serial.write ('x'); // στείλτε ένα byte ζητώντας περισσότερα σειριακά δεδομένα}} // λάβετε τη λίστα θυρών: function printList (portList) {// portList είναι μια σειρά ονομάτων σειριακών θυρών για (var i = 0; i <portList.length; i ++) {// Εμφάνιση της λίστας της κονσόλας: εκτύπωση (i + "" + portList ); }} function serverConnected () {print ('συνδεδεμένος στον διακομιστή.'); } function portOpen () {print ('η σειριακή θύρα άνοιξε.')} λειτουργία serialError (err) {print ('Κάτι πήγε στραβά με τη σειριακή θύρα.' + λάθος); } function portClose () {print ('Η σειριακή θύρα έκλεισε.'); } συνάρτηση closeCode () {serial.close (portName); επιστροφή null? } window.onbeforeunload = κλείσιμοCode;

Μόλις αποθηκεύσετε τον σκελετό. Μπορείτε να χρησιμοποιήσετε αυτές τις τιμές παρόμοια με το πώς έγινε στο σεμινάριο ITP. Η συμβολοσειρά τιμών που στείλαμε από το Arduino μας στο βήμα 6 αποστέλλονται ως πίνακας 16 αριθμών. Παρακάτω είναι το σημείο όπου αναλύουμε αυτόν τον πίνακα.

// Ερμηνεύστε τα σειριακά δεδομένα εδώ ----------

συνάρτηση serialEvent () {// διαβάστε μια συμβολοσειρά από τη σειριακή θύρα // μέχρι να λάβετε επιστροφή μεταφοράς και newline: var inString = serial.readStringUntil ('\ r / n'); // ελέγξτε για να δείτε ότι υπάρχει πράγματι ένα ssetring εκεί: if (inString.length> 0) {if (inString! == 'hello') {// αν το χαιρετήσετε, αγνοήστε το var sensors = split (inString, ', ')? // διαιρέστε τη συμβολοσειρά στα κόμματα εάν (sensors.length> 16) {// εάν υπάρχουν δεκαέξι στοιχεία (6 αναλογικά, 10 ψηφιακά) // Χρησιμοποιήστε δεδομένα αισθητήρα εδώ:}} serial.write ('x'); // αποστολή byte ζητώντας περισσότερα σειριακά δεδομένα}}

Τώρα μπορούμε να τρέξουμε το πρόγραμμά μας για να δούμε αν λειτουργεί!

Βήμα 9: Εκτέλεση του προγράμματος σας

Τώρα μπορούμε να τρέξουμε το πρόγραμμά μας για να δούμε αν λειτουργεί. Μπορείτε είτε να δημιουργήσετε το δικό σας παιχνίδι χρησιμοποιώντας το αρχείο skeleton.js στο προηγούμενο αρχείο μας είτε να χρησιμοποιήσετε το απλό παιχνίδι Pipe που βρίσκεται εδώ.

Παρόμοια με το εργαστήριο ITP, για να τρέξουμε το πρόγραμμά μας, θα ακολουθήσουμε τα παρακάτω βήματα.

• Συνδέστε το Arduino με το χειριστήριο (ες) που σκοπεύετε να χρησιμοποιήσετε.
• Ανοίξτε το p5.serialcontrol
• Αλλάξτε τη θύρα σκίτσου p5 σε αυτήν που χρησιμοποιείτε (εάν χρησιμοποιείτε το σκελετό, αυτό είναι στη γραμμή 3)
• Ανοίξτε το αρχείο HTML που συνδέεται με το σκίτσο p5 σας

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

Βήμα 10: Προχωρώντας περαιτέρω

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