スキャンライン効果を実装するにはどうすればよいですか?


8

私はlibgdxの古いプラットフォーマーに取り組んでおり、次のような「スキャンライン」効果を持たせたいです。

マルディータカスティーリャスキャンライン効果

私の最初の試みは、小さなテクスチャを作成し、それをフルスクリーンのクワッドに描画することでした。2つの異なる正射カメラモードを使用しました(1つはゲームのメインタイルマップ用、もう1つはスキャンラインテクスチャをレンダリングするため)。テクスチャがタイルマップにスタックしていることもあれば、大きすぎて画面全体が黒く覆われていることもあります。

2台のカメラとテクスチャを使用する私のアプローチは妥当ですか?この効果を達成するための良い解決策は何ですか?

回答:


4

単純に大フルスクリーンクワッド上に小さな走査線風合いをレンダリングの問題点は、テクスチャが何を作り、スケールアップすることがあるだったテクスチャーで、シングルピクセル走査線のセット(あなたの補間方法に応じて)非常に厚い、ぼやけ、および一般的に醜い。

代わりに並べるべきです1:1のピクセル対テクセル比を維持するような方法でクワッド全体のテクスチャ。これには、クワッドのテクスチャ座標が最も遠い範囲で1より大きくなるように調整し、テクスチャラップパラメータをクランプではなく繰り返すように設定することも含まれます。テクスチャが64x64ピクセルで、画面が1024x768ピクセルの場合、X軸でテクスチャを16回(1024/64)並べる必要があることがわかります。同様に、Y軸では12回(768/64)並べる必要があります。テクスチャと画面の実際の境界に合わせて、この計算を調整できます。これらの数値(16と12)をクワッドのテクスチャ座標の最大範囲として使用すると、はるかに優れた結果が得られます。タイルの正投影が現在どのように設定されているかに応じて、これをレンダリングするために変更する必要がない場合もあります。

または、シェーダーアプローチを使用することもできます。通常のシーンをテクスチャーにレンダリングし、そのテクスチャーをフルスクリーンクワッドとしてレンダリングしますが、ピクセルの奇数のラインをすべて省略します。シェーダーの画面の境界がわかっている場合は、これをかなり簡単に行うことができます(これは疑似コードであり、あいまいなHLSL風ですが、簡単に変換する必要があります)。

float2    screenSize;
sampler2D textureSampler;
float2    textureCoordinate;

float4 main () { 
   // Interpolation of texture coordinates means that we don't get nice
   // integer boundaries we could take the modulus of.
   float half_y = textureCoordinate.y * screenSize.y * 0.5;
   float delta = round(half_y) - half_y;
   float delta_squared = delta * delta;
   if (delta_squared < 0.1) {
      return texture2D(textureSampler, textureCoordinate);
   } 

   return float4(0,0,0,0);
}

0

カメラを使用する際の問題は、画像を拡大縮小することです。基本的に必要なのは、常に同じ画像を同じサイズ(100%)で描画することです。常に画面全体を覆うのに十分な大きさだと思います。

この場合、1つの解決策は、カメラの逆変換を画像に適用して、「ピクセルパーフェクト」サイズで描画することです。

より簡単なオプションは、自分でスケーリングすることです。例えば。カメラを75%にズームすると、画像は133%に拡大されます(1/0.75)。


あなたは、画像が画面全体をカバーするのに十分な大きさでなければならない、と言います、小さなテクスチャで少し長方形を埋めることは可能ではないでしょうか?
Alexandre GUIDET 2013年

@AlexandreGUIDETわかりません。フェードインとフェードアウトにテクスチャを使用し、1x1ピクセルでスケーリングします。スキャンラインについては、それを繰り返して欲しい。libGDXにこのオプションがあるかどうかを確認する必要があります。
ashes999 2013年

@AlexandreGUIDETこれを試しましたか?
ashes999 2013

別のカメラを使用して別の方法を選択し、シーンの上にスキャンライン効果を描画します。シーンがスキャンラインの後ろにずれているように見えるので、私はまだ結果に満足していません。代わりにシェーダーを使用することについてどう思いますか?
Alexandre GUIDET 2013
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.