ステップ1 - ステンシルを作成する¶

このチュートリアルのこのステップでは、ステンシルを作成し、ステンシルとコンテンツを別々にレンダリングする準備をします。次のステップでは、レンダーパスを使用して、ステンシルの形状で定義された領域内の3Dコンテンツのみを表示します。

チュートリアルを入手する¶

チュートリアルを入手するには、Kanzi Studio Quick Start ウィンドウで Projects をクリックし、Tutorials タブを選択します。Stencil チュートリアルの横にあるダウンロードをクリックします。

Kanzi Studio はチュートリアルを <KanziWorkspace>/Tutorials ディレクトリにダウンロードします。以下が含まれています。

<KanziWorkspace>/Tutorials/Stencil/Start/Tool_project ディレクトリにあるチュートリアルの開始地点プロジェクト。
<KanziWorkspace>/Tutorials/Stencil/Completed ディレクトリにある完成したチュートリアル。

このチュートリアルは、データソースチュートリアルのプラグインに依存しています。

データソースチュートリアルを入手するには、Kanzi Studio Quick Start ウィンドウで Projects をクリックし、Tutorials タブを選択します。Data sources チュートリアルの横にあるダウンロードをクリックします。

Kanzi Studio は、チュートリアルを <KanziWorkspace>/Tutorials ディレクトリにダウンロードします。

開始プロジェクトの内容¶

スタートポイントとなるプロジェクトには、このチュートリアルを完了するのに必要なコンテンツが含まれています。

プロジェクトには、スピードゲージの左側に連絡先リストを含むクラスターがあります。このチュートリアルでは、この連絡先リストにステンシルを適用します。

RootNode > Viewport 2D > ContactsList ノードには連絡先のリストが含まれています。このプロジェクトは XML_data_source プラグインを使用して ContactsList ノードのデータを取得します。
Library > Meshes > StencilMesh には、表示したい ContactsList ノードの領域を定義するために使用する形状が含まれています。

ステンシルを作成する¶

このセクションでは、Model ノードを使用してステンシルを作成し、表示したい ContactsList ノードの領域を決定します。

ステンシルを作成するには、以下のようにします。

Kanzi Studio Quick Start ウィンドウで Projects をクリックし、Tutorials タブを選択します。Stencil チュートリアルの横にある Open をクリックし、Start project を選択します。
Node Tree で RootNode > Viewport 2D > Scene ノードを Alt を押しながら右クリックし、Model を選択して Stencil という名前を付け、Properties で Mesh プロパティを StencilMesh に設定します。
Node Tree で Stencil ノードを選択し、Properties で Render Transformation プロパティを追加し、設定します。
- Scale プロパティフィールドを40に設定
- Translation X プロパティフィールドを2にする
- Translation Z プロパティフィールドを -1 に設定します。
Stencil ノードのサイズと位置をクラスター内のコンテンツに関連して設定します。Preview では、連絡先リスト内のアイテムの間の隙間を通して赤い StencilMesh の形を部分的に見ることができます。

ステンシルとコンテンツを別々にレンダリングする準備をする¶

このセクションでは、Tag Filter リソースを使用して、Stencil ノードと ContactsList ノードを個別に選択します。チュートリアルの次のステップでは、これらのフィルタをレンダーパスで使用して、Stencil ノードと ContactsList ノードのレンダリングを分離します。

ステンシルとコンテンツを別々にレンダリングする準備をするには:

Node Tree で RootNode > Viewport 2D > Scene > Stencil ノードを選択し、Properties で Tags プロパティを Stencil に設定します。

ヒント

プロジェクト内のノードをグループ化、検索、フィルタリングするにはタグを使用します。単一のノードに複数のタグを割り当てることができます。
Stencil ノードを選択する Tag Filter を作成します。
1. Library > Rendering Alt を押しながら右クリック Object Sources で、Tag Filter を選択し、Stencil Filter と名付けます。
  
  Tag Filter は、特定のタグが割り当てられている3Dノードを収集します。
2. Properties で、Included Tags プロパティを Stencil タグに設定します。これにより、Stencil タグを持つノードを選択するフィルタを設定します。このフィルタは、このチュートリアルの次のステップで、レンダリングのために Stencil ノードを選択するために使用します。
前のステップを繰り返しますが、Tag Filter を Content Filter と名付け、Properties では Excluded Tags を Stencil タグに設定します。フィルタを設定して、Stencil タグを持たないノードを選択します。このフィルタをこのチュートリアルの次のステップで使用して、レンダリングのために ContactsList と Directional Light ノードを収集します。