はじめに
このページでは、インタラクティブインターフェイスｉＩＦ−１２を動かすサンプルソフトウェアをご紹介します。
このページで使用するFlash関連のドライバソフトウェア等はアイ・ビー株式会社により作成されています。必要なファイルをアイ・ビーが運営するロボットポータルサイト「ろぽたる」から入手する必要があります。これについては下記で詳しく説明します。
※Flashで浅草ギ研製品その他を動かす方のために、ろぽたるにコミュニティを立ち上げました。質問、こんなかっこいいもの作ったよ、という方はそちらへ投稿お願いします。
※以下の情報は2010年4月現在のものです。ご注意ください。
ｉＩＦ−１２についてはこちらを参照願います。
対象読者
本ページを読む読者の方は大きく２つにわけられると思います。１）Flash使い、２）PCプログラマー（もしくはロボットホビースト）。ここで簡単に、FlashでiIF-12を動かす意味合いについてお話します。
＜Flash使いの方＞
浅草ギ研ページに来る方で、Flash使いの方はほどんどいないと思われますが、そのような希少な方々の為に本シリーズを書きました。
FlashではActionScriptの進化により、かなり高度なことができるようになりました。現在ではActionScriptやJAVAを使ってFlashからPC以外のハードウェアを制御することも可能です。しかし、Flashでデザインをされている方の多くはプログラムや、電子工作の経験はあまり無いと思います。そこで、電子工作の必要が無いiIF-12を使い、ActionScriptもほとんどはコピペですむようにサンプルプログラムを豊富に作ることにしました。
これにより、Flash使いの方に、デザインに専念する環境が作れれば、と考えています。
＜プログラマー（ロボットホビースト）の方＞
浅草ギ研では主にMicrosoftの開発環境であるVisualStudioでのプログラミング例をご紹介していましたが、浅草ギ研とお取引のあるアイ・ビー株式会社様がiIF-12用のFlashの開発環境を作りました。ということで、Flashの製作例を始めました。
後で気が付きましたが、アイ・ビー様で作っていただいた環境で、浅草ギ研のロボット神経システム（有線及び無線）も駆動できることがわかったので、機会がありましたらFlashでそれらを動かす作例も作ってみようと考えています。
ａｄｂｅ社のFlashは基本的にはWeb上などのグラフィックやアニメーションを作成するソフトですが、ActionScriptというスクリプト言語によりプログラミング的なこともできるようになっています。ということで、モニタ上のグラフィックやアニメと連動するアプリケーションを作る場合で、非常に凝ったものやカッチョイイものを作る場合はFlashの方が格段に作りやすいかもしれません。
FlashでActionScriptを組む場合の環境は、「Flash」（９万円ぐらい）、「Flex」（３万円ぐらい）、「FlashDevelop」（無償）などがあります。Flashは９万円前後の価格になりますので、Webデザインをされる方以外は持っていないと思われますが、本ページは基本的にWebデザイナー向けに作られていますのでFlashで説明します。
あまりグラフィックやアニメにこだわらないのであれば、別ページでやっているC#のサンプルプログラムのページを参照してC#（Microsoftより無償で入手できる）で書いた方がいいかと思います。また、２０１０年夏ぐらいから、雑誌「ロボコンマガジン」でC#とiIF-12を使ってのプログラムや製作例の記事が連載される予定ですのでそちらもチェックしてください。
Ｆｌｅｘは、Ｗｅｂプログラマーの方がよく使っているようなのですが、筆者が使っていないので説明はしません。
学生などでお金が無い場合は無償のＦｌａｓｈＤｅｖｅｌｏｐがありますが、浅草ギ研は商用サイトなので、オープンな環境をサポートしつづけるのは難しいので、こちらでは説明致しません。
ということで、大前提で、本ページより後の作例と同じことをやるにはＦｌａｓｈの正規版が必要になります。ご了承下さい。
尚、Ｆｌａｓｈは３０日間無償のお試し版もありますので、期間限定であればそれで動かしてみることは可能です。
※２０１０年４月現在で、ＦｌａｓｈのバージョンがＣＳ４−＞ＣＳ５に上がる予定のようで、５月末までお試し版はダウンロードできないようです。このページのプログラムを動かすだけならとりあえずＦｌａｓｈ本体は不要ですが、ソースを見たりはできません。ＣＳ５がリリースされましたらまたこのページの内容を更新する予定です。
Flashでの開発に必要なもの
本ページの内容を実行するにあたり、下記が必要です。ダウンロードや設定その他については次の節からくわしく説明します。
＜ソフトウェア＞
１）USBドライバー ：浅草ギ研のページより無償でダウンロード
２）ＪＡＶＡ ：Java.comより無償でダウンロード
３)Flash Player ：adbe社のページより無償でダウンロード
４）Ｆｌａｓｈ ： adbe社のページから３０日間お試し版をダウンロード（もしくは正規版を購入）
５）iIF-12_Flash利用サンプルソフト ：ろぽたるのページより無償でダウンロード
＜ハードウェア＞
１）ＰＣ
２）iIF-12
３）USBケーブル（A-miniBタイプ）
１）USBドライバーダウンロード〜iIF-12接続確認
ここから、開発環境の作り方を説明していきます。
まずはiIF-12のUSBドライバの用意と、接続確認をおこなってみます。この手順はiIF-12のページにも書いてありますが、不要な部分もあるので、ここでは必要な部分だけ抜き出してみました。尚、すでにUSBドライバをインストールしている場合はここを飛ばして２）へ行ってください。
まず、下記からUSBドライバをダウンロードしてください。
Windows用ＵＳＢドライバ
（右クリックで対象を保存）
ドライバソフトは圧縮されていますので、あらかじめ解凍しておいて下さい。筆者は、解凍にはフリーのツール、+Lhacaを使っています。たとえば、デスクトップ上に解凍した場合はデスクトップに解凍したフォルダが展開されます。
iIF-12とPCをUSBケーブルでつなぎます。
初めてiIF-12をつなぐ場合は、下記のウィンドウが開きます。（WindowsXPの画面例）
「いいえ、今回は接続しません」を選択して「次へ」を押します。
「一覧または特定の場所からインストールする」を選択して「次へ」を押します。
「次の場所を含める」にチェックをして「参照」ボタンを押します。
先にダウンロードして解凍しておいたフォルダを選択します。一番上位のフォルダの下に同じ名前のフォルダが作られていますので注意してください。下のようにi386フォルダの１つ上のフォルダを選択して「ＯＫ」を押します。（下の写真を参照）
もとのウィンドウに戻りますので「次へ」を押します。
インストールが始まります。
インストールはすぐに終わり、次の画面が出ますので「完了」を押してウィンドウを閉じます。
これでインストールは終了です。インストール後、下のようにインストールされたことが表示されます。ＰＣのＵＳＢの構成によっては、ＵＳＢが２段になっていたりするので、その場合には完了後すぐにもう一度「新しいハードウェアが検出されました」という状態になるので、この節と同じ操作をもう一度します。２回要求されたのに２回目をインストールしないと、ＵＳＢポートの場所によっては認識したりしなかったりする場合がありますので注意してください。
次にＣＯＭポートが実装されたか確認してみます。COMポートはiIFとPCが通信する際のポートで”COM”の文字の後に番号が付きます。この番号を覚えておく必要があります。
WindowsXPでの確認方法を説明します。「スタート」−＞「マイコンピュータ」−＞「システム情報を表示する」 −＞「ハードウェア」タブ−＞「デバイスマネージャー」ボタンを選択するとデバイスマネージャーが開きます。
この中に「ポート（ＣＯＭとＬＰＴ）」というのがありますのでクリックすると、現在のＣＯＭポートの構成が確認できます。
下は私のＰＣ（デスクトップタイプ）の例です。これを見るとＣＯＭ７というのが新しく作られたのがわかります。この状態でＵＳＢを抜くと、このＣＯＭ７が消えますので間違いなく実装されたのがわかります。一度ＣＯＭ７で実装されたら、次回に接続したときもまたＣＯＭ７になります。
尚、ＣＯＭの番号は、それぞれの環境で番号が違うと思いますのでかならず確認してください。
２）JAVAのインストール
JAVAを使っているので、JAVAをインストールします。JAVAはPCの設定によっては自動的にインストールされている場合もあります。確認方法はグーグルで検索してください。
JAVAのダウンロードのページ
こちらのページにアクセスしてJAVAをインストールしてください。詳細については、JAVAのページにしたがってください。あまり難しくないので詳細は割愛します。
３）FlashPlayerのインストール
Flashで作ったものを動かすには、FlashPlayerというソフトが必要なのでこれもダウンロード・インストールします。FlashPlayerはPCの設定によってはすでにインストールされている場合もあります。確認方法はグーグルで検索してください。
FlashPlayerのダウンロードのページ
ダウンロード方法が少々わかりずらいのですが、正面のFlashアニメの中の「FlashPlyer??のダウンロード」というボタンではなく、画面右上に「次のステップ」というところがあり、その下の「FlashPlayer??
をいますぐダウンロード」というところを押します。尚、??のところはバージョンで、2010年4月現在のバージョンは10になっています。
2010年4月現在で、ダウンロード画面は下のようなイメージでした。
画面途中に、マカフィー（ウィルス対策ソフト）のお試し版をインストールするか？というチェックボックスがあり、デフォルトではチェックされているので、マカフィーを使う予定が無い方はチェックを外した方がいいと思います。私はウィルス対策ソフトはカスペルスキーを使ってますのでチェックを外しました。
下の方の黄色い「今すぐインストール」のボタンを押すと、ダウンロードとインストールが始まります。インストール詳細については割愛します。
４）Flashのインストール
Flashをすでにお持ちの方はここを飛ばしてください。
現在、２０１０年４月ですが、実は次のＦｌａｓｈがリリースされそうな微妙な時期で、現在はＦｌａｓｈＣＳ４というバージョンですが、５月にＦｌａｓｈＣＳ５というのが出ます。ということで、Ｆｌａｓｈで検索してもＦｌａｓｈＣＳ５のページにたどり着くので無償版は入手できません（まだリリースしてないので）。５月を過ぎたらこのページの情報を更新します。
ということで、とりあえずダウンロードページに行きます。
adbe社のダウンロードのページ
ＦｌａｓｈはＦｌａｓｈＣＳ５Ｐｒｏｆｅｓｓｉｏｎａｌというバージョンしかありません。上のページのＦｌａｓｈＣＳ５を押すと、ＦｌａｓｈＣＳ５のページに飛びます。
体験版というところがありますが、ダウンロードのリンクはまだありません。「最新情報を入手」のところを押すと、ＣＳ５がリリースされた時点でメールが来るように記入できますので、そこにメールアドレスを入れてＣＳ５がリリースされるのを待ちます。
ということで以降ではとりあえずＣＳ４を持っている方向けに説明します。尚、Ｆｌａｓｈが無いとソース等が見れませんが、このページで実験することはＦｌａｓｈ本体が無くても動きます。
ＣＳ５がリリースされた時点でまた情報をアップしますので、Flashをお持ちでない方はもう少々お待ち下さい。
５）iIF-12_Flash利用サンプルソフトの入手
さらに必要なソフトウェアを、ロボットポータルサイト「ろぽたる」から入手します。
ろぽたるのページ
ろぽたるのトップページに行きます。
ろぽたるからダウンロードしたり、画像を投稿するには会員になる必要があります。まだ会員になっていない方は「新規会員登録」を押して、会員登録してください。
会員になったら、トップページ上の方にある「サービスカウンター」を押してください。
ログインIDとパスワードを入れて「ログイン」ボタンを押します。
「情報ライブラリー」というところを押します。
「浅草ギ研」というところを押します。
「iIF-12 Flash利用サンプルソフト」というところを押すと、「ファイルのダウンロード」のポップアップウィンドウが出るので、保存する場所を指定して「保存」ボタンを押します。2010年4月現在で、このファイル名は
iIF-12-FlashToSerial-10100415.zip になっています。
ダウンロードしたファイルを解凍し、フォルダの中を見ると次のようなファイルがあることがわかります。
ファイルの役割を簡単に説明します。
FlashToSerial.jar ： フラッシュと外部を通信するソフトウェア。（ソフト的な部分）
rxtxSerial.dll ： 通信ソフトウェア。 （ハード的な部分）
flash_to_serial.fla ： サンプルプログラムのソースファイル。FlashCS4又はCS5で開くことができる。
flash_to_serial.html、 flash_to_serial.swf、 AC_RunActiveContent.js は.flaファイルを”パブリッシュ”すると作成されます。flash_to_serial.htmlをブラウザで開けば、プログラムを実行することができます。
README.txt ： サンプルプログラムの使い方を説明したテキストファイル。
FlashでiIF-12を動かすのに必要な特別なソフトは FlashToSerial.jar と rxtxSerial.dll
の２個です。これを使い、Flashで.flaファイルを作り、Actionスクリプトを記述すればオリジナルなソフトウェアが作れます。
Ｆｌａｓｈの設定
Ｆｌａｓｈは通常はセキュリティーの為に外部とは通信できない設定になっていますが、iIF-12と通信するためにはこのセキュリティールールを変更する必要があります。これにはグローバルセキュリティ設定を行います。とはいっても操作は簡単です。
FlashがインストールされているPCで、グローバルセキュリティの設定ページにアクセスしてください。
グローバルセキュリティ設定パネルのページ
このadbe社のページから設定できるようになっています。ページにアクセスして、少し待つと、上のようにページ上に「Adobe Flash
Player 設定マネージャー」というウィンドウが表示されます。ここのコンボボックス（編集．．．となっているところ）を開き、「追加．．．」を押します。「ファイルを参照」というボタンを押し、動かしたいｓｗｆファイル（ここではflash_to_serial.swf)を指定します。指定されると、設定マネージャーの画面にそのファイル名が追加されます。上の例ではすでに３つのSWFファイルが指定されています。（実験で３回ソフトを作ったので）
これをやらないと、通信ができませんので、オリジナルソフトを作った場合も設定を忘れないように注意してください。
動かし方
では実際にサンプルプログラムを動かしてみます。
iIF-12にはとりあえず、センサーとサーボを接続してみました。
ろぽたるからダウンロードしたファイルの中の、FlashToSerial.jarをダブルクリックします。
すると、次のウィンドウが開きます。ここで通信設定を行います。尚、COMポートが沢山あるPCではこのWindowが開くまでにしばらく時間がかかりますので注意してください。
「ポート：」はiIF-12を接続した時に確認したCOM番号を設定します。「ボーレート」はデフォルトでは９６００になっていますが、１１５２００に設定してください。ｉＩＦ−１２の通信速度（ボーレート）は115200bpsで固定です。その他の設定はそのままでＯＫです。設定が終わったら「接続」ボタンを押します。
問題なく接続されると、ボタンの表示が「切断」に変わります。
次に、ろぽたるからダウンロードしたファイルの中の、flash_to_serial.htmlをダブルクリックします。
ブラウザが開き、次のような画面が出ると思います。
ここで、「１２７．０．０．１」と書いてあるテキストボックスの横の「接続」ボタンを押します。
問題なく接続されると、「＝＝接続＝＝」という表示が出て、ボタンが「切断」という表示になります。
この状態で、それぞれのトラックバーを操作すると、接続されたサーボが動きます。また、「センサ読取」ボタンを押すと、センサーの値が表示されます。
このようにして、Ｆｌａｓｈで作ったプログラムでセンサやサーボを動かすことができます。
ソースファイルをのぞいてみる
次に、ろぽたるからダウンロードしたファイルの中の、flash_to_serial.flaをダブルクリックします。
Flashが起動し、サンプルプログラムの編集画面になります。アクションスクリプトはタイムライン上に入っていますのでタイムラインを見ますと、
このような感じでActionScriptが挿入されている表示が出ています。（フレーム１の黒丸の上にアルファマークが付いているが、これがActionScriptが記述されているフレームのマーク）図では赤線がかぶっているので少々みずらいです。
アルファマークをクリックし、Ｆ９キーを押すと、その部分のコードが見れます。
このサンプルプログラムのコード部分です。
実は私はこのページを書くまで、ＡｃｔｉｏｎＳｃｒｉｐｔについてはまったく知りませんでしたが、Ｃ＃をやってましたので、コードを読むとなんとなくやっていることはわかります。ちなみにＦｌａｓｈをさわったのは１５年ぶりぐらいでした（汗）。
次のステップ
次からは、ろぽたるのファイルを活用して、オリジナルなソフトをどうやって作るかをやってみます。とりあえず、私自身がＡｃｔｉｏｎＳｃｒｉｐｔを知らないので、アマゾンに初級本とリファレンス本を発注したところで終了。
（実はこの段階では次の作例の実験は終わっているのですが、ここで紹介したソースファイルをちょっと変えるだけで簡単に作ることができました。本はこのページを書き終わる直前に届いたのでした。
）
２０１０年４月１７日
|
