Urolajte sa stilom s ovom DIY elektroničkom matricom D20

Urolajte sa stilom s ovom DIY elektroničkom matricom D20

Želite li nešto malo jedinstveno za svoju sljedeću stolnu igru ​​uloga? Što kažete na elektronički D20 s prilagođenom grafikom za kritične pogodake i promašaje? Danas ću vam pokazati kako sami izgraditi Arduino i nekoliko jednostavnih dijelova.





Ne brinite ako nikada prije niste koristili Arduino, mi imamo vodič za početak rada .



Plan izgradnje

Ovo je jednostavan projekt. Arduino će pokretati OLED zaslon, a gumb će kotrljati matricu. Prilagođena grafika će prikazati kritične udarce ili kritične pogreške. Kôd možete lako izmijeniti u D8, D10 ili D12.





Što trebaš

  • 1 x Arduino
  • 1 x 0,96 ' I2C OLED zaslon
  • 1 x tipkalo
  • 1 x 10 tisuća? Otpornik
  • 1 x Oglasna ploča
  • Razne žice za spajanje
  • Cijeli kôd ovdje, ako ne želite slijediti do kraja kroz pisane upute.

To su ključni dijelovi koji su vam potrebni za izradu vlastitog D20. Možda ćete ga htjeti instalirati u kućište (o čemu će biti riječi u nastavku) i lemiti krug u trajnije stanje. Evo dodatnih dijelova koji će vam trebati za to:

  • 4 vijka M2 x 10 mm (0,4 inča)
  • 4 x M2 matice
  • 4 x 7 mm (0,28 inča) podloške
  • Priključak za bateriju od 9V (ili odgovarajuća alternativa)
  • Različite termoskupljajuće cijevi

Ovi OLED zasloni su jako cool. Obično se mogu kupiti u bijeloj, plavoj, žutoj boji ili u mješavini tri. Kupio sam jedan u plavoj boji kako bi odgovarao mom kućištu. Pobrinite se da dobijete an I2C model umjesto SPI .



Gotovo svaki Arduino bit će prikladan. Odabrao sam Nano, jer su dovoljno mali da stanu u kućište. Za više informacija o Arduino modelima pogledajte naš vodič za kupnju.

Krug

Evo kruga koji vam je potreban:



Spojiti VCC i GND na OLED zaslonu za Arduino +5V i tlo . Spojiti analogni 4 na Arduinu na pin označen SDA . Spojiti analogni 5 prema SCL pribadača. Ovi pinovi sadrže sklopove potrebne za pokretanje zaslona pomoću sabirnice I2C. Točne pinove razlikovat će se ovisno o modelu, ali A4 i A5 koriste se na Nano i Uno. Provjeri Dokumentacija žičane knjižnice za vaš model ako ne koristite Uno ili Nano.

Spojite bateriju na masu i VINO pribadača. Ovo označava napon i prihvaća različite DC napone - no prvo provjerite svoj model i on se ponekad može malo razlikovati.



Spojite gumb na digitalni pin 2 . Primijetite kako je 10k? otpornik je spojen na masu. Ovo je veoma važno! To je poznato kao otpornik za povlačenje i sprječava da Arduino otkrije lažne podatke ili smetnje pritiskom na gumb. Također služi za zaštitu ploče. Da se ovaj otpornik ne koristi, +5V bi išlo ravno u zemlju. Ovo je poznato kao a mrtav i jednostavan je način za ubiti Arduino.

Ako lemite ovaj krug, zaštitite svoje veze termoskupljajućom cijevi:

Pazite da ga ne zagrijavate previše, a to učinite tek kad budete sigurni da krug radi. Možda ćete također htjeti uviti svoje kabele u parove. To ih održava urednima i štiti od nepotrebnog stresa:

Test gumba

Sada kada ste izgradili krug, prenesite ovaj testni kôd (provjerite jeste li odabrali ispravnu ploču i priključak s Alati> Ploča i Alati> Priključak jelovnici):

const int buttonPin = 2; // the number of the button pin
void setup() {
pinMode(buttonPin, INPUT); // setup button
Serial.begin(9600); // setup serial
}
void loop(){
if(digitalRead(buttonPin) == HIGH) {
Serial.print('It Works');
delay(250);
}
}

Nakon učitavanja, držite Arduino spojenim putem USB -a i otvorite serijski monitor ( Gore desno> Serijski monitor ). Trebali biste vidjeti riječi Radi pojavljuju se svaki put kada pritisnete gumb.

Ako se ništa ne dogodi, idite i provjerite strujno kolo.

OLED postavljanje

Morate instalirati dvije knjižnice za upravljanje zaslonom. Preuzmite Adafruit_SSD1306 i Adafruit-GFX [Nema više dostupnih] knjižnica iz Githuba i spremite ih u mapu knjižnice. Ako niste sigurni gdje se nalaze vaše bibliotečke mape, pročitajte moj tutorial za retro igre, gdje detaljnije konfiguriram ovaj isti zaslon.

Ponovo pokrenite svoj Arduino IDE i prenesite testnu skicu iz Datoteka> Primjeri Jelovnik. Odaberi Adafruit SSD1306 i onda ssd1306_128x64_i2c . Prenesite ovaj kôd (proći će neko vrijeme), a na zaslonu biste trebali vidjeti mnogo oblika i uzoraka:

Ako se ništa ne dogodi, provjerite veze. Ako nakon provjere i dalje neće raditi, morat ćete izmijeniti uzorak koda.

iphone 12 pro max vs pro

Promijenite ovaj redak (na početku postaviti funkcija):

display.begin(SSD1306_SWITCHCAPVCC, 0x3D);

Na ovo:

display.begin(SSD1306_SWITCHCAPVCC, 0x3C);

To govori knjižnici o pojedinostima o zaslonu koji koristite. Sada biste trebali biti spremni za nastavak gradnje.

Slučaj

Ako ovo gradite na osnovnoj ploči ili ne želite spremiti u okvir, možete preskočiti ovaj korak.

Dizajnirao sam i 3D tiskao ovu kutiju. Uključite datoteke Thingiverse . Ne brinite ako nemate 3D pisač - mrežne usluge 3D čvorišta i Shapeways pružati mrežne usluge tiskanja.

Ovu kutiju možete jednostavno napraviti od drveta ili kupiti plastiku projektna kutija .

Poklopac je jednostavan dizajn koji se uklapa i sadrži nekoliko izreza za hardver:

Kod

Sad kad je sve spremno, vrijeme je za kôd. Evo kako će to funkcionirati Pseudokod :

if button is pressed
generate random number
if random number is 20
show graphic
else if random number is 1
show graphic
else
show number

Da bi ovo ispravno funkcioniralo, potrebno je generirati slučajan broj - ovo je rola matrice. Arduino ima generator slučajnih brojeva koji se naziva slučajno , ali ga ne bi trebao koristiti. Iako je dovoljno dobar za osnovne nasumične zadatke, jednostavno nije dovoljno slučajan za elektroničku matricu. Razlozi zašto su donekle komplicirani, ali ako vas zanima, možete pročitati više boallen.com .

Preuzmite TrueRandom biblioteku autor sirleech na Githubu. Dodajte ovo u mapu knjižnice i ponovno pokrenite IDE.

Sada stvorite novu datoteku i postavite svoj početni kôd (ili samo preuzmite gotov kôd s GitHub -a):

#include
#include
#include
#include
#include
Adafruit_SSD1306 display(4);
void setup() {
display.begin(SSD1306_SWITCHCAPVCC, 0x3C); // setup the OLED
pinMode(buttonPin, INPUT); // setup button
}
void loop() {

}

Ovaj kôd konfigurira OLED i uključuje sve knjižnice koje su vam potrebne za komunikaciju s njim, zajedno s novom bibliotekom slučajnih brojeva. Sada dodajte ovo u glavnu petlju:

if(digitalRead(buttonPin) == HIGH) {
delay(15);
if(digitalRead(buttonPin) == HIGH) {
display.fillScreen(BLACK); // erase the whole display
display.setTextColor(WHITE);
display.setTextSize(2);
display.setCursor(0, 0);
display.println(TrueRandom.random(1, 21)); // print random number
display.display(); // write to display
delay(100);
}
}

Ovo je trenutno prilično osnovno, ali radi o D20. Kad god pritisnete gumb, na ekranu se prikazuje slučajni broj između jedan i 20:

Ovo radi dobro, ali je pomalo dosadno. Učinimo to boljim. Izradite dvije nove metode, drawDie i eraseDie :

void drawDie() {
display.drawRect(32, 0, 64, 64, WHITE);
}

Oni će izvući kockicu na sredini ekrana. Možda biste ovo mogli zakomplicirati, možda crtanjem D20 ili D12 i tako dalje, ali jednostavnije je nacrtati osnovnu šestostranu matricu. Evo osnovne uporabe:

drawDie();

Zatim izmijenite svoju glavnu petlju tako da izvučete slučajni broj, samo veći i u sredini. Promijenite veličinu teksta i pokazivač na ovo:

display.setTextColor(WHITE);
display.setCursor(57, 21);

Sada izgleda puno bolje:

Jedini problem su brojevi veći od devet:

Popravak za to je jednostavan. Za sve brojeve manje od 10 kursor će biti postavljen na drugačiji položaj od onih za 10 ili veći. Zamijenite ovaj redak:

jesu li svi mikro usb kabeli isti
display.setCursor(57, 21);

S ovim:

int roll = TrueRandom.random(1, 21); // store the random number
if (roll <10) {
// single character number
display.setCursor(57, 21);
}
else {
// dual character number
display.setCursor(47, 21);
}

Evo kako to sada izgleda:

Sada preostaju samo slike kada napravite kritičan pogodak ili promašite. Postoji nekoliko koraka, ali to je dovoljno jednostavan proces.

Pronađite odgovarajuću sliku koju želite koristiti (što je jednostavnije, to bolje jer je zaslon samo u jednoj boji). Evo slika koje sam koristio:

Kredit za sliku: publicdomainvectors.org

Svaka slika koju želite koristiti morat će se pretvoriti u HEX niz. Ovo je prikaz slike u obliku koda. Za to je dostupno mnogo alata, a neki su napisani posebno za OLED zaslone. Najlakši način je koristiti Slika u C_Hex mrežni alat. Ovdje su potrebne postavke:

Windows 10 korištenje diska 100 popraviti

Prenesite svoju sliku i postavite format koda na ŠESTORO: 0x . Postavi Koristi za do Crno/bijelo za sve funkcije crtanja slika . Ostale opcije ostavite kao zadane. Ovdje možete promijeniti veličinu slike ako je potrebno. Pritisnite Nabavite C niz i trebali biste vidjeti podatke o slici:

Ovi generirani podaci trebat će vam za minutu. Izradite dvije funkcije tzv drawExplosion i drawLubanja (ili prikladan naziv za vašu verziju). Evo koda:

void drawExplosion() {
// store image in EEPROM
static const unsigned char PROGMEM imExp[] = {
0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x30,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0xfc,0x00,0x00,0x00,0x00,0x00,0x78,0x7f,0xff,0xc0,0x00,0x00,0x00,0x00,0xfe,0xff,0xff,0xf0,0x00,0x00,0x00,0x3f,0xff,0xff,0xff,0xfb,0x00,0x00,0x00,0x7f,0xff,0xff,0xff,0xff,0xc0,0x00,0x00,0x7f,0xff,0xff,0xff,0xff,0xff,0x00,0x01,0xff,0xff,0xff,0xff,0xff,0xff,0x80,0x03,0xff,0xff,0xff,0xff,0xff,0xff,0x80,0x03,0xff,0xff,0xff,0xff,0xff,0xff,0x80,0x03,0xff,0xff,0xff,0xff,0xff,0xff,0xc0,0x03,0xff,0xff,0xff,0xff,0xff,0xff,0xf0,0x07,0xff,0xff,0xff,0xff,0xff,0xff,0xf0,0x07,0xff,0xff,0xff,0xff,0xff,0xff,0xf0,0x07,0xff,0xff,0xff,0xff,0xff,0xff,0xe0,0x07,0xff,0xff,0xff,0xff,0xff,0xff,0xc0,0x0f,0xff,0xff,0xff,0xff,0xff,0xff,0xe0,0x1f,0xff,0xff,0xff,0xff,0xff,0xff,0xe0,0x1f,0xff,0xff,0xff,0xff,0xff,0xff,0xe0,0x0f,0xff,0xff,0xff,0xff,0xff,0xff,0xf0,0x03,0xff,0xff,0xff,0xff,0xff,0xff,0xf0,0x03,0xff,0xff,0xff,0xff,0xff,0xff,0xf0,0x03,0xff,0xff,0xff,0xff,0xff,0xff,0xe0,0x01,0xff,0xff,0xff,0xff,0xff,0xff,0x00,0x00,0x0f,0xff,0xff,0xff,0xff,0xfe,0x00,0x00,0x07,0xff,0xff,0xf9,0xff,0xd8,0x00,0x00,0x00,0x3f,0xff,0xf0,0x0f,0x00,0x00,0x00,0x00,0x1f,0x1f,0xf0,0x00,0x00,0x00,0x00,0x00,0x00,0x0f,0xe0,0x00,0x00,0x00,0x00,0x00,0x00,0x0f,0xe0,0x00,0x00,0x00,0x00,0x00,0x00,0x0f,0xe0,0x00,0x00,0x00,0x00,0x00,0x00,0x0f,0xf0,0x00,0x00,0x00,0x00,0x00,0x00,0x0f,0xf0,0x00,0x00,0x00,0x00,0x00,0x00,0x0f,0xf0,0x00,0x00,0x00,0x00,0x00,0x00,0x3f,0xf8,0x00,0x00,0x00,0x00,0x00,0x00,0x7f,0xff,0x00,0x00,0x00,0x00,0x00,0x00,0x7f,0xff,0x00,0x00,0x00,0x00,0x00,0x00,0x7f,0xff,0x00,0x00,0x00,0x00,0x00,0x00,0x7f,0xfe,0x00,0x00,0x00,0x00,0x00,0x00,0x7f,0xfc,0x00,0x00,0x00,0x00,0x00,0x00,0x0f,0xf0,0x00,0x00,0x00,0x00,0x00,0x00,0x07,0xf0,0x00,0x00,0x00,0x00,0x00,0x00,0x07,0xe0,0x00,0x00,0x00,0x00,0x00,0x00,0x07,0xe0,0x00,0x00,0x00,0x00,0x00,0x00,0x07,0xe0,0x00,0x00,0x00,0x00,0x00,0x00,0x07,0xf0,0x00,0x00,0x00,0x00,0x00,0x00,0x0f,0xf0,0x00,0x00,0x00,0x00,0x00,0x00,0x0f,0xf8,0x00,0x00,0x00,0x00,0x00,0x00,0x0f,0xfc,0x00,0x00,0x00,0x00,0x00,0x00,0x1f,0xff,0x00,0x00,0x00,0x00,0x00,0x0f,0xff,0xff,0xff,0x00,0x00,0x00,0x07,0xff,0xff,0xff,0xff,0xf0,0x00,0x00,0x0f,0xff,0xff,0xff,0xff,0xff,0x00,0x00,0x1f,0xff,0xff,0xff,0xff,0xff,0x00,0x00,0x1f,0xff,0xff,0xff,0xff,0xfc,0x00,0x00,0x01,0xbf,0xff,0xff,0xff,0x30,0x00,0x00,0x00,0x13,0xf7,0xb8,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00
};
display.drawBitmap(0, 0, imExp, 64, 62, 1); // draw mushroom cloud
}
void drawSkull() {
// store image in EEPROM
static const unsigned char PROGMEM imSku[] = {
0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0xe0,0x00,0x00,0x00,0x00,0x30,0x00,0x00,0xf0,0x00,0x00,0x00,0x00,0x78,0x00,0x07,0xf0,0x00,0x00,0x00,0x00,0xfc,0x00,0x07,0xf8,0x00,0x00,0x00,0x00,0xfe,0x00,0x07,0xf8,0x00,0x00,0x00,0x01,0xfe,0x00,0x07,0xfc,0x00,0x00,0x00,0x01,0xfe,0x00,0x07,0xfe,0x00,0x3f,0xc0,0x03,0xfe,0x00,0x01,0xff,0x81,0xff,0xfc,0x07,0xec,0x00,0x00,0x3f,0xc7,0xff,0xff,0x1f,0xc0,0x00,0x00,0x0f,0xcf,0xff,0xff,0xdf,0x00,0x00,0x00,0x07,0xbf,0xff,0xff,0xee,0x00,0x00,0x00,0x01,0x7f,0xff,0xff,0xf0,0x00,0x00,0x00,0x00,0xff,0xff,0xff,0xf8,0x00,0x00,0x00,0x01,0xff,0xff,0xff,0xf8,0x00,0x00,0x00,0x03,0xff,0xff,0xff,0xfc,0x00,0x00,0x00,0x07,0xff,0xff,0xff,0xfe,0x00,0x00,0x00,0x0f,0xff,0xff,0xff,0xff,0x00,0x00,0x00,0x0f,0xff,0xff,0xff,0xff,0x00,0x00,0x00,0x1f,0xff,0xff,0xff,0xff,0x80,0x00,0x00,0x1f,0xff,0xff,0xff,0xff,0x80,0x00,0x00,0x1f,0xff,0xff,0xff,0xff,0x80,0x00,0x00,0x1f,0xff,0xff,0xff,0xff,0x80,0x00,0x00,0x1f,0xff,0xff,0xff,0xff,0x80,0x00,0x00,0x1f,0xff,0xff,0xff,0xff,0x80,0x00,0x00,0x1e,0x3f,0xff,0x3f,0xc7,0x80,0x00,0x00,0x1e,0x0c,0x0f,0x00,0x07,0x80,0x00,0x00,0x1e,0x00,0x0f,0x00,0x0f,0x80,0x00,0x00,0x1e,0x00,0x19,0x80,0x0f,0x00,0x00,0x00,0x0f,0x00,0x19,0x80,0x0f,0x00,0x00,0x00,0x0d,0x00,0x30,0xc0,0x1f,0x00,0x00,0x00,0x05,0x80,0x70,0xc0,0x1e,0x00,0x00,0x00,0x05,0xf0,0xe0,0xe0,0x36,0x00,0x00,0x00,0x01,0xff,0xe0,0x7f,0xf0,0x00,0x00,0x00,0x03,0xff,0xc4,0x7f,0xf0,0x00,0x00,0x00,0x03,0xff,0xcc,0x7f,0xf0,0x00,0x00,0x00,0x03,0xff,0xcc,0x7f,0xf0,0x00,0x00,0x00,0x03,0xff,0x9e,0x7f,0xf0,0x00,0x00,0x00,0x00,0xff,0xfe,0x7f,0xc0,0x00,0x00,0x00,0x00,0x01,0xff,0xf8,0x1c,0x00,0x00,0x00,0x03,0xe0,0x3f,0x01,0xbf,0x00,0x00,0x00,0x07,0xa6,0x40,0x09,0x9f,0x80,0x00,0x00,0x1f,0x27,0x5a,0x39,0x9f,0xf8,0x00,0x01,0xff,0x27,0xdb,0x39,0x0f,0xfc,0x00,0x03,0xfe,0x31,0x7f,0x39,0x07,0xfc,0x00,0x03,0xfc,0x10,0x1a,0x02,0x03,0xf8,0x00,0x03,0xf8,0x10,0x00,0x02,0x01,0xf0,0x00,0x01,0xf8,0x10,0x00,0x02,0x01,0xe0,0x00,0x00,0x78,0x10,0x00,0x02,0x00,0xe0,0x00,0x00,0x70,0x30,0x00,0x02,0x00,0x00,0x00,0x00,0x30,0x20,0x00,0x03,0x00,0x00,0x00,0x00,0x00,0x64,0x00,0x1b,0x00,0x00,0x00,0x00,0x00,0x73,0x55,0x63,0x00,0x00,0x00,0x00,0x00,0xf9,0x55,0x4f,0x00,0x00,0x00,0x00,0x00,0x7f,0x14,0x1f,0x00,0x00,0x00,0x00,0x00,0x1f,0xe0,0xfe,0x00,0x00,0x00,0x00,0x00,0x0f,0xff,0xfc,0x00,0x00,0x00,0x00,0x00,0x07,0xff,0xf0,0x00,0x00,0x00,0x00,0x00,0x03,0xff,0xc0,0x00,0x00,0x00,0x00,0x00,0x00,0x38,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00
};
display.drawBitmap(0, 0, imSku, 60, 64, 1); // draw skull cloud
}

Ako želite koristiti slike koje sam ja koristio, samo naprijed i kopirajte kôd. Ako želite koristiti vlastite slike koje ste ranije generirali, kopirajte bajt kod u imSku i imExp nizove prema potrebi.

Evo kako te slike izgledaju na ekranu:

Najvažniji dio tog koda je ovaj redak:

static const unsigned char PROGMEM imSku[]

Ovo govori Arduinu da pohrani vaše slike u EEPROM ( što je EEPROM? ) umjesto RAM -a ( brzi vodič za RAM ). Razlog tome je jednostavan; Arduino ima ograničenu RAM memoriju, pa sve to za pohranu slika možda neće ostaviti preostalo za izvršavanje vašeg koda

Izmijenite svoj glavni ako izjavu za prikaz ove nove grafike kada se izbaci jedan ili 20. Zabilježite redove koda za prikaz broja valjanih pored slika:

if(roll == 20) {
drawExplosion();
display.setCursor(80, 21);
display.println('20');
}
else if(roll == 1) {
display.setCursor(24, 21);
display.println('1');
drawSkull();
}
else if (roll <10) {
// single character number
display.setCursor(57, 21);
display.println(roll); // write the roll
drawDie(); // draw the outline
}
else {
// dual character number
display.setCursor(47, 21);
display.println(roll); // write the roll
drawDie(); // draw the outline
}

A evo kako izgledaju te nove rolice:

To je sve za kodnu stranu (idite zgrabite kôd s GitHub -a ako ste sve to preskočili). Ovo možete lako izmijeniti u D12, D8 itd.

Završna skupština

Sad kad je sve ostalo završeno, vrijeme je da se sve zapakira. Uključite zaslon, pazeći da ne zategnete vijke previše. Ovo je vjerojatno najteži dio. Pri tome sam razbio zaslon, pa ćete možda htjeti upotrijebiti neke plastične podloške. Izrezao sam neke kvadrate Plastična kartica :

Male matice i vijci mogu se teško spojiti. Savjet: Za početak pričvrstite matice malim komadom Blu-Tacka na kraju odvijača:

Uključite gumb, spojite bateriju i zatvorite poklopac. Pazite da ne zapnete žice ili ih prečvrsto zavežete, što može uzrokovati kratki spoj. Ovisno o duljini zadnjih kabela, možda ćete morati zaštititi izložene spojeve s nekom izolacijom (serijski okvir dobro funkcionira):

Evo kako to izgleda iznutra:

I evo gotovog proizvoda:

Sada biste trebali biti ponosni vlasnik elektroničkog D20!

Koje ste izmjene unijeli? Jeste li promijenili slike? Javite nam u komentarima, voljeli bismo vidjeti što ste učinili!

Udio Udio Cvrkut E -pošta Vodič za animaciju govora za početnike

Oživljavanje govora može biti izazov. Ako ste spremni započeti dodavanje dijaloga u svoj projekt, mi ćemo za vas razbiti postupak.

Pročitajte Dalje Povezane teme
  • Uradi sam
  • Arduino
  • Igra na ploči
  • Elektronika
O autoru Joe Coburn(136 objavljenih članaka)

Joe je diplomirao računalne znanosti na Sveučilištu Lincoln, UK. On je profesionalni programer softvera, a kad ne leti bespilotnim letjelicama ili ne piše glazbu, često ga se može zateći kako fotografira ili proizvodi video zapise.

Više od Joea Coburna

Pretplatite se na naše obavijesti

Pridružite se našem biltenu za tehničke savjete, recenzije, besplatne e -knjige i ekskluzivne ponude!

Kliknite ovdje za pretplatu