[お題にTRY] Canvas三目並べ #3日目

Pocket
LINEで送る
GREE にシェア
LinkedIn にシェア

こんにちわ。
 

朝はパンだけど、本当は卵ご飯が大好きな、下駄です。
 

canvasについて、ネットで調べていると、unityの記事ばかりに引っかかります。
 

どんなスマホでも動くという、アプリ開発のunityは、canvasでのGUI処理をするライブラリなんですかね?
 

こんどちゃんと使ってみないと、細かなことはわかりませんが、検索結果から、世の中でのニーズが伺えます。

本日のIT謎掛け

「unity」と、かけまして、
 

「今どきの低燃費車」と、ときます。
 

そのココロは・・・
 

ハイブリッドが売りです。

コンピュータ処理

前回クリック対応して○印を表示することができたので、今回はまず、コンピュータ側の×マークを表示して、
 

ユーザーがクリックした次の手をコンピュータが打つという感じで交互に表示をしてみたいと思います。
 

この際に、まだ勝ち負けの思考アルゴリズムは入れずに表示とフローだけに絞るので、まだ完成ではありません。
 

※今回もindex.htmlは前回から変更はありません。

 

 

解説

ユーザー(先手)、コンピュータ側(後手)、ということで、ユーザーがクリックしたら、すぐにコンピュータが入力する仕様にしてみました。
 

打った手は、this.buffer(配列)に、打った順に登録していっているので、奇数を「○」、偶数を「×」として表示するようにします。
 

表示する記号の「○」はcanvasのcircleで書きますが、「×」は線を二本書くので、全く形状と座標が違うため、別関数にして処理するようにしました。
 

ここでの座標もベタ処理をしているので、今後のリファクタリングで、効率改善したいと思います。
 

クリックして、コンピュータ表示もできて、あとは、アルゴリズムだけかな・・・と思ったんですが、
 

コンピュータがあまりに早い対応をするので、ゲームをしている感覚にならないため、コンピュータの考える時間を演出する必要があると感じましたね。
 

やっぱりゲームをするっていうのは、こういう感情コントロールが重要だとよく分かりました!

Leave a Reply

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です