PixelWall: 7 Langkah (dengan Gambar)

2024 Pengarang: John Day | [email protected]. Diubah suai terakhir: 2024-01-30 11:09

Adakah anda tahu projek Pixel-Table? Saya mempunyai idea untuk mewujudkan sesuatu yang seperti piksel, tetapi bukan sebagai meja, sebaliknya untuk meletakkannya di dinding.

Supaya saya boleh berbaring di sofa dan bermain beberapa permainan di atasnya sambil berehat.:)

Permainan yang dilaksanakan adalah:

• Tetris
• Penceroboh Angkasa
• Ular
• Cabutan Pixel

fungsi tambahan adalah:

• Tunjukkan masa semasa
• Tunjukkan animasi warna

PixelWall mempunyai ESP8266 sehingga boleh menyambung ke WLAN rumah saya. Tetapi juga mungkin menggunakan PixelWall sebagai titik akses dan menyambung terus ke sana.

Untuk mempermudah penggunaan PixelWall saya, dinding memberikan laman web untuk dikawal setelah disambungkan. Semua Aplikasi dikawal / dimainkan melalui laman web. Oleh itu, tidak perlu memasang perisian untuk penggunaan.

Selain itu terdapat pengawal NES yang memudahkan permainan ini.

Sumber terbuka

Semua perisian dan lukisan mekanikal yang saya pakai di github: https://github.com/C3MA/PixelWallFeel bebas menggunakannya untuk projek anda sendiri.

Langkah 1: Bermula dengan Elektronik

Dari projek lain terdapat PCB yang ada dengan LED WS2812. PCB mempunyai 3 baris dengan 12 LED setiap baris.

Saya memutuskan untuk menggunakan PCB ini sebanyak 6 kali. Oleh itu, saya mendapat matriks LED 12x18.

Langkah pertama adalah menyolder semua 216 LED, sekitar 100 kapasitor dan ESP8266.

Pematerian secara manual memerlukan kira-kira 10 jam.

Selepas ujian cepat pertama, kami tahu: semuanya berjalan lancar.

Oleh itu, kita boleh pergi ke bahagian mekanik.

Langkah 2: Membuat Mekanik

Pertama sekali kita memerlukan sepater untuk setiap piksel. Ideanya adalah untuk menyatukan jalur mendatar dan menegak melalui potongan V bersama-sama.

Setiap jalur mempunyai ketebalan 3mm dan tinggi 17mm. Mereka dipotong dari plat HDF dengan laser.

Semua lakaran laser dilukis dalam FreeCad (bernama "Leiste" di folder mekanik projek github)

Grid diberikan oleh Tata Letak PCB. Ia mempunyai lebar lajur 28mm dan tinggi baris 31mm.

Soalan seterusnya ialah: Bagaimana memperbaiki jalur pada PCB? Perekat bukanlah idea yang baik, kerana mungkin untuk membongkar jika ada yang cacat. Oleh itu, saya memutuskan untuk mengacaukannya. Tetapi skru akan memecahkan jalur nipis 3mm. Oleh itu, saya mencetak dengan pencetak 3D poket untuk band (ini adalah bahagian bernama "Halter" dalam projek github). Ini berfungsi dengan baik untuk memperbaikinya di PCB.

Langkah seterusnya adalah mendapatkan bingkai untuknya. Terdapat beberapa kedai dalam talian yang menawarkan untuk memotong bingkai gambar individu. Oleh itu, saya memesan bingkai dengan ukuran 343mm x 565mm.

Rangka mendapat lubang tambahan di bahagian bawah untuk bekalan kuasa.

Plat depan plexiglas juga saya pesan dalam talian. Ia adalah opsyen WN770 Milchglasoptik LD45% saiz: 567x344x2mm

Ia mempunyai lut sinar 45%.

Menyatukan semua bahagian ke dalam bingkai.

Pada hujungnya akan terdapat beberapa jalur yang dilekatkan ke bahagian belakang, sehingga semuanya tetap dan tidak jatuh.

Untuk mempunyai pilihan untuk pengendalian pixelWall tanpa komunikasi WLAN, saya membuat panel kawalan yang boleh dipasang yang boleh disisipkan secara opsional di sebelah kanan bingkai (disebut "Bedieneinheit" dalam projek github).

Langkah 3: Perisian - Asas

Salah satu kes penggunaan adalah bermain permainan di PixelWall.

Tetapi menulis permainan piksel akan selalu memerlukan persekitaran penyahpepijatan yang berguna. Saya tidak tahu cara untuk menyahpepijat pengawal ESP8266 dengan cara yang sesuai. Oleh itu, saya memutuskan untuk mensimulasikan keseluruhan kod pada PC saya. Kod ESP ditulis dalam bahasa Arduino C ++, jadi saya menggunakan bahasa Visual Studio C ++ / CLI untuk simulasi di PC. Terdapat beberapa perbezaan antara bahasa C ++ standard dan bahasa C ++ / CLI. Contohnya di C ++ / CLI anda tidak dapat membuat objek jenis String, kerana pengumpulan sampah tidak dibenarkan membuat objek atau rujukan / penunjuk ke objek tersebut. Dalam C ++ / CLI anda mesti menggunakan pemegang: String ^. Tetapi pegangan seperti itu tidak wujud dalam standard C ++. Oleh itu, saya harus kreatif untuk menyatukan kedua-dua dunia. Saya menyelesaikannya dengan membuat fail Arduino.h sendiri untuk simulasi. Fail ini hanya menimpa simulasi semua rentetan melalui menentukan "#define String String ^". Ini bukan cara biasa, tetapi ia berfungsi:) Kecuali untuk beberapa pengubah kompilator kecil, semua kod ESP adalah daripada disusun dalam Visual Studio C ++ / CLI.

Matrik LED

Kelas pertama yang saya tulis ialah kelas LED-Matrix. Kelas ini mengendalikan kawalan dan pemetaan LED WS2812.

Kelas ini ditulis dua kali: sekali untuk pengawal ESP8266 (LEDMatrixArduino.cpp) dan kelas lain yang akan mengawal bentuk pada Form GUI dalam simulasi (LEDMatrixGUI.cpp).

Kelas ini menyediakan beberapa kaedah asas untuk menetapkan dan membersihkan LED individu mengikut lajur dan barisnya.

Selain itu ia menyediakan fungsi setBrightness. Nilai ini akan dipertimbangkan jika LED akan ditetapkan. Oleh itu, semua arahan set LED dapat dilakukan dengan kecerahan penuh. Contohnya: Jika kecerahan ditetapkan ke 50% dan fungsi setLed () dipanggil dengan RGBColor (255, 255, 255), ia akan menetapkan LED ke 127, 127, 127.

Panel LED

Di atas kelas Matrik LED saya meletakkan kelas Panel LED. Kelas ini menyediakan beberapa fungsi yang berguna untuk sebarang aplikasi. Ia menyediakan dua lapisan tidak bergantung. Ini boleh membantu aplikasi. Contohnya pada permainan tetris: layer0 adalah untuk batu-batu tetap di bahagian bawah dan layer1 adalah untuk menunjukkan batu yang jatuh. Oleh itu, setiap kitaran batu jatuh satu piksel ke bawah, aplikasi hanya dapat membersihkan lapisan1 dan menarik batu pada kedudukan barunya. Tidak perlu melukis semula semua batu tetap di bahagian bawah.

Selain itu panel menyediakan

printImage - untuk mencetak beberapa ikon seperti smiley atau simbol WLANDigit - untuk mencetak satu digit pada kedudukan kedudukan tertentuFormatedNumber - untuk mencetak nombor dengan awalan zerosprintNumber - untuk mencetak bilangan bilangan bulatLineH - garis mendatar dengan panjang panjang tertentuLineV - garis mendatar dengan panjang tertentu

Langkah 4: Perisian - Konsep Aplikasi

Konsep umum untuk Dinding piksel adalah:

• Setiap aplikasi mempunyai namanya sendiri
• Aplikasi dimulakan dengan memanggil URL pixelWall termasuk nama aplikasi (contoh: 192.168.4.1/tetris)
• URL juga boleh mempunyai parameter GET yang akan diteruskan ke aplikasi
• Setiap aplikasi harus menyampaikan laman web yang ditampilkan di penyemak imbas.
• Laman web ini secara pilihan dapat membuka sambungan soket web ke aplikasi untuk interaksi pantas
• Aplikasi boleh menggunakan sambungan soket web ini untuk berkomunikasi kembali ke frontend web.
• Di samping antara muka web, aplikasi akan mendapat acara tekan butang dari panel kawalan dan pengawal NES.

Antaramuka Aplikasi

Untuk memudahkan mengembangkan aplikasi baru untuk PixelWall, saya membuat antara muka untuk aplikasi bernama "IPixelApp.h". Antara muka ini mengandungi 8 definisi:

• permulaan kekosongan maya () = 0;
• akhir kekosongan maya () = 0;
• gelung kekosongan maya () = 0;
• void maya newWebsocketData (uint8_t * muatan, ukuran_t panjang) = 0;
• Laman web mayaResponse_t getWebsiteResponse (Parameter rentetan) = 0;
• butang kekosongan mayaEvent () = 0;
• pemasa kekosongan mayaTick () = 0;
• getName String maya () = 0;

start / end - fungsi ini dipanggil jika aplikasi dimulakan / berakhir kerana aplikasi lain dimulakan

gelung - fungsi ini dipanggil dari gelung utama program utama. Panggilan ini tidak teratur dan di luar gangguan.

newWebsocketData - fungsi ini dipanggil jika frontend web menghantar data.

getWebsiteResponse - ini digunakan oleh program utama untuk mendapatkan laman web yang seharusnya sesuai dengan permintaan.

buttonEvent - ini dipanggil jika ada butang pada panel kawalan ditekan atau dilepaskan.

timerTick - fungsi ini dipanggil setiap 10ms, dipicu oleh gangguan pemasa. Ia dapat digunakan untuk jangka waktu tetapi tidak boleh mengandung hal-hal yang intensif waktu, kerana konteksnya mengganggu.

getName - ini akan mengembalikan nama aplikasi untuk URL

Langkah 5: Perisian - Aplikasi

7 aplikasi berikut dilaksanakan dalam versi semasa:

Aplikasi Lalai

Ini adalah App spezial yang memaparkan keadaan WLAN PixelWall semasa. Sekiranya dinding dapat tersambung ke WLAN sekarang, ia akan memaparkan Alamat IP yang diperolehnya dari Rangkaian.

Sekiranya tidak mungkin (tidak ada ssid yang disiapkan atau WLAN tidak ada atau kata laluan salah) ia akan membuka Accesspoint. Dalam kes ini, anda boleh menyambung ke PixelWall melalui IP Accesspoint lalai dari ESP8266: 192.168.4.1

Di Webinterface Aplikasi ini menyajikan 6 Butang. Dengan menekan butang anda boleh memulakan Aplikasi yang sesuai.

Aplikasi Tetapan

Aplikasi ini untuk menetapkan SSL dan kata laluan WLAN. Cukup masukkan bukti kelayakan WLAN anda dan pada permulaan Pixel seterusnya, ia akan cuba menyambung ke WLAN ini.

Permainan

Terdapat tiga permainan klasik yang diprogramkan di PixelWall:

• Tetris
• Ular
• Penceroboh Angkasa

Semua permainan boleh dimainkan melalui antara muka web atau dengan pengawal NES.

Aplikasi Imej

Ini adalah Aplikasi yang memaparkan warna pada PixelWall. Anda boleh memilih sama ada pelangi bergerak, memudar warna yang berbeza, menunjukkan warna statik atau hanya memaparkan piksel berwarna rawak.

Pixel It

Dengan Aplikasi ini anda dapat mengatur setiap piksel secara terpisah dengan mengetuk dengan jari anda di Webinterface. Oleh itu, anda boleh melukis beberapa gambar krasi:)

Langkah 6: Kawal Melalui Peluang Twitch

Terdapat Extension on Twitch bernama GetInTouch. Pelanjutan ini memungkinkan untuk mengintegrasikan projek Arduino ke dalam siaran langsung anda, sehingga penonton dapat mengawal arduino anda semasa streaming.

Perpustakaan Arduino untuk ini ditulis untuk Arduinos. Tetapi ternyata ia juga berjalan pada ESP8266.

Untuk menggunakannya dalam Aliran, langkah-langkah berikut tidak perlu:

• Gabungkan perpustakaan GetInTouch ke dalam kod (lihat tutorial)
• Sambungkan pixelWall dengan PC anda melalui penukar USB / RS232 (yang juga digunakan untuk memancarkan ESP)
• Pasang Aplikasi GetInTouch dari Laman Web
• Pasang Ekstensi GetInTouch pada saluran Twitch anda (lihat tutorial)

Langkah 7: Kawalan oleh Nintendo NES Controller

Setelah menggunakannya sebentar, ternyata, bermain di telefon bimbit sentuh tidak begitu mudah. Dari masa ke masa anda terlepas butang kerana anda tidak mempunyai maklum balas di jari anda sama ada anda menggunakan butang atau tidak. Selain itu kadang-kadang komunikasi Websocket boleh bocor untuk waktu yang singkat.

Oleh itu, saya memutuskan untuk membeli alat kawalan lama Nintendo NES. Pengawal ini mempunyai antara muka yang sangat mudah. Ia hanya daftar shift 4021 yang berjalan dengan 3, 3V. Oleh itu, ia boleh dihubungkan terus ke ESP8266.

Semua peristiwa butang pada pengawal di mana diteruskan ke aplikasi yang sedang berjalan melalui fungsi buttonEvent ().