# ロボホン・コントローラの開発方法
###### tags: `研究` `ロボホン` `RoBoHoN`

## ロボホン・コントローラとは

運転支援の研究プロジェクト向けに[株式会社マックシステムズ](https://www.macsystems.co.jp/)が開発したコマンド受信アプリを利用して，スマホをコントローラとしてロボホンを操作するための方法を解説します．コマンド受信アプリは，ロボホンの動作・発話を制御するためのAndroid用のアプリで，ロボホンにインストールして利用します（「運転支援」と表示されているアプリ）．

[](https://gyazo.com/390333422498e7933992b26ead738dff)

システム全体のフレームワークを示します．ロボホンには，コマンド受信アプリをインストールして，「/Download」フォルダに，commands.xmlとconfig.xmlを配置します．また，スマートフォン（Android，iPhone）には，[Monaca](https://ja.monaca.io/)で開発したロボホン・コントローラをインストールします．このとき，commands.xmlの内容に合わせて，comments.jsを修正した上で，アプリをビルドします．スマートフォンとロボホンとの通信はTCP/IPのソケット通信が用いられます．ユーザは，スマートフォンから特定の番号を送信し，ロボホンは受信した番号に対応する発話とモーションを実行します．

[](https://gyazo.com/c42b341a64ec011a063a923146cf0f0d)

## ロボホンの設定

1. ロボホンにコマンド受信アプリをインストール（インストール済，企業が開発したアプリのため公開・配布は禁止）
2. ロボホンをUSB Type-B ケーブルでPCに接続
3. [commands.xml](https://drive.google.com/file/d/1SQ2AcxjLguymImMU0NLGoBflh3GJ5JZr/view?usp=sharing)と[config.xml](https://drive.google.com/file/d/1SSGSNPt5LlMOrkWIxY7yQT8CpVH8VsVj/view?usp=sharing)をダウンロード
4. commands.xmlをエディタ（[Atom](https://atom.io/)など）で開き，発話とメッセージのペアを列挙
5. ロボホンの/Downloadフォルダにcommands.xmlとconfig.xmlをコピー

### commands.xmlの設定

下記はcommands.xmlのサンプルです．commandタグを利用して発話とモーションを指定します．このとき，id属性は1から始まる整数とし，motion属性は対応する[モーションの番号](https://hackmd.io/pFEBbvAuQqKpdKGvRGjviw)を指定します．発話内容は，漢字だと正しく発音されない可能性があるため，適宜，ひらがな，カタカナ，スペースを組み合わせて記述してください．

<?xml version="1.0" encoding="utf-8"?>
<robohonCommands>
	<description>ロボナビの設定</description>
	<commands>
		<command id="1" motion="060000">ここは「旧 豊田佐助邸」だよ</command>
		<command id="2" motion="060001">ここは「文化の道 二葉館」だよ</command>
		<command id="3" motion="060002">ここは「徳川園」だよ</command>
	</commands>
</robohonCommands>

### config.xmlの設定

下記はconfig.xmlのサンプルです．基本的に修正の必要はありません．

<?xml version="1.0" encoding="utf-8"?>
<robohonConfig>
	<description>コマンド受信アプリの動作設定</description>
	<port>10023</port>
	<commandOverriding>false</commandOverriding>
	<preventPause>true</preventPause>
</robohonConfig>

## ロボホン・コントローラの設定

### カスタムビルドデバッガーのビルド

事前に[Monaca](https://ja.monaca.io/)のアカウントを作成してください．スマートフォンでアプリを実行するためのデバッガーをビルドします（iOSの場合は[プロビジョニングファイル](https://rightcode.co.jp/blog/become-engineer/ios-application-development-recap-creation-provisioning-profile)が必要）．

1. Monacaでプロジェクト（[source_robohon-controller-ver01.zip](https://drive.google.com/file/d/1SezLxY7SCjgSugSBHfTvPh27Z3AGe6Y7/view?usp=sharing)）をインポート（向が独自に開発したアプリであるため自由に変更可）
2. インポートしたプロジェクトをクラウドIDEで開く
3. ソケット通信のためのプラグインである[sockets-for-cordova.zip](https://drive.google.com/file/d/1Sgz_BZtsWoNE035TcfUXAtWLcfJE7eau/view?usp=sharing)をダウンロード
4. 【設定】-【Cordovaプラグインの管理】を選択し，ダウンロードしたプラグインをインポート
5. 【ビルド】-【カスタムビルドデバッガー】をビルドし，スマートフォン（Android，iPhone）にインストール
6. カスタムビルドデバッガーを起動し，アプリの実行を確認

### comments.jsの設定

下記はcomments.jsのサンプルです．ロボホンにコピーしたcommands.xmlに合わせて，id，speech，motionを指定します．

const comment_list = [
  {
    id: "1",
    speech: "ここは「旧 豊田佐助邸」だよ",
    motion: "60000"
  },
  {
    id: "2",
    speech: "ここは「文化の道 二葉館」だよ",
    motion: "60001"
  },
  {
    id: "3",
    speech: "ここは「徳川園」だよ",
    motion: "60002"
  }
]

export { comment_list }

## 実行方法

ロボホンとスマートフォンは同じネットワーク（LAN）に存在している必要があります．

1. コマンド受信アプリを起動し，IPアドレスとポート番号を確認する（ここでは，IPアドレスは192.168.12.13，ポート番号は10023）
2. ロボホン・コントローラを起動し，IPアドレスとポート番号を設定
3. Connectionのスイッチをオン
4. 発話を選択して送信ボタンをタップ

[](https://gyazo.com/468d219136d610683eac851c2944276d)

[](https://gyazo.com/26963885ace36d3876ebe239f362b092)

## デモ

スマホで選択した発話・モーションがロボホンで実行されることが確認できます．

<iframe width="560" height="315" src="https://www.youtube.com/embed/xLZhcu8Qwec" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>