2014年03月27日

openFrameworksでとりあえずプロジェクションマッピング(実装編①)の続き

画像処理?編



前回まででとりあえずプログラム実行前にいくつか素材を用意してマッピングを
行えそうな感じが出てた。今回はプログラムを実行中に実行画面から画像を
作り出し操作する?感じのものをつくりたかったので任意の範囲をofImageに
動的に取得することを目標にだらだら書いてみた。
(特にaddonはなし)


test_pickImage
testApp.h

#pragma once
 
#include "ofMain.h"
 
class testApp : public ofBaseApp{
 
	public:
		void setup();
		void update();
		void draw();
 
		void keyPressed(int key);
		void keyReleased(int key);
		void mouseMoved(int x, int y );
		void mouseDragged(int x, int y, int button);
		void mousePressed(int x, int y, int button);
		void mouseReleased(int x, int y, int button);
		void windowResized(int w, int h);
		void dragEvent(ofDragInfo dragInfo);
		void gotMessage(ofMessage msg);
 
    bool display;           //画面切り替え用
    ofImage haikei;         //適当な素材
 
    ofImage kariImage;      //一旦画像を入れておくところ
 
    vector<ofImage> img;    //以下動的配列に切り取る画像の場所や大きさなどを入れてimgに画像を格納する
    vector<int> lx;
    vector<int> ly;
    vector<int> ww;
    vector<int> hh;
 
    int mouseCount;
};




testApp.cpp

#include "testApp.h"
 
//--------------------------------------------------------------
void testApp::setup(){
    ofBackground(255, 255, 255);
    ofSetFrameRate( 60 );
    ofSetVerticalSync( true );
    ofEnableSmoothing();
 
    display = false;
    haikei.loadImage("haikei.jpg");
 
}
 
//--------------------------------------------------------------
void testApp::update(){
 
}
 
//--------------------------------------------------------------
void testApp::draw(){
    //適当な描画
    ofBackground(255);
    ofSetColor(255, 255, 255);
    haikei.draw(0, 0, ofGetWidth(), ofGetHeight());
    ofEllipse(300*sin(ofGetElapsedTimef())+ofGetWidth()/2, ofGetHeight()/2, 20, 20);
    //ここまで
 
    ofSetColor(100);
    ofNoFill();
    for (int i=0; i<img.size(); i++) {
        img[i].grabScreen(lx[i], ly[i], ww[i], hh[i]);
        ofRect(lx[i], ly[i], ww[i], hh[i]);
    }
 
    ofSetColor(255, 255, 255);
 
    if (display) {
        ofBackground(0, 0, 0);
 
        for (int i=0; i<img.size(); i++) {
            img[i].draw(lx[i], ly[i], ww[i], hh[i]);
        }
    }
 
}
 
//--------------------------------------------------------------
void testApp::keyPressed(int key){
    if( key == 'a' ){
        if (display) {
            display = false;
        }else{
            display = true;
        }
    }
 
}
 
//--------------------------------------------------------------
void testApp::mousePressed(int x, int y, int button){
    if (mouseCount % 3 == 0) {                          //一回目のクリック(切り取る基準の場所指定)
        lx.push_back(x);
        ly.push_back(y);
        ww.push_back(0);
        hh.push_back(0);
    }else if(mouseCount % 3 == 1){                      //二回目のクリック(画像の幅を決める)
        ww[mouseCount/3] = x - lx[mouseCount/3];
        if (x - lx[mouseCount/3] < 0) {
            lx[mouseCount/3] += ww[mouseCount/3];
            ww[mouseCount/3] *= -1;
        }
    }else{                                              //三回目のクリック(画像の高さを決めた後、イメージを切り取りofImageを作る)
        hh[mouseCount/3] = y - ly[mouseCount/3];
        if (y - ly[mouseCount/3] < 0) {
            ly[mouseCount/3] += hh[mouseCount/3];
            hh[mouseCount/3] *= -1;
        }
 
        kariImage.grabScreen(lx[mouseCount/3], ly[mouseCount/3], ww[mouseCount/3], hh[mouseCount/3]);
        img.push_back(kariImage);
 
    }
    mouseCount++;
 
}



今回の目標はofImageを動的につくるということで
とりあえず動的配列を作った。(ofImage,画像の場所x、y、画像の幅、高さ、)

ofImage型?って動的配列にできるんですね。。。

mousePressed関数の中にマウスが三回でループする仕組みを適当につくって
クリックする度にそれぞれの配列に追加していき三回目にofImageを追加するという形
ofImageのgrabScreenメソッド便利!

draw関数内には
最初の数行は適当な描画サンプル

for (int i=0; i<img.size(); i++) {
        img[i].grabScreen(lx[i], ly[i], ww[i], hh[i]);
        ofRect(lx[i], ly[i], ww[i], hh[i]);
    }


ここで今追加されている画像のサイズ分だけもう一度grabScreenを使って更新
これをしないと動くものをマッピングしたいときに最初に取得した画像の
ままになり、動かない。

if (display) {
        ofBackground(0, 0, 0);
 
        for (int i=0; i<img.size(); i++) {
            img[i].draw(lx[i], ly[i], ww[i], hh[i]);
        }
    }


適当にキーボードのaを割り振って画面きりかえをしているが
画面が切り替わったら今ofImage配列に入っている画像を
その場所にはりつける。
書いてないけどもちろんsaveImage?で画像を保存することもできた。

こんな感じになるはず



次回統合&使用編



動作環境
Xcode 5.0
openFrameworks 8.0
OSX 10.8.5


コメントを残す

© Sako.log All Rights Reserved.