Cómo: Crear un sombreador de textura básicoHow to: Create a basic texture shader

En este artículo se muestra cómo usar el Diseñador de sombras y el lenguaje DGSL (Directed Graph Shader Language) para crear un sombreador de una textura.This article demonstrates how to use the Shader Designer and the Directed Graph Shader Language (DGSL) to create a single-texture shader. Este sombreador establece directamente el color final en los valores RGB y alfa muestreados de la textura.This shader sets the final color directly to the RGB and alpha values that are sampled from the texture.

Crear un sombreador de textura básicoCreate a basic texture shader

Puede implementar un sombreador básico de una sola textura escribiendo los valores de color y alfa de una muestra de textura directamente en el color de salida final.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.

Antes de empezar, asegúrese de que se muestran la ventana Propiedades y el Cuadro de herramientas.Before you begin, make sure that the Properties window and the Toolbox are displayed.

  1. Cree un sombreador DGSL con el que trabajar.Create a DGSL shader to work with. Para obtener información sobre cómo agregar un sombreador DGSL al proyecto, vea la sección Introducción de Diseñador de sombras.For information about how to add a DGSL shader to your project, see the Getting Started section in Shader Designer.

  2. Elimine el nodo Color de punto.Delete the Point Color node. En el modo Seleccionar, seleccione el nodo Color de punto y, después, en la barra de menús, elija Editar > Eliminar.In Select mode, select the Point Color node, and then on the menu bar, choose Edit > Delete. Esto hace sitio para el nodo que se agrega en el paso siguiente.This makes room for the node that's added in the next step.

  3. Agregue un nodo Muestra de textura al gráfico.Add a Texture Sample node to the graph. En el Cuadro de herramientas, en Textura, seleccione Muestra de textura y muévala a la superficie de diseño.In the Toolbox, under Texture, select Texture Sample and move it to the design surface.

  4. Agregue un nodo Coordenada de textura al gráfico.Add a Texture Coordinate node to the graph. En el Cuadro de herramientas, en Textura, seleccione Coordenada de textura y muévala a la superficie de diseño.In the Toolbox, under Texture, select Texture Coordinate and move it to the design surface.

  5. Elija una textura para aplicar.Choose a texture to apply. En el modo Seleccionar, seleccione el nodo Muestra de textura y, después, en la ventana Propiedades, especifique la textura que quiere usar mediante la propiedad Nombre de archivo.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. Cree la textura públicamente accesible.Make the texture publicly accessible. Seleccione el nodo Muestra de textura y, después, en la ventana Propiedades, establezca la propiedad Acceso en Público.Select the Texture Sample node, and then in the Properties window, set the Access property to Public. Ahora puede configurar la textura desde otra herramienta, como el Editor de modelos.Now you can set the texture from another tool, such as the Model Editor.

  7. Conecte las coordenadas de textura a la muestra de textura.Connect the texture coordinates to the texture sample. En el modo Seleccionar, mueva el terminal Salida del nodo Coordenada de textura al terminal UV del nodo Muestra de textura.In Select mode, move the Output terminal of the Texture Coordinate node to the UV terminal of the Texture Sample node. Esta conexión muestrea la textura en las coordenadas especificadas.This connection samples the texture at the specified coordinates.

  8. Conecte la muestra de textura al color final.Connect the texture sample to the final color. Mueva el terminal RGB del nodo Muestra de textura al terminal RGB del nodo Color final y, después, mueva el terminal Alfa del nodo Muestra de textura al terminal Alfa del nodo Color final.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.

La ilustración siguiente muestra el gráfico de sombreador completo y una vista previa del sombreador aplicado a un cubo.The following illustration shows the completed shader graph and a preview of the shader applied to a cube.

Nota

En esta ilustración, se usó un plano como la forma de vista previa y se especificó una textura para demostrar mejor el efecto del sombreador.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.

Gráfico de sombreador y vista previa de su efecto

Es posible que algunas formas proporcionen mejores vistas previas para algunos sombreadores.Certain shapes might provide better previews for some shaders. Para más información sobre cómo obtener una vista previa de los sombreadores en el Diseñador de sombras, vea Diseñador de sombrasFor more information about how to preview shaders in the Shader Designer, see Shader Designer

Vea tambiénSee also