はじめまして、makershipの中の人”天翔”です。これは訳あってM5Stackをいじることになったというお話です。先日こんな会話がありました。
「しゃちょー、千石電商でM5Stackっていうもの見つけたんですが、なんですかあれ？」
「あー、あれね。エモいよ。」
「！？」
「センサーとかlcdとか何でもついてていろいろできる」
「なにそれほしい」
「面白いもの作るなら買ってあげるよー」
「やったー(۶•̀ᴗ•́)۶」
というわけで届きましたM5Stack
「…」
「……」
「………」
「かわいい……！！」
確かにこれはエモい…！
早速世界に挨拶させときます。
ふぅ～、満足したし押し入れに入れとこ(積み基盤++;)
おわり。
…
という訳にはいかず、自分には何か面白いものを作るという使命があります
しかしまだM5Stackがどういったものなのか慣れていないので手始めにオセロを作ることにしました。
以下にソースコード置いときます。(もりもり書いたので結構ひどいコードになってます。M5Stackの動作確認くらいのつもりでいてね)
https://github.com/TTtensan/M5StackMiniOthello
早速しゃちょーとプレイ
ついに決着！………というときに
「ブチッ」
「……」
「しゃちょー、電源切りました？」
「いや切ってないけど」
バッテリーが切れたみたいです。なんか勝ってた気がするんですが勝敗をうやむやにされました。
そんなこんなで手始めに作成した”M5StackMiniOthello”
M5Stack買った人はインストールして楽しんでみてねー
—–以下はオセロのプログラムの内容やM5Stackの動作がどういったものなのか知りたい人向けの内容です—–
オセロは意外とアルゴリズム部分が面倒くさく、手間取りました。なのでプログラムの大まかな解説を入れたいと思います。
<オセロのルール>
今までそんなにルールを意識することなくプレイしてきたオセロ。ここで明確に文章化しておきます。
<操作>
次に操作やUIについて検討していきます。
M5Stackはボタンが3つのみ。上下左右に移動するのは難しそうです。なのでA(左)ボタンで下、C(右)ボタンで右、C(中)ボタンで決定(オセロを設置)といった感じにしたいと思います。
オセロは8×8のマスでやるのがルールですが8×8だとM5Stackの画面で表示すると小さく、プレイ時間も長くなってしまうので気軽にできるということを意識して6×6に調整しました。
挙動に関しては置けない場所に設置しようとしたら一瞬赤丸にして知らせます。そして現在地が分かりやすいように現在地を黄色の枠で囲んで、仮のオセロ(白線、黒線のオセロ)を表示させています。またskipボタンも忘れずに追加しておきます。(最後に盤面にすべて置き終わる || skipが自分と相手の2連続で押された)ときにゲーム結果を表示します。
↑ゲーム結果の表示
<描画>
M5StackはM5Stack専用のライブラリを用いることでLcdに様々な図形や文字を描画することができるようです。
碁盤は緑の四角形に格子状の線を描画することによって作成します。オセロはシンプルに白丸、黒丸で表すことができます。
自分はここでつまずいてしまったんですがいろいろ描画命令を出したあとにM5.update();によって画面を更新してやる必要があります。こうしないと丸を書いてるはずなのに反映されない！といったことが起こります。
そして描画するときのちょっとしたコツなんですが多くの場所を描画し直したりすると画面がチカチカしてしまうようです。今回の場合盤面全体を描画し直すとチカチカしました。これを防ぐために仮のオセロ(白線、黒線のオセロ)を移動する際には移動元のマスのみ緑色で上書きしてやるなどといった工夫を施しました。
そして色は16bitで指定してやる必要があります。自分はこのサイトを利用しました。実際の色見本が見れるので非常に便利です。
http://hello.lumiere-couleur.com/app/16bit-colorpicker/
<オセロが置けるかどうかの判定>
この動作に関してはやや難しいので一つの項目として紹介します。
オセロが置けないのはどういったときだろうと考えると以下の2つが挙げられます。
・既存のオセロとかぶってしまう時
・オセロが1つもひっくり返せない時
つまりオセロのルールです。既存のオセロとかぶっているかどうかの判定は<その他>で述べてある配列の中身を調べればすぐに分かります。しかしオセロが1つもひっくり返せないかどうかは上下左右、右上、右下、左上、左下の8方向をきちんと調査する必要があります。これは調べる方向に相手のオセロがあるか、また相手のオセロを挟んだ先に自分のオセロがあるか(相手のオセロだけだとひっくり返せない)という条件で判別します。
<その他>
盤面の状態は6×6の二次元配列を用意して対応させています。 0:何も置かれていない、1:白、2:黒といった感じに設定します。 こうすることでゲーム結果を調べる際にfor文で回してswitch-case文でパターンに分けてオセロの個数に加算してあげるだけなんで楽です。
以上がM5StackMiniOthelloの全体像です。オセロをプログラムで作ってみたいなーなどと考えている人に参考にしていただけると非常に嬉しいです。
どうやらこのM5Stack、LCDモニターに加え、SDカードスロット、ボタン、wifi、bluetooth、スピーカー、バッテリー、各種pinを備えた何でもできるすごいやつみたい
次は何つくろう