このプロジェクトについて

初心者の方は、Arduino-ボタンチュートリアルでボタンについて学ぶことができます。

ここでは、より単純なハードウェア（PHPoCのみ）を使用して同様のプロジェクトを作成しました。

デモ

データフロー

Arduino ---> PHPoCWiFiシールド---> Webブラウザ

ゲームをしているのは2人です。各人は2つのボタンを使用してゴールキーパーの方向を制御します。したがって、4つのボタンが必要です。

Arduinoは4つのボタンの状態を読み取ります。いずれかが変更された場合、Arduinoはゴールキーパーの移動方向を再計算し、方向の値をPHPoCWiFiシールドに送信します。値を受信すると、PHPoC WiFiShieldはそれをwebsocket経由でWebブラウザーに送信します。 JavaScript関数は、ゴールキーパーの移動方向を更新します。

JavaScriptプログラムは、ボール、ゴールキーパー、障害物の位置を方向に基づいて継続的に更新し、衝突もチェックします。

ゴールキーパーの方向は、ボタンの状態に基づいて変更されます。

注意： PHPoCシールドには、ArduinoからWebブラウザにデータを渡すための組み込みプログラムがあります。したがって、気にする必要はありません。

私たちがしなければならないこと

• PHPoCシールドのWiFi情報（SSIDとパスワード）を設定します
• 新しいUIをPHPoCシールドにアップロードする
• Arduinoコードを書く

PHPoCシールドのWiFi情報の設定

この手順を参照してください。

新しいWebUIをPHPoCシールドにアップロードする

• PHPoCソースコードremote_game.phpをダウンロードします（コードセクションにあります）。
• この手順に従って、PHPoCデバッガーを使用してPHPoCシールドにアップロードします。

PHPoC Shieldは、WebブラウザからHTTPリクエストを受信すると、このファイルのPHPスクリプトを解釈し、解釈されたファイルをWebブラウザに送信します。解釈されたファイル（HTML、CSS、JavaScriptコードを含む）はUI（ユーザーインターフェイス）を提供し、ボール、ゴールキーパー、障害物の方向に基づいて位置を更新し、衝突もチェックします。また、WebSocketからゴールキーパーの移動方向を受け取ります。

Arduinoコードを書く

• Arduino用のPHPoCライブラリをインストールします（手順を参照）。
• Arduinoコード（コードセクション）をArduinoにアップロードする

テスト

• Arduino IDEのシリアルボタンをクリックして、IPアドレスを確認します。
• Webブラウザを開き、 http：// と入力します replace_ip_address /remote_game.php
• 接続ボタンをクリックしてテストします

初心者のための最高のArduinoスターターキット

初心者向けの最高のArduinoキットをご覧ください

関数リファレンス

• pinMode（）
• digitalRead（）
• Serial.begin（）
• Serial.print（）
• Serial.println（）

コード

• Arduinoコード
• PHPoCシールドコード（remote_game.php）

Arduinoコード Arduino

 #include "SPI.h" #include "Phpoc.h" PhpocServer server（80）; boolean previousConnected =false; void setup（）{Serial.begin（9600）; while（！Serial）; Phpoc.begin（PF_LOG_SPI | PF_LOG_NET）; server.beginWebSocket（ "game"）; Serial.print（ "WebSocketサーバーアドレス："）; Serial.println（Phpoc.localIP（））; pinMode（6、INPUT）; pinMode（7、INPUT）; pinMode（8、INPUT）; pinMode（9、INPUT）; } int value_6 =digitalRead（6）; int value_7 =digitalRead（7）; int value_8 =digitalRead（8）; int value_9 =digitalRead（9）; int pre_dir_1 =0; int pre_dir_2 =0; int dir_1 =0; int dir_2 =0; void loop（）{//クライアントが最初のバイトを送信するとき、たとえばhello：PhpocClient client =server.available（）; if（client）{value_6 =digitalRead（6）; value_7 =digitalRead（7）; value_8 =digitalRead（8）; value_9 =digitalRead（9）; dir_1 =value_7-value_6; dir_2 =value_9-value_8; if（dir_1！=pre_dir_1 || dir_2！=pre_dir_2）{pre_dir_1 =dir_1; pre_dir_2 =dir_2; String txtMsg ="[" + String（dir_1）+ "、" + String（dir_2）+ "] \ r \ n"; char buf [txtMsg.length（）+ 1]; txtMsg.toCharArray（buf、txtMsg.length（）+ 1）; server.write（buf、txtMsg.length（））; }}} 

PHPoCシールドコード（remote_game.php） PHP

 <！DOCTYPE html>          

 
 PHPoC-Webベースのゲーム
 

   
 

 WebSocket： null  
 接続 
    

回路図