Arduino -kontrollere: 10 trinn (med bilder)

2024 Forfatter: John Day | [email protected]. Sist endret: 2024-01-30 11:25

Et Arduino spillkontrollersystem som bruker Arduino og p5.js -biblioteket. Ideen med dette er å lage et Arduino -prosjekt som enkelt kan replikeres og utvides. Kontrollertilkoblingene er designet for å bruke en haug med forskjellige sensorer og innganger som kan byttes ut avhengig av hver kontroller.

Dette prosjektet er også designet for å bruke JavaScript -biblioteket p5.js sammen med p5.play -biblioteket designet for p5.js. Disse bibliotekene lar oss enkelt programmere spillene våre. P5.play -nettstedet har en haug med opplæringsprogrammer og eksempler for brukere å lage spill for det. Dette prosjektet lar brukerne øve seg på maskinvare- og programvareutviklingskunnskaper.

Trinn 1: Hva du trenger

Verktøy:

• Loddejern
• Lodding
• Wire strippere
• Sidekuttere
• Tang

Maskinvare:

• Arduino -kompatibelt brett (jeg brukte en Sparkfun Redboard samt en Arduino Uno og Leonardo)

• Perf Board:

  • 8 cm x 6 cm grønne perf -brett
  • Aduino Uno shield perf board

• Ulike sensorer

  • Styrespaker
  • Knapper (med motstander, 10k ohm, for å gå med dem)
  • Potensiometre
  • Flex -sensorer
  • Trykkfølere
  • Etc…

• Metalltråd:

  • Single Wire (jeg brukte 26 AWG Solid)
  • Båndtråd og krymper
• Break Away Headers (minst 20 av disse)

• Valgfri maskinvare (du kan bruke papp og lim/glidelås i stedet):

  • Brødbrett og startkabler for prototyping
  • 3D -trykte skap
  • Maskinvarefester (jeg brukte M2.5 -skruer)

Programvare:

• Arduino IDE

• p5.js bibliotek

  P5.play bibliotek også

• p5.seriekontroll
• Node.js

Trinn 2: Bygging: Konsollnavet, Sette opp skjoldet

Lodd hodene til Arduino Uno shield perf board.

• Jeg begynte med skjoldhodene (strøm, analog inn og digital)
• Neste er 2x5 toppnålene. Du kan bruke 2x5 overskrifter, eller bare 2 rader med 5 bryte bort overskrifter. Jeg stilte disse opp med A3 og A4 vertikalt, og la 2 mellomrom mellom dem.

Trinn 3: Bygning: konsollnavet, kabling av skjoldet

Deretter ønsker vi å føre ledningene våre på skjoldet. Det er lettere å føre ledningene på toppen, men hvis du vil ha et renere utseende, kan du kjøre dem på bunnen.

Du vil være oppmerksom på skjematikken (Eagle -skjemaet er tilgjengelig for nedlasting) når du dirigerer disse ledningene. Du kan også se på fargeguiden for å hjelpe deg med dette.

Ideen med denne skjolddesignen er å tillate 3 analoge innganger og 5 digitale innganger fra hver kontroller. Dette utnytter alle de analoge inngangene på en Arduino Uno fullt ut, så vel som de resterende ledningene på båndkabelen.

Trinn 4: Bygge: kontrollerne, sette opp delene dine

Det første trinnet for å bygge kontrolleren er å planlegge hvilke sensorer som skal brukes. I mine eksempler har jeg en ganske standard kontroller med en joystick og noen få knapper. Jeg har også en kontroller med to skyvepotensiometre.

Hvis du vil replikere dette, kan du se bildene mine for plassering.

Det neste trinnet er å lodde båndkabelen til perf -brettet.

1. Strip og tinn båndkabelen
2. Lodd båndkabelen til toppen av midten av perfbrettet.

Det neste trinnet er å rute ledningene dine. Jeg begynte med å koble strømmen (5V/rød ledning) og bakken (brun ledning) til sensorene først. Deretter koblet jeg de analoge inngangene. Jeg fant det enkelt å bruke den oransje kabelen (Analog A0 eller A3) for horisontal bevegelse og den gule kabelen (Analog A1 eller A4) for vertikal bevegelse.

For å holde ting konsistent, koblet jeg også en liten trykknapp til lilla på alle kontrollerne mine. Dette er nyttig for ting som å lukke serieporten (jeg går over dette senere) samt menyer eller alternativer.

Jeg har lastet opp en rask skjematisk oversikt over joystick -kontrolleren min hvis du vil se på dette. Fra pin-out-diagrammet kan du se muligheten for hver kontrollerkontakt (3 analoge innganger og 5 digitale).

Trinn 5: Valgfritt: Vedlegg

Dette trinnet er valgfritt, men hvis du har tilgang til en 3D -skriver vil resultatet av prosjektet ditt se litt mer raffinert og ferdig ut. Som du kan se på prototypene mine, brukte jeg et enkelt stykke papp for å forhindre at loddeskjøtene på bunnen av perf -brettene stikker fingrene dine.

Du finner mine 3D -modeller knyttet til dette trinnet. Jeg har laget skap for huben for både Arduino Uno/Leonardo og Sparkfun RedBoard (dette brettet er litt bredere og bruker mini USB).

For kontrollerne kan du feste disse med M2.5 -skruer. Jeg beholdt mutteren på siden av kretskortet og bruker en skive og skruen på bunnen.

Jeg har også inkludert 3D -modellen for knottglidere for potensiometrene jeg brukte.

Du finner alle 3D -filene på GitHub.

Trinn 6: Programmering: Arduino

La oss starte med å sette opp en enkel skisse for å teste. Jeg foreslår at du bruker opplæringen laget av ITP ved NYU som finnes her. For å gjøre denne opplæringen må du ha p5.serialcontroll og node.js installert. I denne opplæringen vil du bli introdusert for å sette opp en Arduino for å sende serielle data som kan brukes av vårt javascript -bibliotek, p5.js. Du kan bruke huben og kontrolleren vi opprettet i de foregående trinnene for å gjøre dette, eller du kan replikere kretsene som ble demonstrert i opplæringen. Denne opplæringen bruker den analoge inngangspinnen A0 på Arduino Uno som er kartlagt til den oransje ledningen til din første kontroller.

Den neste opplæringen du vil følge finner du her. Denne opplæringen vil guide deg gjennom konfigurering av flere innganger og bruk av dem i p5.js. I opplæringen brukes de analoge inngangene A0 og A1. Disse vil svare til de oransje og gule ledningene på kontrolleren 1 i systemet vårt.

Når du har gått gjennom veiledningene ovenfor, kan vi programmere Arduino. Koden vi ønsker å bruke er nedenfor:

// kontrolleren 1konst int dig2 = 2; // blå const int dig3 = 3; // lilla const int dig4 = 4; // grå const int dig5 = 5; // hvit const int dig6 = 6; // svart // kontroller 2 const int dig7 = 7; // blå const int dig8 = 8; // lilla const int dig9 = 9; // grå const int dig10 = 10; // hvit const int dig11 = 11; //svart

ugyldig oppsett () {

Serial.begin (9600); mens (Serial.available () <= 0) {Serial.println ("hei"); // send en startmeldingsforsinkelse (300); // vent 1/3 sekund} 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 () {

hvis (Serial.available ()> 0) {// les innkommende byte: int inByte = Serial.read (); // les sensoren:

// ANALOG -kontroller 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); // skrive ut resultatene: 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 (","); // Start kontrolleren 2 data 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]}}

Denne koden sender serielle data fra begge kontrollerne våre som en rekke med 16 tall. De første 6 av disse tallene er våre analoge innganger (fra 0-1023), og de resterende 10 verdiene er våre digitale verdier (0 eller 1).

Når koden vår er lastet opp, kan vi teste dette ved å åpne den serielle skjermen og skrive inn en verdi i vår serielle skjerm, slik vi gjorde i den andre opplæringen fra ITP. Vi bør skille en streng av verdiene våre med kommaer.

Trinn 7: Programmering: HTML

Når vi har satt opp Arduino og jobbet, kan vi begynne å programmere nettsaken vår. HTML -koden er veldig enkel.

kropp {polstring: 0; margin: 0;}

HTML -koden kobler ganske enkelt våre javascript -filer sammen. Det meste av koden vår vil faktisk skje i vår skisse.js -fil.

Trinn 8: Programmering: P5.js og Javascript

Når vi har satt opp HTML -koden vår, kan vi jobbe med JavaScript. Hvis du ikke allerede har gjort det, bør du laste ned p5.js samt p5.play og legge dem til bibliotekmappen i katalogen for nettstedet ditt.

• p5.js
• s5.spill

I vårt forrige trinn konfigurerte vi HTML -filen vår for å kalle p5.js- og p5.play -bibliotekene våre. Vi konfigurerte den også for å bruke sketch.js -filen vår, det er her vi skal gjøre det meste av programmeringen vår. Nedenfor er koden for skjelettet vårt. Du finner den også her.

// Serielle variablervar seriell; // variabel for å holde en forekomst av serialport -biblioteket var portName = 'COM4'; // fyll inn serienummeret ditt her // Globale spillvariabler ---------------

// Oppsettfunksjon ----------------------

oppsett av funksjoner () {createCanvas (640, 480); serial = new p5. SerialPort (); // lage en ny forekomst av serialport -biblioteket serial.on ('list', printList); // angi en tilbakeringingsfunksjon for serieportlisten hendelse serial.on ('tilkoblet', serverConnected); // tilbakeringing for tilkobling til serveren serial.on ('open', portOpen); // tilbakeringing for portåpningen serial.on ('data', serialEvent); // tilbakeringing for når nye data kommer serial.on ('feil', serialError); // tilbakeringing for feil serial.on ('close', portClose); // tilbakeringing for portlukking serial.list (); // liste de serielle portene serial.open (portnavn); // åpne en seriell port} // Draw Function ----------------------- function draw () {background (0); // svart bakgrunn} // Tolker serielle data her ---------- funksjon serialEvent () {// les en streng fra serieporten // til du får vognretur og newline: var inString = serial. readStringUntil ('\ r / n'); // sjekk for å se at det faktisk er en setring der: if (inString.length> 0) {if (inString! == 'hallo') {// hvis du får hei, ignorer det var sensorer = split (inString, ', '); // del strengen på kommaene hvis (sensorer.lengde> 16) {// hvis det er seksten elementer (6 analoge, 10 digitale) // Bruk sensordata her:

}

} serial.write ('x'); // send en byte som ber om flere serielle data}} // få listen over porter: function printList (portList) {// portList er en rekke serielle portnavn for (var i = 0; i <portList.length; i ++) {// Vis listen konsollen: print (i + "" + portList ); }} funksjon serverConnected () {print ('koblet til server.'); } funksjon portOpen () {print ('den serielle porten er åpnet.')} funksjon serialError (err) {print ('Noe gikk galt med den serielle porten.' + err); } funksjonsportLukk () {print ('Den serielle porten er lukket.'); } funksjonen closedCode () {serial.close (portName); returner null; } window.onbeforeunload = avslutningskode;

Når du har skjelettet reddet. Du kan bruke disse verdiene på samme måte som hvordan det ble gjort i ITP -opplæringen. Verdistrengen vi sendte fra vår Arduino i trinn 6 blir sendt inn som en rekke med 16 tall. Nedenfor ser vi hvor vi analyserer denne matrisen.

// Tolk seriedata her ----------

funksjon serialEvent () {// les en streng fra serieporten // til du får vognretur og ny linje: var inString = serial.readStringUntil ('\ r / n'); // sjekk for å se at det faktisk er en setring der: if (inString.length> 0) {if (inString! == 'hallo') {// hvis du får hei, ignorer det var sensorer = split (inString, ', '); // del strengen på kommaene hvis (sensors.length> 16) {// hvis det er seksten elementer (6 analoge, 10 digitale) // Bruk sensordata her:}} serial.write ('x'); // send en byte som ber om flere serielle data}}

Vi kan nå kjøre programmet vårt for å se om det fungerer!

Trinn 9: Kjøre programmet

Vi kan nå kjøre programmet vårt for å se om det fungerer. Du kan enten lage ditt eget spill ved å bruke skeleton.js -filen i vår forrige fil, eller du kan bruke det enkle Pipe -spillet som finnes her.

I likhet med ITP Lab, for å kjøre programmet vårt, vil vi følge trinnene nedenfor.

• Koble til Arduino med kontrolleren (e) du planlegger å bruke.
• Åpne p5.serialcontrol
• Endre p5 -skissens port til den du bruker (hvis du bruker skjelettet, er dette på linje 3)
• Åpne HTML -filen som lenker til p5 -skissen din

Hvis du har eksterne medier som bilder eller nedlastede fonter, vil du kjøre dette på en server. Du kan kjøre en enkel lokal pythonserver hvis du vil.

Trinn 10: Gå videre

For å gå videre og utvikle flere spill for dette, kan du følge forskjellige eksempler fra p5.play som finnes her. Nedenfor er et eksempel på et mer komplisert spill som jeg laget. Det er et 1 mot 1 tankskytespill. Du kan finne alle ressursene for det på GitHub.