Arduino kontroleri: 10 koraka (sa slikama)

2024 Autor: John Day | [email protected]. Zadnja izmjena: 2024-01-30 08:08

Arduino sistem kontrolera igara koji koristi Arduino i biblioteku p5.js. Ideja ovoga je stvaranje Arduino projekta koji se lako replicira i proširuje. Konektori kontrolera dizajnirani su tako da koriste hrpu različitih senzora i ulaza koji se mogu zamijeniti ovisno o svakom kontroleru.

Ovaj projekat je takođe dizajniran da koristi JavaScript biblioteku p5.js zajedno sa bibliotekom p5.play dizajniranom za p5.js. Ove nam biblioteke omogućuju lako programiranje igara. Web stranica p5.play ima hrpu vodiča i primjera za korisnike koji za nju stvaraju igre. Ovaj projekat omogućava korisnicima da vježbaju svoje vještine razvoja hardvera i softvera.

Korak 1: Šta će vam trebati

Alati:

• Lemilica
• Solder
• Strojevi za skidanje žice
• Bočni rezači
• Kliješta

Hardver:

• Arduino kompatibilna ploča (koristio sam Sparkfun Redboard kao i Arduino Uno i Leonardo)

• Perf Board:

  • 8cm x 6cm zelene perf ploče
  • Aduino Uno štit perf ploča

• Razni senzori

  • Joysticks
  • Dugmad (sa otpornicima, 10 k ohma, sa njima)
  • Potenciometri
  • Savitljivi senzori
  • Senzori pritiska
  • Itd…

• Žica:

  • Pojedinačna žica (koristio sam 26 AWG solid)
  • Vrpca i žice
• Odlomljena zaglavlja (najmanje 20 od ovih)

• Opcijski hardver (umjesto njega možete koristiti karton i hotglue/zip veze):

  • Olovka i kratkospojni kablovi za izradu prototipova
  • 3D štampana kućišta
  • Hardverski pričvršćivači (koristio sam vijke M2.5)

Softver:

• Arduino IDE

• biblioteka p5.js

  P5.play biblioteka

• p5.serialcontrol
• Node.js

Korak 2: Izgradnja: Hub konzole, postavljanje štita

Lemite zaglavlja na perf ploču Arduino Uno štita.

• Počeo sam sa zaglavljima štita (napajanje, analogni ulaz i digitalni)
• Slijede pinovi zaglavlja 2x5. Možete koristiti 2x5 zaglavlja ili samo 2 reda od 5 zaglavlja. Poravnao sam ih s A3 i A4 okomito i ostavio 2 razmaka između njih.

Korak 3: Izgradnja: Konzolno čvorište, ožičenje štita

Zatim želimo usmjeriti naše žice na štit. Lakše je provoditi žice na vrhu, ali ako želite čistiji izgled, možete ih provesti na dnu.

Prilikom usmjeravanja ovih žica želite obratiti pažnju na shemu (shema Eagle je dostupna za preuzimanje). Također možete pogledati vodič za boje koji će vam pomoći u tome.

Ideja ovog dizajna štita je omogućiti 3 analogna ulaza i 5 digitalnih ulaza sa svakog kontrolera. Ovo u potpunosti koristi sve analogne ulaze na Arduino Uno -u, kao i preostale žice na našem vrpčanom kabelu.

Korak 4: Izgradnja: kontrolera, postavljanje vaših dijelova

Prvi korak u izgradnji vašeg kontrolera je planiranje senzora koje ćete koristiti. U mojim primjerima imam prilično standardni kontroler s joystickom i nekoliko tipki. Takođe imam kontroler sa dva klizna potenciometra.

Ako želite ovo ponoviti, možete pogledati moje slike za postavljanje.

Sljedeći korak je lemljenje vašeg ribbon kabela na perf ploču.

1. Ogolite i kosite vrpčani kabel
2. Lemite vrpčani kabel na gornji centar vaše perf ploče.

Sljedeći korak je usmjeravanje žica. Počeo sam tako što sam prvo spojio napajanje (5V/crvena žica) i masu (smeđa žica) na senzore. Zatim sam spojio analogne ulaze. Bilo mi je lako koristiti narančasti kabel (Analog A0 ili A3) za horizontalno kretanje i žuti kabel (Analog A1 ili A4) za okomito kretanje.

Da bi stvari bile dosljedne, također sam ožičio mali prekidač na ljubičasto na svim svojim kontrolerima. Ovo je korisno za stvari poput zatvaranja serijskog porta (o tome ću kasnije), kao i za menije ili opcije.

Učitao sam kratku shemu kontrolera džojstika ako želite ovo pogledati. Iz našeg pin-out dijagrama možete vidjeti mogućnost povezivanja svakog kontrolera (3 analogna ulaza i 5 digitalnih).

Korak 5: Opcionalno: kućišta

Ovaj korak nije obavezan, ali ako imate pristup 3D štampaču, ishod vašeg projekta će izgledati malo profinjenije i završeno. Kao što možete vidjeti u mojim prototipima, upotrijebio sam jednostavan komad kartona kako bih spriječio da vam lemni spojevi na dnu perf ploča dodiruju prste.

Uz ovaj korak možete pronaći moje 3D modele. Napravio sam kućišta za čvorište i za Arduino Uno/Leonardo i za Sparkfun RedBoard (ova ploča je malo šira i koristi mini USB).

Za kontrolere, možete ih pričvrstiti vijcima M2.5. Držao sam maticu sa strane PCB -a i koristim podlošku i vijak na dnu.

Uključio sam i 3D model klizača za potenciometre koje sam koristio.

Sve 3D datoteke možete pronaći na GitHubu.

Korak 6: Programiranje: Arduino

Počnimo postavljanjem jednostavne skice za testiranje. Predlažem da koristite tutorial koji je ITP napravio na NYU -u i koji se nalazi ovdje. Da biste izvršili ovaj vodič, morate imati instaliran p5.serialcontroll i node.js. U ovom vodiču bit ćete upoznati s postavljanjem Arduina za slanje serijskih podataka koje može koristiti naša javascript biblioteka, p5.js. Za to možete koristiti koncentrator i kontroler koji smo stvorili u prethodnim koracima ili možete replicirati sklopove prikazane u vodiču. Ovaj vodič koristi analogni ulazni pin A0 na Arduino Uno koji je mapiran na narančastu žicu vašeg prvog kontrolera.

Sljedeći vodič koji želite slijediti možete pronaći ovdje. Ovaj vodič će vas voditi kroz postavljanje više ulaza i njihovu upotrebu u p5.js. U vodiču se koriste analogni ulazi A0 i A1. Oni će odgovarati narančastoj i žutoj žici na kontroleru 1 našeg sistema.

Nakon što prođete kroz gornje vodiče, možemo programirati Arduino. Kôd koji želimo koristiti je dolje:

// kontroler 1const int dig2 = 2; // plavi const int dig3 = 3; // ljubičasta const int dig4 = 4; // siva const int dig5 = 5; // bijeli const int dig6 = 6; // crno // kontroler 2 const int dig7 = 7; // plavi const int dig8 = 8; // ljubičasta const int dig9 = 9; // siva const int dig10 = 10; // bijeli const int dig11 = 11; // crno

void setup () {

Serial.begin (9600); while (Serial.available () <= 0) {Serial.println ("zdravo"); // šalje kašnjenje početne poruke (300); // čekamo 1/3 sekunde} 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 () {{100} {101}

if (Serial.available ()> 0) {// čitanje dolaznog bajta: int inByte = Serial.read (); // čita senzor:

// ANALOG kontroler 1

int analog0 = analogRead (A0); int analog1 = analogRead (A1); int analog2 = analogRead (A2); // ANALOG kontroler 2 int analog3 = analogRead (A3); int analog4 = analogRead (A4); int analog5 = analogRead (A5); // DIGITALNI Upravljač 1 int digital2 = digitalRead (dig2); int digital3 = digitalno čitanje (dig3); int digital4 = digitalRead (dig4);

int digital5 = digitalRead (dig5);

int digital6 = digitalRead (dig6); // DIGITALNI Upravljač 2 int digital7 = digitalRead (dig7); int digital8 = digitalRead (dig8); int digital9 = digitalRead (dig9); int digital10 = digitalRead (dig10); int digital11 = digitalRead (dig11); // ispisuje rezultate: Serial.print (analog0); // [0] Serial.print (","); Serial.print (analog1); // [1] Serial.print (","); Serial.print (analog2); // [2] Serial.print (","); // Pokreni podatke kontrolera 2 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 (","); // Pokretanje kontrolera 2 podataka 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]}}

Ovaj kôd šalje serijske podatke s oba naša kontrolera u nizu od 16 brojeva. Prvih 6 od ovih brojeva su naši analogni ulazi (u rasponu od 0-1023), a preostalih 10 vrijednosti su naše digitalne vrijednosti (0 ili 1).

Nakon što se naš kôd učita, možemo to testirati otvaranjem serijskog monitora i upisivanjem vrijednosti u naš serijski monitor kao što smo to učinili u drugom vodiču iz ITP -a. Trebali bismo dobiti niz naših vrijednosti odvojenih zarezima.

Korak 7: Programiranje: HTML

Nakon što naš Arduino postavimo i počnemo raditi, možemo početi programirati naše web stvari. HTML kod je vrlo jednostavan.

body {padding: 0; margina: 0;}

Html kôd jednostavno povezuje naše javascript datoteke. Većina našeg koda će se zapravo nalaziti u našoj sketch.js datoteci.

Korak 8: Programiranje: P5.js i Javascript

Nakon što postavimo HTML, možemo raditi na svom JavaScript -u. Ako to već niste učinili, sada biste trebali preuzeti p5.js kao i p5.play i dodati ih u mapu biblioteka u direktoriju za svoju web stranicu.

• p5.js
• p5.play

U našem prethodnom koraku, postavili smo našu HTML datoteku tako da poziva naše biblioteke p5.js i p5.play. Također smo ga postavili za korištenje naše datoteke sketch.js gdje ćemo raditi većinu našeg programiranja. Ispod je kôd za naš kostur. Možete ga pronaći i ovdje.

// Serijske varijablevar serial; // varijabla za držanje instance biblioteke serijskog porta var portName = 'COM4'; // ovdje unesite naziv serijskog porta // Globalne varijable igara ---------------

// Funkcija postavljanja ----------------------

function setup () {createCanvas (640, 480); serial = new p5. SerialPort (); // napraviti novu instancu biblioteke serialport serial.on ('list', printList); // postavlja funkciju povratnog poziva za događaj liste serijskih portova serial.on ('connected', serverConnected); // povratni poziv za povezivanje sa serverom serial.on ('open', portOpen); // povratni poziv za otvaranje porta serial.on ('data', serialEvent); // povratni poziv za dolazak novih podataka serial.on ('error', serialError); // povratni poziv za greške serial.on ('close', portClose); // povratni poziv za zatvaranje porta serial.list (); // popis serijskih portova serial.open (portName); // otvaranje serijskog porta} // Funkcija crtanja ----------------------- funkcija draw () {background (0); // crna pozadina} // Ovdje interpretirajte serijske podatke ---------- funkcija serialEvent () {// čita niz sa serijskog porta // sve dok ne dobijete return carriage i newline: var inString = serial. readStringUntil ('\ r / n'); // proveravamo da li tu zaista postoji niz podešavanja: if (inString.length> 0) {if (inString! == 'hello') {// ako dobijete pozdrav, zanemarite to var sensors = split (inString, ', '); // razdvaja niz na zarezima if (sensors.length> 16) {// ako postoji šesnaest elemenata (6 analognih, 10 digitalnih) // Ovdje se koriste podaci senzora:

}

} serial.write ('x'); // šalje bajt koji traži više serijskih podataka}} // dobija listu portova: funkcija printList (portList) {// portList je niz naziva serijskih portova za (var i = 0; i <portList.length; i ++) {// Prikažite popis konzole: print (i + "" + portList ); }} funkcija serverConnected () {print ('povezano sa serverom.'); } funkcija portOpen () {print ('serijski port otvoren.')} funkcija serialError (err) {print ('Nešto nije u redu sa serijskim portom.' + err); } funkcija portClose () {print ('Serijski port je zatvoren.'); } funkcija closedCode () {serial.close (portName); return null; } window.onbeforeunload = closedCode;

Nakon što sačuvate kostur. Ove vrijednosti možete koristiti slično kao što je to učinjeno u vodiču za ITP. Niz vrijednosti koje smo poslali iz našeg Arduina u koraku 6 šalje se u nizu od 16 brojeva. Ispod je mjesto gdje raščlanjujemo ovaj niz.

// Ovdje interpretirajte serijske podatke ----------

funkcija serialEvent () {// čita niz sa serijskog porta // sve dok ne dobijete return carriage i novi red: var inString = serial.readStringUntil ('\ r / n'); // proveravamo da li tu zaista postoji niz podešavanja: if (inString.length> 0) {if (inString! == 'hello') {// ako dobijete pozdrav, zanemarite to var sensors = split (inString, ', '); // razdvaja niz na zarezima if (sensors.length> 16) {// ako postoji šesnaest elemenata (6 analognih, 10 digitalnih) // Ovdje se koriste podaci senzora:}} serial.write ('x'); // pošaljite bajt koji traži više serijskih podataka}}

Sada možemo pokrenuti naš program da vidimo radi li!

Korak 9: Pokretanje programa

Sada možemo pokrenuti naš program da vidimo radi li. Možete stvoriti vlastitu igru koristeći datoteku skeleton.js u našoj prethodnoj datoteci ili koristiti jednostavnu igru Pipe koja se nalazi ovdje.

Slično ITP Lab -u, za pokretanje našeg programa slijedit ćemo dolje navedene korake.

• Priključite Arduino sa kontrolerima koje planirate koristiti.
• Otvorite p5.serialcontrol
• Promijenite port skice p5 na onaj koji koristite (ako koristite kostur, ovo je na liniji 3)
• Otvorite HTML datoteku koja povezuje vašu p5 skicu

Ako imate vanjske medije, poput slika ili preuzetih fontova, poželjet ćete ovo pokrenuti na poslužitelju. Možete pokrenuti jednostavan lokalni python server ako želite.

Korak 10: Idite dalje

Da biste otišli dalje i razvili više igara za to, možete slijediti različite primjere iz p5.play koji se nalaze ovdje. Ispod je primjer složenije igre koju sam stvorio. To je igra 1 protiv 1 tenka. Sve resurse za to možete pronaći na GitHubu.