ofxSyphonを既存のopenFrameworksプロジェクトに追加する


この記事はクリエイティブコーディング Advent Calendar 2016の3日目のものです。

はじめに

以前openFrameworksとMadMapperを使ってプロジェクションマッピングするみたいな話を書きましたが、
http://qiita.com/Hiroki11x/items/847ea309b6be65da08a0

ofxSyphonは、このサンプルを参考にみたいな雑な感じだったので。改めて、既存のopenFrameworksプロジェクトにofxSyphonを追加する方法を紹介します。

[追記]ProjectGenaratorなめてたんですが、updateするだけでできるのですね、それでもできなかった人oF0.8.~の方は以下を参考にしてください。

Syphonとは

http://syphon.v002.info/ の説明を翻訳すると

SyphonはオープンソースのMac OS Xテクノロジーで、アプリケーションはフルフレームレートのビデオや静止画をリアルタイムで相互に共有できます。 今では、ジョブの各部分に最適なツールを使用して、イメージをミックス、マッシュ、編集、サンプル、テクスチャマップ、合成、および提示するための多彩なツールの表現力を活用できます。 Syphonは、シングルアプリケーションソリューションから抜け出し、ニーズに合わせてクリエイティブアプリケーションを組み合わせる柔軟性を提供します。

みたいです。以下のようなソフトウェア、アプリケーションで利用できるようです。

環境

今回はOSX環境のみの紹介になります。基本的に私の環境が少し古いですが、ほとんど、最新バージョンと互換性があるみたいなので最新に全部持っていけば問題ないかと思います。

本記事の環境 Image 最新版のURL
Xcode 7.3.1 xcode https://developer.apple.com/download/
OSX 10.11.4 https://support.apple.com/ja_JP/downloads/macos
openFrameworks 0.9.2 http://openframeworks.cc/ja/download/
ofxSyphon https://github.com/astellato/ofxSyphon

ただし、ofxSyphonの追加する位置はOF_PATH/addons/内です。

プロジェクトに設定をする

1. まずofxSyphonAddonとして追加します

addonsを右クリック(二本指でクリック)するとAdd Files to ofxSyphon_Sample(今回のプロジェクト名|ここは任意)という選択肢が出てくるので、それを選択し、OF_PATH/addons/内に追加したofxSyphonAddを押して追加します。

すると以下のようにaddons内に追加されますが、青枠のものは必要ないので

右クリックで選択し、以下のようにRemove Referenceしましょう。

2. XcodeProjectに対して設定を加えます。

XcodeProject(ofxSyphon_Sample) > TARGETS > Build Phases を選択し、
以下のように、Compile Sources

  • ofxSyphonClient.mm
  • ofxSyphonServer.mm
  • ofxSyphonServerDirectory.mm
  • SyphonNameboundClient.m

が追加されているか確認。

また、以下のように、Link Binary With Libraries

  • Syphon.framework

が追加されていることを確認してください。

Screen Shot 2016-12-03 at 13.23.51.png

また、以下のように
XcodeProject(ofxSyphon_Sample) > TARGETS > General > Embedded Binaries を選択し、

Syphon.frameworkを追加します。

次に、XcodeProject(ofxSyphon_Sample) > TARGETS > Build Settingを選択し、

Search Path > Framework Search Path

  • ../../../addons/ofxSyphon/libs/Syphon/lib/osx

を追加します。

同様にして Search Path > Header Search Path に以下の六つを追加します。

  • ../../../addons/ofxSyphon/libs
  • ../../../addons/ofxSyphon/libs/Syphon
  • ../../../addons/ofxSyphon/libs/Syphon/lib
  • ../../../addons/ofxSyphon/libs/Syphon/lib/osx
  • ../../../addons/ofxSyphon/libs/Syphon/src
  • ../../../addons/ofxSyphon/src

コードを書く

今回は、openFrameworksで描画したものをSyphonとしてServeする、つまり送信側の役割を書きたいと思います。手順は簡単で、SyphonServerにsetup()で名前をつけてあげて、(全て送信したいなら)draw()の最後で,
publishScreen()を呼んであげるだけです。

ofApp.h
#pragma once

#include "ofMain.h"
#include "ofxSyphon.h"

class ofApp : public ofBaseApp{
private:
    ofxSyphonServer mSyphonServer;

public:
    void setup();
    void update();
    void draw();
};
ofApp.cpp
#include "ofApp.h"

//--------------------------------------------------------------
void ofApp::setup(){
    mSyphonServer.setName("Main");
}

//--------------------------------------------------------------
void ofApp::update(){
}

//--------------------------------------------------------------
void ofApp::draw(){
    ofBackground(ofColor::fromHsb(ofGetFrameNum()%256,255,255));
    mSyphonServer.publishScreen();
}

実際の送信結果

Resolume Arena 5

VJソフトの一つ。
右側の Source > Syphon の選択肢に。
ofxSyhon_SampleDebug - Mainみたいなのが出るのでそこを、Layerにドラッグアンドドロップします。
するとこんな感じ。
左側は生のoFの画面です。

VDMX5

VJソフトの一つ。
Right Scr > Use Source > Syphon > ofxSyhon_SampleDebug-Main を選択することでできます。

MadMapper

プロジェクションマッピングなどによく用いられるソフトの一つ。
右側の入力ソースにSyphonの欄があるので、ofxSyhon_SampleDebug-Mainの左側の三角をクリックするとソースとして選択できます。

Screen Shot 2016-12-03 at 14.15.02.png

間違い等、指摘していただけると幸いです🙇