アンチエイリアスの適用

アンチエイリアシングを Kanzi アプリケーション全体に適用することも、選択したノードにのみ適用することもできます。

  • アプリケーションの大部分のコンテンツでアンチエイリアシングが必要な場合は、アプリケーション全体に適用してください。アプリケーション全体へのアンチエイリアシングの適用 を参照してください。

  • アプリケーションの一部のパーツでのみアンチエイリアシングが必要な場合は、それらのパーツでのみサンプリングを使用します。

    • マルチサンプリングを使えば必要な処理能力が減りますが、すべてのハードウェアでこれを使用できるわけではありません。マルチサンプリングの使用 を参照してください。

    • スーパーサンプリングはより多くのリソースを必要としますが、より多くのハードウェアで使用できます。スーパーサンプリングの使用 を参照してください。

デフォルトで、Windows上の Kanzi Studio Preview と Kanzi Application Player は4サンプルを使用してアンチエイリアスを適用します。どちらも、使用したいアンチエイリアスの量を設定することができます。

Preview と Application Player でアンチエイリアスを設定する を参照してください。

アプリケーション全体へのアンチエイリアシングの適用

アプリケーション全体にアンチエイリアスを適用する場合、使用したいアンチエイリアスサーフェスサンプルの数を設定します。この値は、Kanzi アプリケーションを実行したいデバイスに依存するため、そのデバイスのサポートされている値についてのドキュメントを確認してください。アンチエイリアスサーフェスサンプルの数をデバイスがサポートしていない値に設定した場合、Kanzi Engine はその値をデバイスドライバがサポートする最大値にクランプします。

アプリケーション全体にアンチエイリアシングを適用するには:

  • application.cfg の構成ファイルで、SurfaceSamplesAntialiasing パラメータを使用したいアンチエイリアスサーフェスサンプルの数に設定します。アプリケーション構成リファレンス を参照してください。

    たとえばアンチエイリアシングに4つのサンプルを使用するには、application.cfg に追加します。

    SurfaceSamplesAntialiasing = 4
    

または

  • C++アプリケーションの Application::onConfigure 関数で、configuration.defaultSurfaceProperties.antiAliasing パラメータを使用したいアンチエイリアスサーフェスサンプルの数に設定します。

    たとえばアンチエイリアシングに4つのサンプルを使用するには、Application::onConfigure に追加します。

    configuration.defaultSurfaceProperties.antiAliasing = 4;
    

SurfaceSamplesAntialiasing を参照してください。

Preview と Application Player でアンチエイリアスを設定する

デフォルトで、Windows上の Kanzi Studio Preview と Kanzi Application Player は4サンプルを使用してアンチエイリアスを適用します。どちらも、使用したいアンチエイリアスの量を設定することができます。

Kanzi アプリケーションを C++ アプリケーションと共に使用している場合、ターゲットデバイスで Kanzi アプリケーションを実行するのと同じように、Kanzi Studio Preview と Kanzi Application Player でコンテンツを表示するには、application.cfg ファイルでアンチエイリアスを設定できます。アプリケーション全体へのアンチエイリアシングの適用 を参照してください。

C++アプリケーションなしで Kanzi アプリケーションの Kanzi Studio Preview でアンチエイリアスを設定するには、

  1. Kanzi Studio メインメニューで、Project > Properties を選択します。Preview セクションの Properties で、Preview Working Directory プロパティの値を、Preview を構成するために application.cfg を保存したいディレクトリに設定します。

    例えば、Preview Working Directory プロパティを Application Player に設定します。これにより、Windows上で Preview と Kanzi Application Player に同じアンチエイリアス設定を適用できます。<ProjectName>/Application Player ディレクトリがまだ存在しない場合は、File > Export > Export as KZB Player for Windows を選択します。Kanzi Studio から Windows への Kanzi アプリケーションのビルドとデプロイ を参照してください。

    ../../_images/project-properties-myproject.png ../../_images/preview-working-dir-application-player.png
  2. 前のステップで設定したディレクトリで、application.cfg ファイルを作成または開いてください。Preview が使用するアンチエイリアスサンプルの数を SurfaceSamplesAntialiasing パラメータに追加して設定してください。

    たとえば、Preview でアンチエイリアスを無効にするには、application.cfg で次を追加します。

    SurfaceSamplesAntialiasing = 0
    
  3. Kanzi Studio で、Preview を再起動します。

    ../../_images/preview-restart-button-gray.png

マルチサンプリングの使用

Kanzi アプリケーションの選択した部分でエイリアシングを低減するには、マルチサンプリング (MSAA) を使用します。マルチサンプリングはスーパーサンプリングよりも少ないリソースで済みます。ポリゴンをラスタライズするとき、マルチサンプリングではポリゴンのエッジのフラグメントに対してのみ追加のサンプルが生成されますが、スーパーサンプリングではポリゴンのすべてのフラグメントに対して追加のサンプルが生成されます。

(通常はモバイルプラットフォームで) タイルベースのマルチサンプリングを使用する場合、GPU は一度に 1 つの GPU タイルに対してのみ複数サンプルを生成します。GPU は、そのタイルをテクスチャメモリに書き戻す際にサンプルを暗黙的に解決し、メモリとGPU帯域幅を節約します。

最初の画像では、アンチエイリアスが適用されていません。2番目の画像では、8サンプルのマルチサンプリングが適用されています。

../../_images/anti-aliasing-off.png ../../_images/multisampling-8-samples.png

3Dコンテンツのマルチサンプリング

Kanzi がコンポジションターゲットにレンダリングする 3D コンテンツにマルチサンプルアンチエイリアシングを適用するには、コンテンツのレンダリングに使用する Composition Target レンダーパスで、Multisample Level プロパティを使用するアンチエイリアシングサンプルの数に設定します。

Kanzi アプリケーションを実行したいデバイスのドキュメントを参照して、サポートされている値を確認してください。アンチエイリアスサンプルの数はデバイスに依存するためです。デバイスがサポートしていない値に Multisample Level プロパティを設定した場合、Kanzi Engine はその値をデバイスドライバがサポートする最大値にクランプします。

例:

  1. Library で、Alt を押しながら右クリック Rendering を選択し、Compose and Blit Pass を選択します。

    Compose and Blit Pass には、特定のマテリアルを使用して Composition Target レンダーパスまたはテクスチャをスクリーンにブリットできるようにするレンダーパス構造が含まれています。

    Compose and Blit Pass レンダーパスプリセットには、次のレンダーパスが含まれています。

    • Composition Target レンダーパスは、自身とその子孫のレンダーパスを 1 つ以上のコンポジションターゲットにレンダリングします。

      • Clear レンダーパスは、現在のレンダーコンテキストのバッファの一部またはすべてをクリアします。

        デフォルトでは、Compose and Blit Pass 内の Clear レンダーパスは、最初のカラーバッファーを透明な黒でクリアし、デプスバッファーを値 1 でクリアします。

        たとえば、最初のカラーバッファーを別の色でクリアするには、Clear Color 0 プロパティを、Kanzi が Composition Target レンダーパスにレンダリングするコンテンツの背景色として使用する色に設定します。

      • Gather Lights レンダーパスは、Compose and Blit Pass を使用するように設定した Viewport 2D ノード内の Light ノードを収集し、それらを子の Draw Objects レンダーパスに渡します。

        • Draw Objects という名前の Draw Objects レンダーパスでは、特定のノードのリストをレンダリングするように Camera ノードを設定したり、それらのノードをフィルタリングしたり、フラスタムカリングを制御したりできます。Draw Objects レンダーパスは、デフォルトでは、最も近い祖先の Gather Lights レンダーパスが提供するライトを使用してノードをレンダリングします。デフォルトでは、Draw Objects レンダーパスはデフォルトの Camera ノードを使用して Viewport 2D ノード内のすべてのノードをレンダリングします。

    • Blit レンダーパスは、特定のマテリアルを使用して、1 つ以上の単一テクスチャまたはキューブマップテクスチャを画面にブリットします。

      デフォルトでは、この Blit レンダーパスは、Composition Target レンダーパスがコンテンツをレンダリングする最初のカラーテクスチャを画面に描画します。

      ../../_images/compose-and-blit-pass-create.png ../../_images/compose-and-blit-pass-library.png
  2. Node Tree または Prefabs で、エイリアシングを低減したいコンテンツの Viewport 2D ノードを選択します。Properties で、Render Pass Prefab プロパティを Compose and Blit Pass レンダーパスプレハブに設定します。

    Kanzi は、Viewport 2D ノードでシーンをレンダリングし、Compose and Blit Pass レンダーパスプレハブを使用します。

    ../../_images/viewport-2d-in-the-project.png ../../_images/render-pass-prefab-set-to-compose-and-blit-pass.png ../../_images/anti-aliasing-off.png
  3. Library で、Compose and Blit Pass > Composition Target レンダーパスを選択します。Properties で、Multisample Level プロパティを追加し、使用するアンチエイリアシングのサンプル数に設定します。

    例えば、Multisample Level を8に設定します。

    Kanzi アプリケーションを実行したいデバイスのドキュメントを参照して、サポートされている値を確認してください。アンチエイリアスサンプルの数はデバイスに依存するためです。デバイスがサポートしていない値に Multisample Level プロパティを設定した場合、Kanzi Engine はその値をデバイスドライバがサポートする最大値にクランプします。

    ../../_images/multisample-level.png

Kanzi は、Viewport 2D ノードのコンテンツにアンチエイリアスを適用します。

../../_images/multisampling-8-samples.png

2Dコンテンツのマルチサンプリング

2Dノードのコンテンツ Kanzi を合成ターゲットにレンダリングする場合、マルチサンプルアンチエイリアシングを適用できます。使用するアンチエイリアシングサンプルの数を設定するには、Render Target > Multisample Level プロパティを使用します。

Kanzi アプリケーションを実行したいデバイスのドキュメントを参照して、サポートされている値を確認してください。アンチエイリアスサンプルの数はデバイスに依存するためです。デバイスがサポートしていない値に Multisample Level プロパティを設定した場合、Kanzi Engine はその値をデバイスドライバがサポートする最大値にクランプします。

例:

  1. Node Tree または Prefabs で、エイリアスを低減したいコンテンツの 2D ノードを選択します。

    例えば、Image ノードを含むレイアウトコントロールノードを作成します。各 Image ノードを数度回転させます。

    ../../_images/node-tree-flow-layout.png ../../_images/preview-flow-layout-no-effect.png
  2. 2Dノードのコンテンツを合成ターゲットにレンダリングするように Kanzi を設定するには、Properties で次のいずれかを行います。

    • Node 2D > Force Composition プロパティを追加して有効にします。

      この方法で、Kanzi にノードをコンポジションターゲットにレンダリングさせます。

      ../../_images/properties-force-composition.png
    • Kanzi がノードをコンポジションターゲットに自動的にレンダリングするようにするプロパティ値を設定します。

      例えば、子ノードを持つ2Dノードの不透明度を調整したり、エフェクトを適用したりする場合、Kanzi はそのノードを一時的な合成ターゲットにレンダリングします。

      ../../_images/properties-opacity.png ../../_images/properties-effect-prefab.png
    ../../_images/preview-no-msaa.png
  3. Properties で、使用したいアンチエイリアスサンプルの数を Render Target > Multisample Level プロパティに追加して設定します。

    Kanzi アプリケーションを実行したいデバイスのドキュメントを参照して、サポートされている値を確認してください。アンチエイリアスサンプルの数はデバイスに依存するためです。デバイスがサポートしていない値に Multisample Level プロパティを設定した場合、Kanzi Engine はその値をデバイスドライバがサポートする最大値にクランプします。

    ../../_images/properties-multisample-level.png ../../_images/preview-4x-msaa.png

スーパーサンプリングの使用

ハードウェアがマルチサンプリングをサポートしていない場合、Kanzi アプリケーションの選択された部分でエイリアシングを低減するためにスーパーサンプリング (SSAA) を使用します。スーパーサンプリングはマルチサンプリングよりも多くのリソースを必要とします。ポリゴンをラスタライズする際、スーパーサンプリングはポリゴン内のすべてのフラグメントに対して追加のサンプルを生成しますが、マルチサンプリングはポリゴンのエッジにあるフラグメントに対してのみ追加のサンプルを生成します。

コンポジションターゲットのスーパーサンプリング

Composition Target レンダーパスで 3D コンテンツをレンダリングする場合、コンポジションターゲットテクスチャをスーパーサンプリングできます。コンポジションターゲットテクスチャをスーパーサンプリングするには、Composition Target レンダーパスが自動的に作成するコンポジションターゲットを使用する必要があります。

コンポジションターゲットをスーパーサンプリングするには:

  1. Library で、Alt を押しながら右クリック Rendering を選択し、Compose and Blit Pass を選択します。

    Compose and Blit Pass には、特定のマテリアルを使用して Composition Target レンダーパスまたはテクスチャをスクリーンにブリットできるようにするレンダーパス構造が含まれています。

    Compose and Blit Pass レンダーパスプリセットには、次のレンダーパスが含まれています。

    • Composition Target レンダーパスは、自身とその子孫のレンダーパスを 1 つ以上のコンポジションターゲットにレンダリングします。

      • Clear レンダーパスは、現在のレンダーコンテキストのバッファの一部またはすべてをクリアします。

        デフォルトでは、Compose and Blit Pass 内の Clear レンダーパスは、最初のカラーバッファーを透明な黒でクリアし、デプスバッファーを値 1 でクリアします。

        たとえば、最初のカラーバッファーを別の色でクリアするには、Clear Color 0 プロパティを、Kanzi が Composition Target レンダーパスにレンダリングするコンテンツの背景色として使用する色に設定します。

      • Gather Lights レンダーパスは、Compose and Blit Pass を使用するように設定した Viewport 2D ノード内の Light ノードを収集し、それらを子の Draw Objects レンダーパスに渡します。

        • Draw Objects という名前の Draw Objects レンダーパスでは、特定のノードのリストをレンダリングするように Camera ノードを設定したり、それらのノードをフィルタリングしたり、フラスタムカリングを制御したりできます。Draw Objects レンダーパスは、デフォルトでは、最も近い祖先の Gather Lights レンダーパスが提供するライトを使用してノードをレンダリングします。デフォルトでは、Draw Objects レンダーパスはデフォルトの Camera ノードを使用して Viewport 2D ノード内のすべてのノードをレンダリングします。

    • Blit レンダーパスは、特定のマテリアルを使用して、1 つ以上の単一テクスチャまたはキューブマップテクスチャを画面にブリットします。

      デフォルトでは、この Blit レンダーパスは、Composition Target レンダーパスがコンテンツをレンダリングする最初のカラーテクスチャを画面に描画します。

      ../../_images/compose-and-blit-pass-create.png ../../_images/compose-and-blit-pass-library.png
  2. Node Tree で、スーパーサンプリングしたいコンテンツを持つ Viewport 2D ノードを選択し、Properties で Render Pass Prefab プロパティを Compose and Blit Pass レンダーパスプレハブに設定します。

    Kanzi は、Viewport 2D ノードでシーンをレンダリングし、Compose and Blit Pass レンダーパスプレハブを使用します。

    ../../_images/viewport-2d-in-the-project.png ../../_images/render-pass-prefab-set-to-compose-and-blit-pass.png
  3. スーパーサンプリング対象ノードのレンダリングに使用する Composition Target レンダーパスで、Resolution Multiplier プロパティを追加し、コンポジションターゲットテクスチャの解像度に乗算する値に設定します。

    ../../_images/composition-target-render-pass-with-resolution-multiplier.png

レンダーターゲットテクスチャのスーパーサンプリング

Texture Brush や Image ノードの画像として使用するレンダーターゲットテクスチャをスーパーサンプリングすることができます。

レンダーターゲットテクスチャをスーパーサンプリングするには:

  1. Library Alt を押しながら右クリック Materials and Textures で、Render Target Texture を選択します。レンダーターゲットテクスチャ (Render Target Texture) を使用する を参照してください。

    これは、エイリアシング削減の対象となるノードのコンテンツをレンダリングするテクスチャです。

    ../../_images/create-render-target-texture.png
  2. Library で、先ほど作成した Render Target Texture を選択し、Properties で設定します。

    • レンダーターゲットテクスチャの Height と Width を、エイリアシングを軽減したいコンテンツの最終サイズの2倍にします。

      スケールダウンされる大きなテクスチャを使用する場合は、エイリアシングを発生させる粗いエッジを滑らかにします。

    • Minification Filter から Linear へ

    • Mipmap Mode から Base へ

    • Format から RGBA 8-bit へ

    ../../_images/render-target-texture-properties-supersampling.png
  3. Node Tree でスーパーサンプリングを適用したいノードを選択し、Properties で追加して設定します。

    • Off-Screen Rendering を有効にする

    • 最初のステップで作成したレンダーターゲットテクスチャに Render Target を設定します。

    ../../_images/render-target-properties.png
  4. 最初のステップで作成した Render Target Texture を、前のステップで選択したノードのスーパーサンプリングされた画像を表示したいノードに適用します。

    例:

    1. Node Tree Alt を押しながら右クリック で Empty Node 2D を選択します。

    2. Node Tree で Empty Node 2D ノードを選択し、Properties で Background Brush プロパティを追加し、ドロップダウンメニューで + Texture Brush を選択します。

      ../../_images/select-create-texture-brush.png
    3. Background Brush プロパティの横にある image0 をクリックし、最初のステップで作成した Empty Node 2D に表示したい Render Target Texture に Texture Brush の Brush Texture プロパティを設定します。

      ../../_images/image-property-render-target-texture.png
    4. Node Tree で Empty Node 2D を選択し、Properties で Layout Width と Layout Height プロパティを追加して設定し、Render Target Texture のコンテンツを表示したいサイズにします。

関連項目

アプリケーション構成リファレンス

レンダーターゲットテクスチャ (Render Target Texture) を使用する

コンポジションターゲットへのコンテンツのレンダリング

2Dノードのエフェクト

レンダリングのベストプラクティス