フェードイン・フェードアウト ― 2013/12/02
画面描画にはフレームバッファを使用しています(11/6の記事参照)。
最終的に画面に出すフレームバッファはテクスチャとして描画していますので、カラーを設定することができます。
このフレームバッファ描画時のカラーを変更することによって、画面のフェードイン・フェードアウトを実装してみます。
Renderer.h
クラス sys::Rendererの静的メンバ変数です。
固定だったカラーバッファを変更できるようにしています。
フェードイン・フェードアウトの関数です。
フェード時間をフレーム数単位で指定します。
Renderer.cpp
描画前に明るさの変更を行い、カラーバッファに値を設定します(249~268行)。
フレームバッファテクスチャ描画で、設定したカラーバッファを指定しています(307行)。
サンプル
AppMain.cpp
画面をタッチすると、現在の明るさに応じてフェードイン・フェードアウトを行います。
プロジェクト一式は、こちらから。
最終的に画面に出すフレームバッファはテクスチャとして描画していますので、カラーを設定することができます。
このフレームバッファ描画時のカラーを変更することによって、画面のフェードイン・フェードアウトを実装してみます。
Renderer.h
static GLubyte screen_color[4*4]; // 画面描画カラー static int fade_bright; // 画面の明るさ static int fade_speed; // フェードの速さ
クラス sys::Rendererの静的メンバ変数です。
固定だったカラーバッファを変更できるようにしています。
static void fade_in(int _cnt = 500/FRAME_PERIOD) // フェードイン { fade_speed = (_cnt > 0) ? (254 + _cnt)/_cnt : 255; } static void fade_out(int _cnt = 500/FRAME_PERIOD) // フェードアウト { fade_speed = (_cnt > 0) ? -(254 + _cnt)/_cnt : -255; } static int get_bright(void) // 画面明るさ取得 { return fade_bright; }
フェードイン・フェードアウトの関数です。
フェード時間をフレーム数単位で指定します。
Renderer.cpp
/******************** 描画(後処理) ********************/ void Renderer::draw(void) { if ( fade_speed > 0 ) { // フェードイン fade_bright += fade_speed; if ( fade_bright >= 255 ) { fade_bright = 255; fade_speed = 0; } for (int i = 0; i < 4*3; i++) { screen_color[i + i/3] = (GLubyte)fade_bright; } } else if ( fade_speed < 0 ) { // フェードアウト fade_bright += fade_speed; if ( fade_bright <= 0 ) { fade_bright = 0; fade_speed = 0; } for (int i = 0; i < 4*3; i++) { screen_color[i + i/3] = (GLubyte)fade_bright; } } static const GLfloat _projection[4*4] = { 1.0f, 0.0f, 0.0f, 0.0f, 0.0f, 1.0f, 0.0f, 0.0f, 0.0f, 0.0f, 1.0f, 0.0f, 0.0f, 0.0f, 0.0f, 1.0f, }; static const GLfloat _texcoords[] = { 0.0f, 0.0f, 1.0f, 0.0f, 0.0f, 1.0f, 1.0f, 1.0f }; static const GLfloat _vertices[] = { -1.0f, -1.0f, 1.0f, -1.0f, -1.0f, 1.0f, 1.0f, 1.0f, }; ShaderProgram* _shader = use_shader(SHADER_TEXTURE); // フレームバッファテクスチャ描画 glBindFramebuffer(GL_FRAMEBUFFER, 0); glViewport(screen_rect.x, screen_rect.y, screen_rect.w, screen_rect.h); glUniformMatrix4fv(_shader->projection, 1, GL_FALSE, _projection); glBindTexture(GL_TEXTURE_2D, frame_buffer->texture); glVertexAttribPointer(_shader->texcoord, 2, GL_FLOAT, GL_FALSE, 0, _texcoords); glVertexAttribPointer(_shader->position, 2, GL_FLOAT, GL_FALSE, 0, _vertices); glVertexAttribPointer(_shader->color, 4, GL_UNSIGNED_BYTE, GL_TRUE, 0, screen_color); glDrawArrays(GL_TRIANGLE_STRIP, 0, 4); }
描画前に明るさの変更を行い、カラーバッファに値を設定します(249~268行)。
フレームバッファテクスチャ描画で、設定したカラーバッファを指定しています(307行)。
サンプル
AppMain.cpp
/****************************** 稼働 戻り値 アプリ続行か ******************************/ Bool update_app(void) { sprite[SPR_PHOTO].draw(0.0f, 0.0f); // 背景 for (int i = 0; i < 4; i++) { // ビー玉 int t = ((cnt + i*15) % 60) - 30; sprite[SPR_BALL_BLUE + i].draw(((i*180 + cnt*4) % 720) - 360, 400 - (30*30 - t*t)/2); } cnt++; if ( sys::TouchPanel[0].flag & sys::TouchManager::TRIGGER ) { if ( sys::Renderer::get_bright() == 0 ) { sys::Renderer::fade_in(60); // フェードイン } else if ( sys::Renderer::get_bright() == 255 ) { sys::Renderer::fade_out(60); // フェードアウト } } return TRUE; }
画面をタッチすると、現在の明るさに応じてフェードイン・フェードアウトを行います。
プロジェクト一式は、こちらから。
コメント
トラックバック
このエントリのトラックバックURL: http://raseene.asablo.jp/blog/2013/12/02/7089113/tb
コメントをどうぞ
※メールアドレスとURLの入力は必須ではありません。 入力されたメールアドレスは記事に反映されず、ブログの管理者のみが参照できます。
※投稿には管理者が設定した質問に答える必要があります。