Controladors Arduino: 10 passos (amb imatges)

2024 Autora: John Day | [email protected]. Última modificació: 2024-01-30 08:15

Un sistema de control de jocs Arduino que utilitza Arduino i la biblioteca p5.js. La idea és crear un projecte Arduino que es pugui replicar i ampliar fàcilment. Les connexions del controlador estan dissenyades per utilitzar un munt de diversos sensors i entrades que es poden intercanviar en funció de cada controlador.

Aquest projecte també està dissenyat per utilitzar la biblioteca JavaScript p5.js juntament amb la biblioteca p5.play dissenyada per a p5.js. Aquestes biblioteques ens permeten programar els nostres jocs amb facilitat. El lloc web p5.play té un munt de tutorials i exemples perquè els usuaris puguin crear jocs per a això. Aquest projecte permet als usuaris practicar les seves habilitats de desenvolupament de maquinari i programari.

Pas 1: què necessiteu

Eines:

• Soldador
• Soldar
• Decapants de filferro
• Talls laterals
• Alicates

Maquinari:

• Taula compatible amb Arduino (he utilitzat un Sparkfun Redboard, així com un Arduino Uno i Leonardo)

• Perf Board:

  • Taulers de perfils verds de 8cm x 6cm
  • Tauler perfecte d’escut Aduino Uno

• Diversos sensors

  • Joysticks
  • Botons (amb resistències, 10k ohms, per anar amb ells)
  • Potenciòmetres
  • Sensors flexibles
  • Sensors de pressió
  • Etc …

• Filferro:

  • Single Wire (he utilitzat 26 AWG Solid)
  • Filferro de cinta i encrespaments
• Trencar capçaleres (com a mínim 20)

• Maquinari opcional (podeu fer servir cartrons i llaços de calenta / cremallera):

  • Cables de panell i pont per prototipatge
  • Tancaments impresos en 3D
  • Fixacions de maquinari (he utilitzat cargols M2.5)

Programari:

• IDE Arduino

• biblioteca p5.js

  Biblioteca P5.play també

• p5.serialcontrol
• Node.js

Pas 2: construcció: el centre de la consola, configuració de l'escut

Soldeu les capçaleres al tauler perfecte de l’escut Arduino Uno.

• Vaig començar amb les capçaleres d’escut (alimentació, entrada analògica i digital)
• A continuació, es mostren els pins de capçalera 2x5. Podeu utilitzar capçaleres 2x5 o només dues files de 5 capçaleres separades. Els vaig alinear amb A3 i A4 verticalment i vaig deixar 2 espais entre ells.

Pas 3: construcció: el centre de la consola, cablejat de l'escut

A continuació, volem encaminar els cables sobre l’escut. És més fàcil fer passar els cables a la part superior, però si voleu un aspecte més net, podeu executar-los a la part inferior.

Voleu prestar atenció a l’esquema (l’esquema Eagle està disponible per descarregar-lo) quan encamineu aquests cables. També podeu consultar la guia de colors per ajudar-vos amb això.

La idea d’aquest disseny d’escut és permetre 3 entrades analògiques i 5 entrades digitals de cada controlador. Això aprofita plenament totes les entrades analògiques d’un Arduino Uno, així com els cables restants del nostre cable de cinta.

Pas 4: construcció: controladors, configuració de les peces

El primer pas per construir el controlador és planificar quins sensors utilitzar. En els meus exemples, tinc un controlador bastant estàndard amb un joystick i uns quants botons. També tinc un controlador amb dos potenciòmetres lliscants.

Si voleu replicar-ho, podeu veure les meves imatges per ubicar-les.

El següent pas és soldar el cable de cinta al tauler de perf.

1. Tireu i esteneu el cable de cinta
2. Soldeu el cable de cinta al centre superior del tauler de perfils.

El següent pas és enrutar els cables. Vaig començar cablejant l’alimentació (5V / fil vermell) i la terra (fil marró) als sensors. Llavors vaig connectar les entrades analògiques. Em va semblar fàcil utilitzar el cable taronja (Analog A0 o A3) per al moviment horitzontal i el cable groc (Analog A1 o A4) per al moviment vertical.

Per mantenir les coses coherents, també he connectat un petit botó de color violeta a tots els meus controladors. Això és útil per a coses com tancar el port sèrie (ho examinaré més endavant), així com menús o opcions.

He penjat un esquema ràpid del meu controlador de joystick si voleu fer una ullada a això. Des del nostre diagrama pin-out, podeu veure la possibilitat de cada connexió del controlador (3 entrades analògiques i 5 digitals).

Pas 5: Opcional: Tancaments

Aquest pas és opcional, però si teniu accés a una impressora 3D, el resultat del vostre projecte es veurà una mica més refinat i acabat. Com es pot veure als meus prototips, he utilitzat un simple tros de cartró per evitar que les juntes de soldadura de la part inferior de les taules de perfils et punxessin els dits.

Podeu trobar els meus models en 3D adjunts a aquest pas. He creat recintes per al concentrador tant de l’Arduino Uno / Leonardo com de l’Sparkfun RedBoard (aquesta placa és una mica més ampla i utilitza mini USB).

Per als controladors, podeu connectar-los amb cargols M2.5. Vaig mantenir la femella al costat del PCB i utilitzo una rentadora i el cargol a la part inferior.

També he inclòs el model 3D per als control lliscants de botons dels potenciòmetres que he utilitzat.

Podeu trobar tots els fitxers 3D a GitHub.

Pas 6: Programació: Arduino

Comencem per configurar un simple esbós per provar. Us suggereixo fer servir el tutorial creat per ITP a NYU aquí. Per fer aquest tutorial, haureu de tenir instal·lats p5.serialcontroll i node.js. En aquest tutorial, se us introduirà a configurar un Arduino per enviar dades de sèrie que puguin utilitzar la nostra biblioteca javascript, p5.js. Podeu utilitzar el concentrador i el controlador que vam crear en els passos anteriors per fer-ho o podeu reproduir els circuits demostrats al tutorial. Aquest tutorial utilitza el pin d'entrada analògica A0 de l'Arduino Uno que està assignat al fil taronja del vostre primer controlador.

El següent tutorial que voldreu seguir es pot trobar aquí. Aquest tutorial us guiarà per configurar diverses entrades i utilitzar-les a p5.js. Al tutorial s’utilitzen les entrades analògiques A0 i A1. Correspondran als cables taronja i groc del controlador 1 del nostre sistema.

Un cop hàgiu revisat els tutorials anteriors, ja podem programar l’Arduino. A continuació es mostra el codi que volem utilitzar:

// controlador 1const int dig2 = 2; // blau const int dig3 = 3; // púrpura const int dig4 = 4; // gris const int dig5 = 5; // const blanc blanc dig6 = 6; // negre // controlador 2 const int dig7 = 7; // blue const int dig8 = 8; // púrpura const int dig9 = 9; // gris const int dig10 = 10; // const blanc blanc dig11 = 11; //negre

configuració nul·la () {

Serial.begin (9600); while (Serial.available () <= 0) {Serial.println ("hola"); // enviar un retard de missatge inicial (300); // espera 1/3 de segon} 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); }

bucle buit () {

if (Serial.available ()> 0) {// llegiu el byte entrant: int inByte = Serial.read (); // llegir el sensor:

// Controlador ANALOGGIC 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); // Controlador DIGITAL 1 int digital2 = digitalRead (dig2); int digital3 = digitalRead (dig3); int digital4 = digitalRead (dig4);

int digital5 = digitalRead (dig5);

int digital6 = digitalRead (dig6); // Controlador DIGITAL 2 int digital7 = digitalRead (dig7); int digital8 = digitalRead (dig8); int digital9 = digitalRead (dig9); int digital10 = digitalRead (dig10); int digital11 = digitalRead (dig11); // imprimeix els resultats: Serial.print (analog0); // [0] Serial.print (","); Serial.print (analògic1); // [1] Serial.print (","); Serial.print (analog2); // [2] Serial.print (","); // Inicieu les dades del controlador 2 Serial.print (analog3); // [3] Serial.print (","); Serial.print (analògic4); // [4] Serial.print (","); Serial.print (analògic5); // [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 (","); // Inicieu les dades del controlador 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]}}

Aquest codi envia les dades de sèrie dels nostres controladors com una matriu de 16 números. Els primers 6 d'aquests números són les nostres entrades analògiques (que van del 0 al 1023) i els 10 valors restants són els nostres valors digitals (0 o 1).

Un cop carregat el nostre codi, el podem provar obrint el monitor sèrie i escrivint un valor al nostre monitor sèrie, tal com vam fer al segon tutorial d’ITP. Hauríem d'obtenir una cadena de valors separada per comes.

Pas 7: Programació: HTML

Quan hàgim configurat i funcionat el nostre Arduino, podem començar a programar coses web. El codi HTML és molt senzill.

cos {encoixinat: 0; marge: 0;}

El codi html simplement enllaça els nostres fitxers javascript. La majoria del nostre codi apareixerà realment al nostre fitxer d'esbós.js.

Pas 8: Programació: P5.js i Javascript

Un cop hàgim configurat el nostre HTML, podrem treballar amb el nostre JavaScript. Si encara no ho heu fet, ara haureu de descarregar p5.js i p5.play i afegir-los a la carpeta de biblioteques del directori del vostre lloc web.

• p5.js
• p5.jugar

Al pas anterior, vam configurar el nostre fitxer HTML per trucar a les nostres biblioteques p5.js i p5.play. També el vam configurar per utilitzar el nostre fitxer sketch.js, que és on farem la major part de la nostra programació. A continuació es mostra el codi del nostre esquelet. També el podeu trobar aquí.

// Serial Variablesvar serial; // variable per contenir una instància de la biblioteca serialport var portName = 'COM4'; // empleneu el nom del port sèrie aquí // Variables de jocs globals ---------------

// Funció de configuració ----------------------

setup setup () {createCanvas (640, 480); serial = new p5. SerialPort (); // feu una nova instància de la biblioteca serialport serial.on ('llista', printList); // establiu una funció de devolució de trucada per a l'esdeveniment de la llista de ports sèrie serial.on ('connectat', servidorConectat); // devolució de trucada per connectar-se al servidor serial.on ('obert', portOpen); // devolució de trucada per al port que obre serial.on ('dades', serialEvent); // devolució de trucada per quan arribin noves dades serial.on ('error', serialError); // devolució de trucada per a errors serial.on ("tancar", portClose); // devolució de trucada per al tancament del port serial.list (); // llistar els ports sèrie serial.open (portName); // obriu un port sèrie} // Funció de dibuix ----------------------- funció draw () {background (0); // fons negre} // Interpretar les dades de sèrie aquí ---------- funció serialEvent () {// llegir una cadena des del port sèrie // fins que obtingueu retorn de carro i línia nova: var inString = serial. readStringUntil ('\ r / n'); // comproveu que hi hagi realment un setset: if (inString.length> 0) {if (inString! == 'hello') {// si teniu hello, ignoreu-ho var sensors = split (inString, ', '); // divideix la cadena a les comes si (sensors.length> 16) {// si hi ha setze elements (6 analògics, 10 digitals) // Utilitza les dades del sensor aquí:

}

} serial.write ('x'); // enviar un byte sol·licitant més dades de sèrie}} // obtenir la llista de ports: funció printList (portList) {// portList és una matriu de noms de ports sèrie per a (var i = 0; i <portList.length; i ++) {// Mostra la llista de la consola: print (i + "+ + PortList ); }} function serverConnected () {print ('connectat al servidor.'); } function portOpen () {print ('s'ha obert el port serial.')} function serialError (err) {print ('S'ha produït un error en el port serial.' + err); } function portClose () {print ('El port sèrie s'ha tancat'); } function closingCode () {serial.close (portName); retorn nul; } window.onbeforeunload = tancamentCodi;

Un cop tingueu esquelet desat. Podeu utilitzar aquests valors de manera similar a com es va fer al tutorial ITP. La cadena de valors que hem enviat des del nostre Arduino al pas 6 s’envia com una matriu de 16 números. A continuació és on analitzem aquesta matriu.

// Interpretar les dades de sèrie aquí ----------

funció serialEvent () {// llegiu una cadena des del port sèrie // fins que obtingueu el retorn de carro i la nova línia: var inString = serial.readStringUntil ('\ r / n'); // comproveu que hi hagi en realitat un setsetring: if (inString.length> 0) {if (inString! == 'hola') {// si teniu hola, ignoreu-ho var sensors = split (inString, ', '); // divideix la cadena a les comes si (sensors.length> 16) {// si hi ha setze elements (6 analògics, 10 digitals) // Utilitza les dades del sensor aquí:}} serial.write ('x'); // enviar un byte sol·licitant més dades de sèrie}}

Ara podem executar el nostre programa per veure si funciona.

Pas 9: Execució del programa

Ara podem executar el nostre programa per veure si funciona. Podeu crear el vostre propi joc mitjançant el fitxer skeleton.js del nostre fitxer anterior o bé podeu utilitzar el senzill joc Pipe que es troba aquí.

De manera similar al ITP Lab, per executar el nostre programa, seguirem els passos següents.

• Connecteu l’Arduino amb els controladors que vulgueu utilitzar.
• Obriu p5.serialcontrol
• Canvieu el port de l'esbós de p5 pel que esteu fent servir (si esteu fent servir l'esquelet, es troba a la línia 3)
• Obriu el fitxer HTML que enllaça amb el vostre esbós de p5

Si teniu fitxers externs com ara imatges o tipus de lletra descarregats, voldreu executar-lo en un servidor. Podeu executar un servidor de python local senzill si voleu.

Pas 10: anar més enllà

Per anar més enllà i desenvolupar més jocs per a això, podeu seguir diversos exemples del formulari p5.play que es troba aquí. A continuació es mostra un exemple d’un joc més complicat que vaig crear. És un joc de trets de tancs 1 contra 1. Podeu trobar-hi tots els recursos a GitHub.