PixelWall: 7 kroků (s obrázky)

2024 Autor: John Day | [email protected]. Naposledy změněno: 2024-01-30 08:22

Znáte projekt Pixel-Table? Měl jsem nápad realizovat takovou pixelovou věc, ale ne jako stůl, místo toho ji dát na zeď.

Abych mohl ležet na gauči a hrát na něm nějaké hry, zatímco relaxuji.:)

Implementované hry jsou:

• Tetris
• Vesmírní vetřelci
• Had
• Pixel Draw

další funkce jsou:

• Zobrazit aktuální čas
• Zobrazit barevné animace

PixelWall má ESP8266, takže se může připojit k mé domácí WLAN. Je ale také možné použít PixelWall jako přístupový bod a připojit se k němu přímo.

Aby bylo snadné používat PixelWall, zeď po připojení poskytuje webovou stránku, kterou můžete ovládat. Všechny aplikace lze ovládat/přehrávat prostřednictvím webové stránky. Není tedy nutné instalovat žádný software pro použití.

Navíc je zde ovladač NES, který usnadňuje hraní her.

Otevřený zdroj

Veškerý software a mechanické výkresy, které jsem vložil na github: https://github.com/C3MA/PixelWallFeel, můžete jej zdarma použít pro svůj vlastní projekt.

Krok 1: Začínáme s elektronikou

Z jiného projektu je stávající PCB s LED diodami WS2812. DPS má 3 řady s 12 LED v každé řadě.

Rozhodl jsem se použít tuto desku plošných spojů 6krát. Takže dostanu matici LED 12x18.

Prvním krokem bylo pájení všech 216 LED diod, kolem 100 kondenzátorů a ESP8266.

Ruční pájení trvalo asi 10 hodin.

Po prvním rychlém testu došlo na to, že všechno funguje.

Můžeme tedy přejít k mechanické části.

Krok 2: Vytvoření mechaniky

Nejprve potřebujeme pro každý pixel oddělující prvek. Cílem je spojit horizontální a vertikální pás pomocí V-cut dohromady.

Každý pás má tloušťku 3 mm a výšku 17 mm. Jsou řezány z desky HDF laserovým řezačem.

Všechny skici pro laserový řezač jsou nakresleny ve FreeCad (s názvem „Leiste“ve složce mechanik projektu github)

Mřížka je dána Layoutem DPS. Má šířku sloupce 28 mm a výšku řádku 31 mm.

Další otázka zní: Jak opravit pásy na desce plošných spojů? Lepení není tak dobrý nápad, protože by mělo být možné jej rozebrat, pokud je něco vadné. Rozhodl jsem se to tedy pokazit. Ale šroub rozdělí 3 mm tenký pás. Vytiskl jsem tedy 3D tiskárnou kapsu pro pásmo (toto je část s názvem „Ohlávka“v projektu github). To fungovalo docela dobře, aby je opravit na DPS.

Dalším krokem je získání rámce. Existuje několik internetových obchodů, které nabízejí řezání jednotlivých rámečků obrázků. Objednal jsem si tedy rám o velikosti 343 mm x 565 mm.

Rámeček má na spodní straně navíc otvor pro napájení.

Přední desku z plexiskla jsem také objednal online. Jedná se o WN770 opál Milchglasoptik LD45% velikost: 567x344x2mm

Má průsvitnost 45%.

Spojení všech částí dohromady do rámu.

Na konci budou na zadní straně přišroubovány některé pásy, aby bylo vše pevné a nemohlo vypadnout.

Abych měl možnost provozovat pixelWall bez jakékoli WLAN komunikace, vytvořil jsem zásuvný ovládací panel, který lze volitelně vložit na pravou stranu rámce (v projektu github se nazývá „Bedieneinheit“).

Krok 3: Software - základy

Jedním z případů použití je hraní her na PixelWall.

Ale psaní pixelové hry bude vždy potřebovat užitečné prostředí pro ladění. Nevím, jak vhodným způsobem odladit ovladač ESP8266. Rozhodl jsem se tedy celý kód simulovat na svém PC. Kód ESP je napsán v Arduino C ++, takže jsem pro simulaci na PC použil jazyk Visual Studio C ++/CLI. Mezi standardním jazykem C ++ a jazykem C ++/CLI existují určité rozdíly. Například v C ++/CLI nemůžete vytvořit objekt typu String, kvůli uvolňování paměti není povoleno vytvořit objekt nebo odkaz/ukazatel na takový objekt. V C ++/CLI musíte použít úchyty: String^. Ale takové rukojeti ve standardu C ++ neexistují. Musel jsem tedy být kreativní, abych spojil oba světy. Vyřešil jsem to vytvořením vlastního souboru Arduino.h pro simulaci. Tento soubor v simulaci přepíše všechny řetězce definovaným "#define String String^". Toto není běžný způsob, ale funguje to:) Kromě některých malých přepínačů kompilátoru je veškerý kód ESP než kompilovatelný v aplikaci Visual Studio C ++/CLI.

LED matice

První třída, kterou jsem napsal, je třída LED-Matrix. Tato třída se zabývá ovládáním a mapováním LED diod WS2812.

Tato třída byla napsána dvakrát: jednou pro řadič ESP8266 (LEDMatrixArduino.cpp) a další, která bude ovládat tvary ve formuláři GUI v simulaci (LEDMatrixGUI.cpp).

Tato třída poskytuje několik základních metod pro nastavení a vymazání jednotlivých LED diod podle sloupců a řádků.

Navíc poskytuje funkci setBrightness. Tato hodnota bude zohledněna, pokud bude nastavena LED. Všechny příkazy nastavené pomocí LED lze tedy provádět s plným jasem. Například: Pokud je jas nastaven na 50% a funkce setLed () je volána pomocí RGBColor (255, 255, 255), nastaví LED na 127, 127, 127.

LED panel

Na třídu LED Matrix jsem umístil třídu LED Panel. Tato třída poskytuje některé užitečné funkce pro jakoukoli aplikaci. Poskytuje dvě nezávislé vrstvy. To může být pro aplikaci užitečné. Například ve hře tetris: vrstva0 je pro pevné kameny na dně a vrstva1 má zobrazovat padající kámen. Takže při každém cyklu kámen klesne o jeden pixel dolů, aplikace může pouze vymazat vrstvu1 a nakreslit kámen na nové místo. Není nutné překreslovat všechny pevné kameny na dně.

Panel navíc poskytuje

printImage - k vytištění některých ikon, jako jsou smajlíky nebo symbol WLAN Digitální tisk - k vytištění jedné číslice na konkrétní poziciprintFormatedNumber - k vytištění čísla s předponami zerosprintNumber - k tisku celého čísla numberprintLineH - vodorovná čára se specifickou délkouprintLineV - vodorovná čára se specifickou délkou

Krok 4: Software - koncept aplikace

Obecný koncept pixelové zdi je:

• Každá aplikace má svůj vlastní název
• Aplikaci spustíte zavoláním adresy URL pixelové zdi včetně názvu aplikace (například: 192.168.4.1/tetris)
• Adresa URL může mít také parametry GET, které budou předány aplikaci
• Každá aplikace musí dodat webovou stránku, která se zobrazí v prohlížeči.
• Tento web může volitelně otevřít připojení websocket k aplikaci pro rychlé interakce
• Aplikace může pomocí tohoto připojení websocket komunikovat zpět na webové rozhraní.
• Kromě webového rozhraní aplikace navíc získává události z ovládacího panelu a řadiče NES.

Rozhraní aplikace

Aby byl vývoj nových aplikací pro PixelWall snadný, vytvořil jsem rozhraní pro aplikace s názvem „IPixelApp.h“. Toto rozhraní obsahuje 8 definic:

• virtuální prázdný start () = 0;
• virtuální prázdný konec () = 0;
• virtuální prázdná smyčka () = 0;
• virtual void newWebsocketData (uint8_t * užitečné zatížení, délka size_t) = 0;
• virtuální WebsiteResponse_t getWebsiteResponse (parametr String) = 0;
• virtuální prázdné tlačítkoEvent () = 0;
• virtual void timerTick () = 0;
• virtuální řetězec getName () = 0;

start / end - tato funkce se nazývá, pokud se aplikace spustí / ukončí, protože se spustí jiná aplikace

loop - tato funkce je volána z hlavní smyčky hlavního programu. Toto volání je nepravidelné a probíhá bez přerušení.

newWebsocketData - tato funkce se nazývá, pokud webový server odeslal data.

getWebsiteResponse - toto používá hlavní program k získání webové stránky, která by měla na požadavek reagovat.

buttonEvent - toto se nazývá, pokud bylo stisknuto nebo uvolněno jakékoli tlačítko na ovládacím panelu.

timerTick - tato funkce se nazývá každých 10 ms, spustí se přerušením časovače. Může být použit pro časovou základnu, ale nesmí obsahovat žádné časově náročné věci, protože je to kontext přerušení.

getName - to by mělo vrátit název aplikace pro URL

Krok 5: Software - Aplikace

V aktuální verzi je implementováno následujících 7 aplikací:

Výchozí aplikace

Toto je speciální aplikace, která zobrazuje aktuální stav sítě WLAN v zařízení PixelWall. Pokud se zeď dokáže připojit k současné síti WLAN, zobrazí adresu IP, kterou získala ze sítě.

Pokud to nebylo možné (nemá nastavený ssid nebo WLAN není k dispozici nebo je heslo nesprávné), otevře přístupový bod. V tomto případě se můžete k PixelWall připojit pomocí výchozí IP přístupového bodu z ESP8266: 192.168.4.1

Na Webinterface tato aplikace představuje 6 tlačítek. Stisknutím tlačítka můžete spustit příslušnou aplikaci.

Nastavení App

Tato aplikace pro nastavení SSID a hesla WLAN. Stačí zadat přihlašovací údaje vaší WLAN a při příštím spuštění PixelWill se pokusí připojit k této WLAN.

Hry

V PixelWall jsou naprogramovány tři klasické hry:

• Tetris
• Had
• Vesmírní vetřelci

Všechny hry lze hrát prostřednictvím webového rozhraní nebo pomocí ovladače NES.

Image App

Toto je aplikace, která zobrazuje barvy na PixelWall. Můžete si vybrat, zda to má být pohybující se duha, vyblednutí různých barev, zobrazování statické barvy nebo jen zobrazení náhodných barevných pixelů.

Pixel It

Pomocí této aplikace můžete nastavit každý pixel samostatně klepnutím prstem na webové rozhraní. Můžete tedy namalovat pár drobných obrázků:)

Krok 6: Ovládání pomocí rozšíření Twitch

Na Twitchi je rozšíření s názvem GetInTouch. Toto rozšíření umožňuje integrovat projekty Arduino do vašeho přímého přenosu, takže diváci mohou vaše arduino ovládat během streamování.

Knihovna Arduino je napsána pro Arduinos. Ukázalo se však, že běží také na ESP8266.

Chcete -li jej použít ve streamu, jsou nutné následující kroky:

• Integrujte knihovnu GetInTouch do kódu (viz návod)
• Propojte pixelWall s počítačem pomocí převaděče USB/RS232 (který se také používá pro flashování ESP)
• Nainstalujte si aplikaci GetInTouch z webových stránek
• Nainstalujte si rozšíření GetInTouch na svůj kanál Twitch (viz návod)

Krok 7: Ovládání ovladačem Nintendo NES

Po chvíli používání se ukázalo, že hraní na dotykovém mobilním telefonu není tak snadné. Čas od času vám tlačítka chybí, protože na prst nemáte žádnou zpětnou vazbu, ať už jste přes tlačítko nebo ne. Navíc někdy může komunikace Websocket na krátkou dobu uniknout.

Proto jsem se rozhodl koupit starý ovladač Nintendo NES. Tento ovladač má velmi jednoduché rozhraní. Je to jen posuvný registr 4021, který běží na 3, 3V. Lze jej tedy připojit přímo k ESP8266.

Všechny události tlačítek na ovladači byly předány spuštěné aplikaci prostřednictvím funkce buttonEvent ().