openFrameworks: Setup Guide for OSX

since: 2015/04/13
update: 2015/09/03
reference:
1. openFrameworks

A. Integrated Development Environment (IDE)
    1. 從 OSX App Store 安裝 Xcode

    2. 安裝 Xcode's command line tools
        開啟終端機, 輸入以下內容後按 "Enter"
        $ xcode-select --install

-----------------------------------------------------------------------------------------------

B. openFrameworks for Xcode
     1. 下載 openFrameworks for Xcode (v0.8.4), 並解壓縮到特定目錄下,
         解壓縮出來的資料夾即是你的 openFrameworks 根資料夾(OF_ROOT).
         如下所示, OF_ROOT 為: of_v0.8.4_osx_release

     2. 在 openFrameworks 的根資料夾內, 有幾個關鍵性的子資料夾:
         - apps: 放置你自己新增的 apps
         - examples: 一系列展示的 apps, 包含影像, 3D圖形, 聲音, 字型等等.
         - addons: 用來存放 openFrameworks addons (由社群所貢獻的核心擴展)
         - projectGenerator_osx: 包含了專案產生器, 幫助你建立新的 apps.

-----------------------------------------------------------------------------------------------

C. 測試
     1. 用 Xcode 開啟:
         .... /examples/3d/3DPrimitivesExample/3DPrimitivesExample.xcodeproj

    備註: openFrameworks app 的基本架構:
             - src: 放原始程式的地方.
             - bin: 放可執行的 app, 以及 data 資料夾(素材) 

     2. 編譯並執行:

     3. 結果:

-----------------------------------------------------------------------------------------------

D. 建立新的專案:
     1. 執行:
         .... /of_v0.8.4_osx_release/projectGenerator_osx/projectGenerator.app

     2. 在 Name 處點二下滑鼠, 更改名稱: firstSketch,  按下 "GENERATE PROJECT",
         然後關閉此 project generator.

     3. 開啟:
         .... /of_v0.8.4_osx_release/apps/myApps/firstSketch/firstSketch.xcodeproj

     4. 展開 src 資料夾, 點選 ofApp.cpp 檔案, 修改如下:
#include "ofApp.h"

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

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

//--------------------------------------------------------------
void ofApp::draw(){
    //@add
    ofDrawBitmapStringHighlight("Everything works!", 20, 20);
}
....

     5. 編譯並執行:

-----------------------------------------------------------------------------------------------

E. 新增檔案到專案裡
    1. 專案 > src > New File...

    2. OSX > C++ File > Next

   3. Name: "myNewClass"
       勾選: Also create a header file
       > Next

   4. Group: src
       Target: 勾選 專案名稱
       > Create

    5. 結果:

-----------------------------------------------------------------------------------------------

F. 新增 openFrameworks addons
    如果 addon 有包含一個 README, 請依照說明, 不然的話請依照以下的方式:

    1. 將下載的 addon 放到 openFrameworks 根資料夾下的 addons 資料夾內.

    2. 在 Xcode 的專案裡, 點選 addons 資料夾 > "Add file to (專案名稱)..."

   3. 瀏覽到要加入的 addon 裡, 選取 src 與 libs 資料夾(如果有的話):
       點選: Create groups
       勾選: targets 專案
       非必要: Copy items if needed
       > Add

    4. 選取剛剛新增到專案的資料夾(libs 與 src),
        > New Group from Selection

 

    5. 重新命名後:

    6. 到目前為止, 可以試著去編譯你的專案, 如果出現找不到檔案的錯誤訊息,
        就需要幫 addon 的資料夾設定 header search path. 通常是位於 src 或 libs
        資料夾內叫作 "include" 的資料夾.

    路徑: $(OF_PATH)/addons/ofxOpenCv/libs/opencv/include
    說明: $(OF_PATH)代表 openFrameworks 的根資料夾.

    7. 專案 >  Build Settings > 搜尋: header search
        > 找到 Header Search Paths

    8. 對 Header Search Paths 的值, 雙擊滑鼠後, 按 "+", 並新增一行:
        $(OF_PATH)/addons/ofxOpenCv/libs/opencv/include

    9. 再編譯一次, 應該就沒問題了~

-----------------------------------------------------------------------------------------------

F. 安裝 PiMapper:
     1. 開啟終端機, 到 openFrameworks 跟資料夾下的 addons 目錄下:
         $ cd /Lanli/RD/Projects/openFrameworks/of_v0.8.4_osx_release/addons/

     2. 下載並安裝 PiMapper:
          $ git clone https://github.com/kr15h/ofxPiMapper.git

     3. 下載並安裝 ofxIO 與 ofxOMXPlayer:
         $ git clone https://github.com/jvcleave/ofxOMXPlayer.git && git clone https://github.com/bakercp/ofxIO.git
   
     4. 編輯新加入的程式時, 請在 Xcode 中新增檔案, 或從別處拷貝程式碼內容再貼上;       
         不要從專案目錄夾直接將檔案覆蓋, 可能會造成編譯錯誤.