方法: 基本テクスチャ シェーダーを作成するHow to: Create a Basic Texture Shader

このドキュメントでは、シェーダー デザイナーと DGSL (Directed Graph Shader Language) を使用して単一テクスチャ シェーダーを作成する方法を説明します。This document demonstrates how to use the Shader Designer and the Directed Graph Shader Language (DGSL) to create a single-texture shader. このシェーダーは、テクスチャからサンプリングされる RGB とアルファ値に直接最終的な色を設定します。This shader sets the final color directly to the RGB and alpha values that are sampled from the texture.

このドキュメントでは、以下のアクティビティについて説明します。This document demonstrates these activities:

  • シェーダー グラフからのノードの削除Removing nodes from a shader graph

  • グラフへのノードの追加Adding nodes to a graph

  • シェーダー パラメーターの設定Setting shader parameters

  • パラメーターの可視性の設定Setting parameter visibility

  • ノードの接続Connecting nodes

基本的なテクスチャ シェーダーの作成Creating a basic texture shader

テクスチャ サンプルのカラー値とアルファ値を直接最終的な出力色に記述することで、基本的な単一テクスチャ シェーダーを実装できます。You can implement a basic, single-texture shader by writing the color and alpha values of a texture sample directly to the final output color.

開始する前に、[プロパティ] ウィンドウとツールボックスが表示されていることを確認します。Before you begin, make sure that the Properties window and the Toolbox are displayed.

基本的なテクスチャ シェーダーを作成するにはTo create a basic texture shader

  1. 操作する DGSL シェーダーを作成します。Create a DGSL shader to work with. プロジェクトに DGSL シェーダーを追加する方法に関する詳細については、「シェーダー デザイナー」の「作業の開始」セクションを参照してください。For information about how to add a DGSL shader to your project, see the Getting Started section in Shader Designer.

  2. [ポイントの色] ノードを削除します。Delete the Point Color node. [選択] モードで [ポイントの色] ノードを選択し、メニュー バーで [編集][削除] を選択します。In Select mode, select the Point Color node, and then on the menu bar, choose Edit, Delete. これにより、次の手順で追加するノードのための領域を確保できます。This makes room for the node that's added in the next step.

  3. グラフに [テクスチャ サンプル] ノードを追加します。Add a Texture Sample node to the graph. ツールボックス[テクスチャ][テクスチャ サンプル] を選択し、デザイン サーフェイスに移動します。In the Toolbox, under Texture, select Texture Sample and move it to the design surface.

  4. グラフに [テクスチャ座標] ノードを追加します。Add a Texture Coordinate node to the graph. ツールボックス[テクスチャ][テクスチャ座標] を選択し、デザイン サーフェイスに移動します。In the Toolbox, under Texture, select Texture Coordinate and move it to the design surface.

  5. 適用するテクスチャを選択します。Choose a texture to apply. [選択] モードで [テクスチャ サンプル] ノードを選択してから、[プロパティ] ウィンドウで [ファイル名] プロパティを使って、使用するテクスチャを指定します。In Select mode, select the Texture Sample node, and then in the Properties window, specify the texture that you want to use by using the Filename property.

  6. テクスチャをパブリックにアクセスできるようにします。Make the texture publicly accessible. [テクスチャ サンプル] ノードを選択してから、[プロパティ] ウィンドウで [アクセス] プロパティを [パブリック] に設定します。Select the Texture Sample node, and then in the Properties window, set the Access property to Public. これでモデル エディターなどの別のツールからのテクスチャを設定できます。Now you can set the texture from another tool, such as the Model Editor.

  7. テクスチャ座標をテクスチャ サンプルに接続します。Connect the texture coordinates to the texture sample. [選択] モードで、[テクスチャ座標] ノードの [出力] ターミナルを [テクスチャ サンプル] ノードの [UV] ターミナルに移動します。In Select mode, move the Output terminal of the Texture Coordinate node to the UV terminal of the Texture Sample node. この接続は、指定された座標でテクスチャをサンプリングします。This connection samples the texture at the specified coordinates.

  8. テクスチャ サンプルを最終的な色に接続します。Connect the texture sample to the final color. [テクスチャ サンプル] ノードの [RGB] ターミナルを [最終的な色] ノードの [RGB] ターミナルに移動してから、[テクスチャ サンプル] ノードの [アルファ] ターミナルを [最終的な色] ノードの [アルファ] ターミナルに移動します。Move the RGB terminal of the Texture Sample node to the RGB terminal of the Final Color node, and then move the Alpha terminal of the Texture Sample node to the Alpha terminal of the Final Color node.

    次の図は、完成したシェーダー グラフと、立体に適用されるシェーダーのプレビューを示します。The following illustration shows the completed shader graph and a preview of the shader applied to a cube.

注意

この図では、平面がプレビューの図形として使用され、テクスチャはシェーダーの効果がわかりやすくなるように指定されています。In this illustration, a plane is used as the preview shape, and a texture has been specified to better demonstrate the effect of the shader.

シェーダー グラフとその効果のプレビューShader graph and a preview of its effect

特定の図形を使用すると、一部のシェーダーをより適切にプレビューできる可能性があります。Certain shapes might provide better previews for some shaders. シェーダー デザイナーでシェーダーをプレビューする方法の詳細については、「シェーダー デザイナー」を参照してください。For more information about how to preview shaders in the Shader Designer, see Shader Designer

関連項目See Also

方法: シェーダーを 3-D モデルに適用する How to: Apply a Shader to a 3-D Model
イメージ エディター Image Editor
シェーダー デザイナー Shader Designer
シェーダー デザイナー ノードShader Designer Nodes