フルカラー＆マイコン内蔵のLED、NeoPixelのパネルを使ってドット絵を表示するプログラムを作ってみました。
将来的に子どもたちができるようになると嬉しいのでmicro:bitを使いました。
NeoPixelとは？
NeoPixel、言わずと知れたフルカラー＆マイコン内蔵のLED。
各種プログラミングボードから簡単に操作ができます。
メジャーなのはテープ形状でレインボーに光らせて首に巻いたりします。
NeoPixelのLEDパネルを使いたい！
そのNeoPixelを16x16のマス目状に並べた製品が販売されています。
今回はそれを使い、
ちょっと使いにくいところ
実はこの16x16の配列、なかなかに使いづらい形で並んでいる。
配線をご覧ください。
おわかりでしょうか？
そう、16x16＝256個のLEDがジグザグに並んでいるんです！
じ、ジグザグなんです！！！！(泣怒)
結構探しましたが、すべての製品がジグザグスタイル。
しかも最初のLEDは1行目の右端からスタート。
おいおいおい。
というわけでこの並びを考慮する必要があります。
基本方針
ドット絵データ：ドット絵をジグザグさせた状態のデータを作成
プログラミング側：ドット絵データがすでにジグザグ化しているのでそのまま順番通り光らせる
今回はデータをジグザグ化することで凌ぐことにしました。
ちょっと敗北感はありますが、気にしない。まずは作りきる。
まずはデータ作成
365日接しているエクセルさんに登場いただきました。
まずは表示させることですからね、データ作成は一旦力技でいきます。
エクセルで16x16のドット絵を描く→色ごとに数を置いていく →行ごとにつなげる → 反転する行は反転する→ 全行を繋いで1つの文字列にする(完成！)
なにごとも学びですね、新しく文字列をつなぐCONCAT関数を知りました！
エクセルのイメージはこんな感じです
DQ発売から37周年ということでまずはスライム。
なお、できたデータはこちら。
ジグザグ化あとのものです。
0000000010000000000000010000000000000000100000000000000100000000000000011100000000000111110000000000111111111000002211111111100000111111111112201211121112111110011112121212111111112121212111100111312111213111111331111133111000111333333311100001111111110000
なお色指定は一旦エクセル側で塗りつぶしてみて、セルの色のRGB値を確認して下記の数字を確定しました。
| 番号 | R(赤) | G(緑) | B(青) |
|---|---|---|---|
| 0 | 0 | 0 | 0 |
| 1 | 0 | 153 | 204 |
| 2 | 255 | 255 | 255 |
| 3 | 221 | 19 | 163 |
ついにコーディング
ドット絵データは文字列変数に入れ、1つずつ読み込み、対応する数字に対応する色を表示するというプログラムにしました。
色指定はIF分のところに書き込んでしまっているので汎用性はありません。
ちょっと横着してしまいましたが、まずは作りきる！(^^;
一応コードは下記から見れるようにしてあります。
とりあえず表示はできた！
はい、めでたく表示することができました。
よかったよかった。
将来の展望
データの受け渡しをスマートに
ドット絵データ → 数字を圧縮展開したりして長くならないようにしたい
パレット(色と数字の対応)データ → IF文に直接手打ちなのでパレットもデータとして持つようにしたい
入れ物・コネクタの検討
入れ物 → ペラペラなのでしっかり固定できる、スモーク入りなどで少しぼやけて見えるようにするとよりドット絵っぽく見えると思うのでやってみる
コネクタ → 現在ジャンパーケーブルで繋いでいるだけなのできっちり固定する方法を模索する
色味の研究
このあとにリンクのドット絵も表示させてみたのですが、エクセル上で作ったイメージで色が正確に表示されず、茶色が黄色で表示されるなどしてしまいます。
おそらくRGBを同じ強さで指定してもきちんと表示されないようです。