ワイプ表示について。

現在、C#で画面表示にワイプ（パラパラと画面が変わる）を作成しようと思ったのですが、あれはどういうアルゴリズムなのでしょうか？

http://tokyo.cool.ne.jp/sdl/img/ScreenEffect2.jpg
↑のように切り替わるワイプです。

No.3 ベストアンサー 回答者： Oh-Orange 回答日時： 2007/05/06 21:04

★最初に C# でグラフィックの描画方法をどの程度知っているのですか？

・ブラインドのフェードイン(ワイプイン)は画面を複数の高さに分割します。
　たとえば 10 分割にしたとします。→ScreenEffect2.jpg に合わせ。
　そのうちの１つに着目して
　(1)中央位置から段々太くなるように『絵』をメモリバッファから画面(HDC)へ転送していきます。
　(2)最初は Y 軸が中央位置、『絵』の高さが 1 ピクセルにします。
　(3)続いて Y 軸を -1 にして『絵』の高さを 3 ピクセルにします。
　(4)さらに Y 軸を -1 にして『絵』の高さを 5 ピクセルにします。
　(5)上記を繰り返して分割した１つの絵の高さが 10 分割した１つの高さになったら繰り返し終了。
　こんな感じですよ。ブラインドの場合は。
・これを実現するには最初『絵』＝画像をメモリ上のバッファにすべてを描きます。
　メモリ上とは、ダブルバッファ領域を用意してそこに描画する訳です。
・そして、メモリ上のダブルバッファ領域から順番に 10 分割した１つの領域を細いラインから
　太いラインになるように Fill 関数などで実際の画面領域に転送します。
　これを分割した 10 個分繰り返します。
・その後、ちょっとしたウェイトでも入れます。
　ウェイト後はラインを少し太くした長方形領域をメモリ上から画面へ転送します。
　これを繰り返す。下に擬似サンプルを載せます。

擬似サンプル:
int high = 32;　←10分割した1つの高さをセット
int posY = high / 2;　←中央位置なので÷2からスタート
int wide = 640;　←転送するラインの幅(ブラインドの横幅)
int size = 1;　←転送するラインの高さ(ブラインドの太さ)

do {
　for ( int i = 0 ; i < 10 ; i++ ){　←10分割なので 10
　　Fill( hDC,
　　　0, (high * i + posY), wide, size,　←転送先(画面)
　　　0, (high * i + posY), wide, size );　←転送元(メモリ上)
　}
　Sleep( 100 );　←100ms(0.1秒)のウェイト
　posY -= 1;　←posY-- でもよい
　size += 2;
} while ( size <= high );

解説:
・上記の擬似サンプルは C 言語風に記述しています。C# も似た感じですが Fill()、Sleep() の
　関数名が多分違うはずです。Sleep() 関数は ms 単位でウェイトが入れられる関数です。
　Fill() 関数も説明の都合上の関数名です。
　上記では
　Fill( 画面のデバイスコンテキスト,
　　横位置, 縦位置, 横サイズ, 縦サイズ,　←転送先(画面)
　　横位置, 縦位置, 横サイズ, 縦サイズ );　←転送元(メモリ上)
　という意味で使っています。→Win32 API では BitBlt 関数などを使う。
　C# でメモリ上から画面に長方形領域を転送する関数に置き換えて下さい。
・以上。アルゴリズムという事なので上記を参考に。どうぞ。

この回答へのお礼

ありがとうございます！
お礼が遅くなってしまいすみません。
参考にさせていただきますね。

お礼日時：2007/05/24 23:23

No.2 回答者： Oh-Orange 回答日時： 2007/05/03 22:00

★追記。

・調べたら、同サイトでソースのダウンロードが出来ますよ。
　http://tokyo.cool.ne.jp/sdl/index7.html→『スクリーンエフェクト ScreenEffect』
　これを元に C# で書き直してみれば良いのでは。
　C言語で書かれていますので C 言語を知っていれば分かりやすいかと思いますが…。
　どうでしょうか。
・『ワイプ表示』という表現がよく分かりませんが、描画されている『絵』を細い線で
　段々に太くすれば『真っ黒』になりフェードアウトします。
・フェードインの場合は逆で『絵』を細い線で段々に太くして描画していけばできると
　思います。前回のアドバイス通りにタイマーなどと組み合わせてゆっくりと細い線から
　太い線になるように転送(描画)すればご希望通りの『ワイプ表示』の表現が出来ると
　思いますよ。
・以上。

参考URL：http://tokyo.cool.ne.jp/sdl/index7.html

この回答へのお礼

探していただいてありがとうございます。

ワイプ表示、種類がありますが、知りたいのは
上から順に線で埋め尽くされていくブラインド（ワイプイン）です。
以外に説明するのが難しいですね。

お礼日時：2007/05/06 19:52

No.1 回答者： Oh-Orange 回答日時： 2007/05/03 21:35

★最初に『ワイプ表示』の動作が分かりません。

・ブラインドのような画像は見ましたが、次はどうなる？
　もうちょっと表示のステップを順に書いてくれないと分かりません。
　あるいは動画などを何処かで見つけて『こんな感じ』っていう説明でないとね。
　分かりません。
・でも、ちょっとしたアドバイスとしてタイマーを使って画像の一部を順番に
　描画していけば良いと思います。タイマー間隔と単純なカウンタを用意して
　そのカウンタから描画する部分を決めておけば、いろいろなスライドショーの
　演出が出来ると思います。
・また、表示するウインドウのデバイスコンテキスト(画面)以外にもう一つメモリを
　用意してダブルバッファでやり取りすれば変にちらつかず綺麗にもなります。
・以上。補足要求します。→もうちょっと詳しく『ワイプ表示』の仕組みを。