INDEX(各項目ごとの目次)

[HOME]  [Processing関係]  [Arduino関係]  [マテリアル関係]  [秋葉原工作マップ]

2008年用ですが、部分的に内容を更新しています(2010/06/14)。
また、[建築農業工作ゼミ2009-2010]とも連動していますので、そちらにも幾つかサンプルがあります。
:

11/08/2008

Processing ドラッグした図形の動きを記録/保存/再生する

Processing画面上の図形をマウスでドラッグし、その動きを記録する方法、記録した内容をテキストデータとして外部に保存する方法、さらにそのテキストデータを読み取って動きを再生させるサンプルです。

まずは、ドラッグする図形を円とした場合のプログラムから始めます。今回はmouseDragged()は使わず、startDragというフラグを用意し、mousePressed()でドラッグ開始(startDrag=true)、mouseReleased()でドラッグ終了(startDrag=false)とみなす方法を用います。
円の中心座標から少しずれた位置にマウスを合わせてそのままドラッグできるように、円の中心座標とマウス座標の差分を計算しておき、その差分を足した値を最終的に円の座標に反映されるようにします。
また、dist()を使って円の中心座標からマウス座標までの距離を計算し、その距離が円の半径以内であれば円の上にマウスがあることとみなしてドラッグ可能にします。dist()は、dist(x1,y1,x2,y2)のように(x1,y1)と(x2,y2)の二点間の距離を計算します。


「円をドラッグする」:

 [プログラムを表示]



「円をドラッグ+記録機能」:
上記プログラムに、ドラッグした円の動き(連続する座標値)を記録する機能を付け加えます(以下のプログラム)。「r」キーを押すことで記録開始にします。再度「r」キーを押すと記録停止するようにし、記録中は円の塗色を赤に変化させます。プログラム的には、recordStartというフラグを用意し、記録開始/停止を判別できるようにします。xPosとyPosという座標を記録するための配列を用意しておき、記録中はそれらの配列に座標値を付け加えていきます。
赤文字の部分が付け足したプログラムです。

 [プログラムを表示]


xPos={}というように空の配列をはじめに用意しておき、append()を使って変化する座標値を配列xPosに付け加えていきます。よって、配列xPosに含まれる要素は、記録されるごとに増えていきます。xPos.lengthを用いれば、記録された配列内の座標の個数を調べることができます。
記録停止しているときに「r」キーが押されればstartRecord=trueにし、逆に記録停止しているときに押されれば、startRecord=falseに切り替えられるように、フラグstartRecordを使い分けます。


「円をドラッグ+記録機能+保存機能」:
さらに以下では、記録された内容をテキストファイルとして外部保存する機能と記録した座標値を消去する機能を付け足します(赤い文字部分)。「r」キーで記録、「s」キーでファイル保存、「c」キーで記録内容を消去することにします。

 [プログラムを表示]


上記プログラムでは、printWriterを使って外部ファイルとして座標値データを保存しています。「s」キーを押すとselectOutput()によってダイアローグ画面が現れるので、保存名と保存先を指定します。「positions.txt」のように、「.txt」の拡張子をつけて任意の場所(デスクトップなど)に保存します。再度上書き保存する場合は、ダイアローグ画面上で、同じファイルを選択し保存ボタンを押します(上書き保存の確認メッセージが現れます)。


「円をドラッグ+記録機能+保存機能+再生機能」:
次に、記録された内容や保存された内容のデータを読み取り、そのデータに基づいて動きを再生するプログラムをします。再生中は円の塗色が緑に変化し、再生終了すれば黒に戻ります。
まず、「r」キーを押して記録開始し、マウスで円をドラッグします(ドラッグ記録中)。
次に再度「r」キーを押して記録を停止します。
記録された内容を再生するために、「p」キーを押します。動きが再生されている間は円が緑色になります。
「s」キーを押すことで、記録内容を外部ファイルとしてデスクトップなどの任意の場所にファイル名(拡張子「.txt」)をつけて保存します。
「s」キーで保存されたファイルを読み込むには、「l」(小文字のエル)キーを押してファイル選択画面の中でファイル選択します。読み込んだファイルのデータは配列xPosとyPosに記憶されます。「p」キーを押せば、読み込んだ記録を再生します。
「c」キーによって、配列内のデータを空にしないかぎり、「r」キーによる記録した座標値は追加されていきます。

「各キーの機能割当」:
r:記録開始(record)/記録停止
c:記録消去(clear)
s:保存(save)
l:ファイル読み込み(load)
p:再生(play)

赤文字部分がさらに追加した再生機能の内容です。

 [プログラムを表示]


「p」キーを押すことで、再生用フラグstartPlayがtrueになり、ループ内で再生用の処理が行われます。変数countを用意しループするごとにcountを+1ずつ増加させ、配列内の座標データをひとつずつ円の座標に代入していきます。配列内のデータ数をxPos.lengthで調べ、最後のデータまで読み込んだら再生用フラグstartPlayをfalseにし再生停止させます。
「l」キーを押し、selectInput()によってファイル選択画面が現れ、保存したファイルを選択します。選択したファイル内のデータをloadStrings()によって、「X座標値+コンマ+Y座標値」という一行ずつの文字列をsplit()でコンマ記号を境目として二つのデータに分けて、同時にそれら文字列をint()で整数化し、append()によって座標用の配列xPosとyPosに追加していきます(代入する前にxPosとyPosを空の配列にしておきます)。

誤作動が起こらないように、再生中はキー入力を禁止したり、読み込まれるファイルが相応しくない場合の例外処理などが実際には必要になりますが、今回のプログラムでは省略しています。

FILCO ポータブルタッチパッド スマートトラックライト ATP-400UB
ダイヤテック (2008-06-26)
売り上げランキング: 19889

0 件のコメント:



[目次:Processing関係]  [HOMEへ戻る]  [目次:Arduino関係]