時系列データを管理するために、ofxTimelineを試してみる（その1)

obviousjimさんが開発された、時系列データをGUIで編集するための素晴らしいツールがあるということなので、試してみます。いつものようにopenframeworksのaddonで、名前はofxTimeline[1]です。開発環境は、Windows7 64bit, VS2012, openframeworks0.8です。

必要なaddonのインストール

公開されたのがof0.73時代で、ターゲットがvs2010だったので、配布されているプロジェクトだとそのまますんなり動いてくれません。また、必要な外部ライブラリがたくさんあります。一つづつ見ていきましょう。

ofxTimeline : https://github.com/YCAMInterlab/ofxTimeline
ofxTimecode : https://github.com/YCAMInterlab/ofxTimecode
ofxMSATimer : https://github.com/obviousjim/ofxMSATimer
ofxTextInputField : https://github.com/Flightphase/ofxTextInputField
ofxRange : https://github.com/Flightphase/ofxRange
ofxTween : https://github.com/arturoc/ofxTween

これに加えて、標準addonの

ofxXmlSettings

が必要です。それぞれダウンロードして、openframeworksのインストールフォルダのaddonsの中に放り込んでください。download ZIPボタンで取得した場合は、名前の-masterを消しておいてください。

projectGeneratorで空プロジェクトの作成

projectGeneratorを使ってvs2012用の空プロジェクトを作ります。適当にプロジェクト名を付けてください。ここでは、ofxLeapTimelineとします。addonの指定で上記のライブラリすべてにチェックを入れてください。

f:id:cvl-robot:20140805204742p:plain

インクルードパスの設定

で、大変面倒くさいことに、

-ofxTimelineのaddon設定が上手く読み込まれない

-ofxTimelineが内包するlibsの4つのライブラリのインクルードパス、ライブラリパスも通す必要がある

という問題を解決する必要があります。VisualStudioのソリューションエクスプローラに追加→新しいフィルターで

libs,

libs->kiss,

libs->kiss->src,

libs→ofOpenALSoundPlayer_TimelineAdditions，libs→ofOpenALSoundPlayer_TimelineAdditions→src

を追加してください。それぞれのsrcの中に追加→既存の項目、でsrcフォルダ内のファイルをすべて追加してください。

f:id:cvl-robot:20140805205339p:plain

インクルードパスは、それぞれのライブラリフォルダのincludeフォルダまたはsrcフォルダに適当に通してください。多分、次の４つで行けます。

..\..\..\addons\ofxTimeline\libs\kiss\include

..\..\..\addons\ofxTimeline\libs\sndfile\include

..\..\..\addons\ofxTimeline\libs\ofOpenALSoundPlayer_TimelineAdditions\src

..\..\..\addons\ofxTimeline\libs\openal\include

ライブラリパスの設定

ライブラリパスは2つ明示的に通してやる必要があります。例を挙げると、次の通り。インストール場所に合わせて適当に直してください。

#pragma comment(lib, "C:\\workspace\\of_v0.8.0_vs_release\\addons\\ofxTimeline\\libs\\openal\\libs\\vs2010\\OpenAL32.lib")
#pragma comment(lib, "C:\\workspace\\of_v0.8.0_vs_release\\addons\\ofxTimeline\\libs\\sndfile\\lib\\vs2010\\libsndfile-1.lib")

これで、とりあえずビルドは通るかな？

テストコードの実行

まだプロジェクトの中身は空っぽなので、起動しても灰色の画面が出て終わりです。

次は、ソースコードを書いていきます。

[1]のページの、Add a timeline to your codeの項目のソースコードを指示の通りに追加してください。ただし、一か所小さな罠がありますので直します。

//--------------------------------------------------------------
void testApp::draw(){
  //the value of changingRadius will be different depending on the timeline
  float changingRadius = timeline.getValue("MyCircleRadius"),　←――;が正解
  //use the value for something amazing!
  ofCircle(mouseX, mouseY, changingRadius);
  //don't forget to draw your timeline so you can edit it.
  timeline.draw();
}

ofxTimelineの下にあるcopy_to_data_GUIの中身を、自分のアプリのbinのdataの中にGUIというフォルダを作って、3つのファイルともコピーします。

f:id:cvl-robot:20140805223715p:plain