Targeta de visita / Consola de jocs: Pantalla ATtiny85 i OLED: 5 passos (amb imatges)

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

Hola a tothom

Avui us mostraré com podeu crear la vostra pròpia targeta de visita / consola de jocs / qualsevol cosa que us pugueu imaginar que tingui una pantalla OLED I2C retroiluminada i un microprocessador ATtiny85. En aquest instructiu us explicaré com funciona realment un PCB que he dissenyat, com podeu construir-lo i què podeu fer amb aquesta funcionalitat. Si ja teniu una pantalla I2C connectada a un ATtiny85, aquest instructiu pot ser útil si intenteu mostrar imatges o voleu crear menús, un joc i molt més.

Probablement us preguntareu què és en realitat aquesta cosa. És només una simple placa de circuit imprès amb una bateria, pantalla, botons, interruptor d’encesa / apagat i unitat de processament integrats. Penseu-ho com un Gameboy petit, que podeu programar fàcilment per fer diverses coses. Endavant!

Pas 1: The Guts

Si encara no ho heu fet, us recomano que feu un compte a circuits.io. Això us permetrà personalitzar el meu disseny segons les vostres necessitats.

En aquest pas explicaré com es pot aconseguir realment una d'aquestes plaques de circuits impresos (PCB). He creat el meu PCB a circuits.io, una gran eina en línia que podeu utilitzar per crear esquemes de circuits i PCB. Podeu veure el disseny aquí:

Si esteu interessats en obtenir el PCB, podeu demanar-ne tants com vulgueu a OSH Park mitjançant aquest enllaç:

Triga una estona a aconseguir els taulers (1-3 setmanes), però confieu en mi. Val la pena! Necessiteu les parts següents per crear la vostra pròpia targeta multifuncional:

• ATtiny85 al paquet SOIC-8. Aquest és el cervell del nostre projecte que controla TOT.
• Pantalla OLED I2C de 128x64 píxels:
• 2 resistències de 22k ohm. Es tracta de resistències de tracció per als botons.
• Suport CR2032 de muntatge superficial:
• Bateria mòbil CR2032. Aquesta petita bateria pot alimentar el circuit durant força temps.
• Interruptor lliscant de 3 pins. Aquest és l’interruptor d’alimentació.
• Capçaleres femenines. Podeu utilitzar-los per programar l'ATtiny85 mentre està al circuit.
• Botons de 6 mm:
• Una placa de circuit imprès (podeu demanar-la mitjançant l'enllaç de més amunt

Eines:

• Soldador (amb punta fina)
• Soldar
• Talls de plom

Per programar l'ATtiny85:

• 6 cables de pont masculí a masculí
• Un condensador de 10 micro-farad
• Arduino Uno o algun altre microcontrolador basat en ATmega

Pas 2: Muntatge del PCB

Això és realment bastant fàcil. Tot el que heu de fer és soldar tots els components als seus llocs respectius, tal com s’indica al tauler. Algunes d’aquestes pantalles OLED tenen diferents mides, de manera que si la vostra és massa gran per al tauler, podeu fer-la penjar a la part superior, com a la imatge superior, i doblegar-les sobre les capçaleres de l’altre costat i soldar-les als forats on se suposava que anaven. Mireu la segona imatge si esteu confós.

Alguns consells útils:

• El petit punt de l’ATtiny s’ha d’orientar perquè estigui a prop del commutador de corredissa, en cas contrari tindràs els pins en un ordre equivocat.
• L’orientació del suport de la bateria és important. L’extrem del suport amb el plus gravat ha d’estar al coixinet inferior (apuntat cap a una resistència).
• L’orientació d’interruptors, botons, capçaleres i resistències no té importància

Si teniu cap pregunta, envieu-me un correu electrònic a info [at] coniferapps.com

Pas 3: és hora de programar

Vaig fer funcionar el meu combinat ATtiny / pantalla amb el següent instructable: https://www.instructables.com/id/ATTiny85-connects-to-I2C-OLED-display-Great-Things/. De fet, fins i tot faig servir la biblioteca que AndyB2 va modificar en els meus propis esbossos.

La manera com programarem l’ATtiny és mitjançant un Arduino Uno. El següent instructable us mostra com fer-ho: https://www.instructables.com/id/Program-an-ATtiny-with-Arduino/. Si encara no us n’heu adonat, tots els passadors necessaris es mostren útils a la PCB amb els números de passadors etiquetats a la part posterior.

Si voleu començar amb un exemple bàsic, pengeu l'esbós enllaçat a la vostra targeta. Assegureu-vos que l’interruptor d’alimentació es mou cap a la dreta abans de fer això. No voleu que la bateria i l’Uno subministren tensió alhora. En aquesta carpeta hi ha un munt de fitxers. En parlaré més al següent pas, però la majoria dels fitxers de capçalera que hi ha són representacions hexadecimals d’imatges de mapa de bits monocromàtiques. Els fitxers.bmp són aquestes imatges que acabo d’esmentar; com podeu veure, són en blanc i negre i tenen exactament 128x64 píxels. Aquests no es carreguen al microcontrolador, però vaig pensar que els inclouria com a referència.

Pas 4: Quant al programa en si mateix

L’esbós que us vaig fer penjar al pas anterior és un exemple molt bàsic de com podeu implementar un menú. En fer clic a cadascun dels botons esquerre i dret, es commuta un comptador al programa. A continuació, es diu una funció que fa que ATtiny comprovi l'estat d'aquest comptador i, en funció del número del comptador, ATtiny dibuixa a la pantalla una imatge de l'opció de menú seleccionada actualment. Cadascuna de les diferents cel·les de menú seleccionades és la seva pròpia imatge. Si es prem el botó superior, ATtiny torna a comprovar l'estat del comptador per determinar quina pantalla de detall es mostrarà. Mentre es mostren aquestes pantalles de detall, ATtiny comprova constantment si es prem qualsevol botó. Un cop detectat que es prem un botó, es torna a cridar a la funció que dibuixa els menús i es dibuixa a la pantalla l'estat actual del menú, que ens torna al menú. Sembla una mica descoratjador si sou nou en programació, però us ho prometo que, una vegada que observeu el codi, tindrà més sentit.

Cadascuna de les pantalles de detall també és la seva pròpia imatge.

Si no us n'heu adonat, l'opció sorpresa no fa res. Arribarem a això al següent pas:).

Pas 5: personalització de la vostra creació

Ara que heu vist el que he fet, és hora que personalitzeu la targeta amb la vostra pròpia informació. Aquesta biblioteca que he inclòs té una funció per dibuixar text a la pantalla, però us recomano anar amb una solució estrictament basada en imatges, ja que tendeix a tenir molt millor aspecte. Originalment, anava a afegir fotos a la part del programa d’aquest instructable, però és prou llarg per garantir la seva pròpia instrucció. Podeu veure-ho aquí:

Ara que ja sabeu com afegir fotos, podeu fer que la targeta faci un munt de coses. Podeu utilitzar els meus menús i la pantalla d’ajuda i afegir la vostra pròpia informació de contacte. Fins i tot es podria fer un petit joc per a l’opció “sorpresa”. Seria bastant senzill moure un sprite de 10x10 molt petit per la pantalla mitjançant els botons i comprovar si xoca amb un altre sprite. Podeu fer un clon d’ocell flàpid utilitzant aquest mateix concepte. Si feu alguna cosa, envieu-ne una foto / vídeo / fitxer als comentaris.

Només un petit punt més que vaig oblidar d’esmentar. Pel que fa a l’emmagatzematge, l’ATtiny85 no en té gaire. Per als programes, són uns 8kb. El meu esbós actual amb 5 fotografies i biblioteca de pantalla OLED ocupa aproximadament 7 d'aquestes 8 kb. Qualsevol joc que facis haurà d’encaixar dins d’aquest marge relativament petit, de manera que serà un repte divertit:).

Gràcies per escoltar-me divagant i, si teniu alguna pregunta, no dubteu a enviar-me un correu electrònic a info [at] coniferapps.com (substituïu [at] per @). Si us plau, voteu-me al concurs Autodesk Circuits. Esperem que aviat tingueu la vostra pròpia targeta de visita / joc per lluir!