基本的な2次元図形の描き方を紹介します。

プロジェクト名は graphics2D_02 とします。

参考ファイル:

ofApp.h

ofApp.cpp

graphicsExample.png

以下、ofApp.hofApp.cpp の違いに注意してください。


graphicsExample

サンプルプログラムexamples/graphics/graphicsExample をトレースしてみます。


アニメーションする円

アニメーションのために、float型の変数counterを作成して、0で初期化します。そして、update()で値を更新するようにします。

class ofApp : public ofBaseApp {
    public:
    ...略...
    
    float counter;
};
void ofApp::setup() {
    ofBackground(255, 255, 255);
    
    counter = 0;
}

void ofApp::update() {
    counter = counter + 0.033f;
}

続いて、draw()に、counterの値に応じて振動する円を描く。

void ofApp::draw() {
    // 振動する円
    ofSetColor(255, 130, 0);
    float radius = 50 + 10 * sin(counter);
    ofFill();
    ofDrawCircle(100, 400, radius);
    
    // 外枠の円
    ofNoFill();
    ofSetHexColor(0xCCCCCC);
    ofDrawCircle(100, 400, 80);
    
    // 文字列の表示
    ofSetHexColor(0x000000);
    ofDrawBitmapString("circle", 75, 500);
}

長方形をランダムに描画

200個の長方形を描画する。長方形の色や大きさ、位置はランダム。