精华内容
下载资源
问答
  • ShaderGraph学习
  • 着色器图节点 Shader Graph自定义节点的集合。 数学>插值>缓和 添加对Robert Penner的缓动功能的支持。 过程>形状>星 添加对程序星形的支持 系统要求 Unity 2018.1或更高版本 执照 根据。
  • https://blog.csdn.net/nicepainkiller/article/details/104108444 ShaderGraph节点详解完整版 ShaderGraph节点详解完整版 https://blog.csdn.net/nicepainkiller/article/details/104108444
  • -- 在shader forge和amplyfy Shader节点图形化shader编程的诱惑下,unity官方终于在2018版本也推出了而自己shader节点可视化编程工具Shaderr Graph。本篇文章是对Shader Graph一些效果的尝试,建议学习shader的朋友...
  • LiliumToonGraph(实验性) トゥーシェーダーでもシェーダーダラフを使いたい! UniversalRP対応トゥーンシェーダーです。 アこれはトラインはマスタースタックのLilium Toonターゲットで実装しています。...
  • Unity2020.3版本水面倒影Shader案例 文章地址:https://zhima.blog.csdn.net/
  • DecalGraph.shadergraph

    2020-12-26 21:29:03
    自定义ShaderGraph
  • 该课程通过多个应用ShaderGraph的实例,由浅入深的系统示范了ShaderGraph的使用方法。前面的案例主要涉及顶点着色器功能,中间部分的案例主要涉及片元着色器功能,后面案例主要是综合应用,同时也涉及了一些渲染管线...
  • ShaderGraph详解

    2018-11-23 20:56:30
    ShaderGraph详解
  • Unity ShaderGraph节点完整学习资料。想学习unity3dshader的赶紧下载吧。
  • Unity ShaderGraph节点详解,最新的unity材质shader节点编辑器,节点示意非常 清楚,方便大伙入门
  • ShaderGraph案例工程

    2018-07-23 18:08:29
    这个项目是一个使用Unity 2018.1的SG特性创建的不同自定义着色器库。所有的着色器都兼容轻量级脚本渲染管道。
  • URP_ShaderGraphCustomLighting:用于Shader Graph,Universal Render Pipeline的一些自定义照明功能子图
  • 全息效果是通过贴图的Offset随时间滚动产生,ShaderGraph实战之全息效果
  • 噪声节点:向Unity Shader Graph添加各种噪声生成节点,包括3D噪声节点
  • 溶解效果是游戏中常用的一种效果,可用于Boss死亡时的消失。溶解效果的原理是通过一张噪波贴图,实现模型上随机消失。
  • 一个学习Shader的案例集,无论是ShaderGraph、ShaderForge还是Amplify Shader Editor,思路都是相通的。
  • ShaderGraph示例和演示 新的着色器示例的完整集合。 Unity制作的基于节点的着色器创建工具 克隆 该存储库包含用于外部依赖项的子模块,因此在执行新克隆时,需要递归克隆: git clone --recursive ...
  • Unity 2018.1的ShaderGraph示例的汇编 ================================================== ====== 着色器图简介:使用可视编辑器构建着色器 ShaderGraphExamples-master ShaderGraph_Example库主 阿尔特
  • 大智和你一起学习ShaderGraph,在实战中探索。 课程内容 ShaderGraph的基本使用 丰富的实战案例: · 全息效果 · 边缘光效果 · 溶解效果 · 积雪效果 · 扭曲效果 · 干扰效果 · 流光效果 · 石化效果 ...
  • 我们已经搬家了! 快来存储库访问我们。
  • 该项目附带示例图,以展示使用Shader Graph的自定义照明技术。 可以在随附的博客文章中找到有关照明技术的详细信息。 加载项目时,您可以在自述文件检查器中找到有关项目内容的更多信息。 如果您不知道如何克隆此...
  • shader graphWith the release of Unity Editor 2019.1, the Shader Graph package officially came out of preview! Now, in 2019.2, we’re bringing even more features and functionality to Shader Graph. ...

    shader graph

    With the release of Unity Editor 2019.1, the Shader Graph package officially came out of preview! Now, in 2019.2, we’re bringing even more features and functionality to Shader Graph. 

    随着Unity Editor 2019.1的发布,Shader Graph包正式退出预览! 现在,在2019.2中,我们将为Shader Graph带来更多功能。

    2019年有何变化? (What’s Changed in 2019?)

    自定义功能和子图升级 (Custom Function and Sub Graph Upgrades)

    To maintain custom code inside of your Shader Graph, you can now use our new Custom Function node. This node allows you to define your own custom inputs and outputs, reorder them, and inject custom functions either directly into the node itself, or by referencing an external file.  

    要在“着色器图”中维护自定义代码,现在可以使用我们新的“自定义功能”节点。 该节点允许您定义自己的自定义输入和输出,对其进行重新排序,以及将自定义函数直接注入节点本身或通过引用外部文件。

    Sub Graphs have also received an upgrade: you can now define your own outputs for Sub Graphs, with different types, custom names, and reorderable ports. Additionally, the Blackboard for Sub Graphs now supports all data types that the main graph supports. 

    子图也得到了升级:现在,您可以为子图定义自己的输出,具有不同的类型,自定义名称和可重新排序的端口。 此外,Blackboard for Sub Graphs现在支持主图支持的所有数据类型。

    色彩模式和精度模式 (Color Modes and Precision Modes)

    Using the Shader Graph to create powerful and optimized shaders just got a little easier. In 2019.2, you can now manually set the precision of calculations in your graph, either graph-wide or on a per-node basis. Our new Color Modes make it fast and easy to visualize the flow of Precision, the category of nodes, or display custom colors for your own use! 

    使用“ Shader Graph”创建功能强大且经过优化的着色器变得更加容易。 在2019.2中,您现在可以在图形范围内或在每个节点的基础上手动设置图形中的计算精度。 我们新的色彩模式使您可以快速,轻松地查看Precision的流程,节点类别或显示自定义颜色供您自己使用!

    See the Shader Graph documentation for more information about these new features.

    有关这些新功能的更多信息, 请参见 Shader Graph文档

    样例项目 (Sample Project)

    To help you get started with the new custom function workflow, we’ve created an example project together with step-by-step instructions. Download the project from our repository and follow along! This project will show you how to use the Custom Function node to write custom lighting shaders for the Lightweight Render Pipeline (LWRP). If you want to follow along using a fresh project, make sure you’re using the 2019.2 Editor and  LWRP package version 6.9.1 or higher.

    为了帮助您开始使用新的自定义功能工作流程,我们创建了一个示例项目以及逐步说明。 从我们的资源库 下载项目 ,然后继续! 该项目将向您展示如何使用“自定义功能”节点为“轻量级渲染管道”(LWRP)编写自定义照明着色器。 如果要继续使用新项目,请确保使用的是2019.2编辑器和LWRP软件包6.9.1或更高版本。

    从主光源获取数据 (Getting Data from the Main Light)

    To get started, we need to get information from the main light in our Scene. Start by selecting Create > Shader > Unlit Graph to create a new Unlit Shader Graph. In the Create Node menu, locate the new Custom Function node, and click the gear icon on the top right to open the node menu.

    首先,我们需要从场景中的主光源获取信息。 首先选择“ 创建”>“着色器”>“非照明图” 以创建一个新的“非照明着色器图”。 在“创建节点”菜单中,找到新的“自定义功能”节点,然后单击右上角的齿轮图标以打开节点菜单。

    In this menu, you can add inputs and outputs. Add two output ports for Direction and Color, and select Vector 3 for both. If you see an “undeclared identifier” error flag, don’t be worried; this will go away when we start to add our code. In the Type dropdown menu, select String. Update your function name — in this example, we’re using “MainLight”. Now, we can start adding our custom code in the text box. 

    在此菜单中,您可以添加输入和输出。 为 DirectionColor 添加两个输出端口 ,然后 为两个都 选择 Vector 3 。 如果看到“未声明的标识符”错误标志,请不要担心。 当我们开始添加代码时,这将消失。 在 类型 下拉菜单中,选择 字符串 。 更新您的函数名称-在此示例中,我们使用“ MainLight”。 现在,我们可以开始在文本框中添加我们的自定义代码。

    First, we’re going to use a flag called #ifdef SHADERGRAPH_PREVIEW. Because the preview boxes on nodes don’t have access to light data, we need to tell the node what to display on the in-graph preview boxes. #ifdef tells the compiler to use different code in different situations. Start by defining your fallback values for the output ports.

    首先,我们将使用一个名为#ifdef SHADERGRAPH_PREVIEW的标志。 由于节点上的预览框无法访问光照数据,因此我们需要告诉节点在图形内预览框中显示的内容。 #ifdef告诉编译器在不同情况下使用不同的代码。 首先定义输出端口的后备值。

    1

    2
    3
    #if SHADERGRAPH_PREVIEW
    Direction = half3(0.5, 0.5, 0);
    Color = 1;

    1

    2
    3
    #if SHADERGRAPH_PREVIEW
    Direction = half3 ( 0.5 , 0.5 , 0 ) ;
    Color = 1 ;

    Next, we’ll use #else to tell the compiler what to do when not in a preview. This is where we actually get our light data. Use the built-in function GetMainLight() from the LWRP package. We can use this information to assign the Direction and Color outputs. Your custom function should now look like this:

    接下来,我们将使用#else告诉编译器不在预览时的操作。 这是我们实际获取灯光数据的地方。 使用LWRP包中的内置函数GetMainLight() 。 我们可以使用此信息来分配“ 方向” 和“ 颜色” 输出。 您的自定义函数现在应如下所示:

    1

    2
    3
    4
    5
    6
    7
    8
    #if SHADERGRAPH_PREVIEW
    Direction = half3(0.5, 0.5, 0);
    Color = 1;
    #else
    Light light = GetMainLight();
    Direction = light.direction;
    Color = light.color;
    #endif

    1

    2
    3
    4
    5
    6
    7
    8
    #if SHADERGRAPH_PREVIEW
    Direction = half3 ( 0.5 , 0.5 , 0 ) ;
    Color = 1 ;
    #else
    Light light = GetMainLight ( ) ;
    Direction = light . direction ;
    Color = light . color ;
    #endif

    Now, it’s a good idea to add this node to a group so that you can mark down what it’s doing. Right-click the node, select Create Group from Selection, and then rename the group title to describe what your node is doing. Here we’ve entered “Get Main Light”. 

    现在,将这个节点添加到组中是一个好主意,以便您可以记下它在做什么。 右键单击该节点,选择“ 从Selection中创建组” ,然后重命名组标题以描述您的节点正在做什么。 在这里,我们输入了“获取主光源”。

    Now that we have our light data, we can calculate some shading. We’re going to start with a standard Lambertian lighting, so let’s take the dot product of the world normal vector and the light direction. Pass it into a Saturate node, and multiply it by the light color. Plug this into the Color port of the Unlit Master node, and your preview should update with some custom shading!

    现在我们有了光照数据,我们可以计算一些阴影了。 我们将从标准的Lambertian照明开始,让我们以世界法线向量和光方向的点积为例。 将其传递到饱和节点,然后将其乘以浅色。 将其插入 Unlit Master节点 的 Color 端口,您的预览应该使用一些自定义阴影进行更新!

    使用自定义功能文件模式 (Using the Custom Function File Mode)

    Since we now know how to get light data using the Custom Function node, we can expand on our function. Our next function gets attenuation values from the main light in addition to the direction and color. 

    由于现在我们知道如何使用“自定义功能”节点获取灯光数据,因此可以扩展功能。 我们的下一个功能除了获得方向和颜色之外,还从主光源获取衰减值。

    As this is a more complicated function, let’s switch to file mode, and use an HLSL include file. This lets you author more complicated functions in a proper code editor before injecting it into the graph. This also means that we have one unified location to debug the code from. 

    由于这是一个更复杂的功能,让我们切换到文件模式,并使用HLSL包含文件。 这使您可以在将适当的代码编辑器注入图形之前,编写更复杂的函数。 这也意味着我们有一个统一的位置可以从中调试代码。

    Start by opening the CustomLighting include file in the Assets > Include folder of the project. For now, we’ll only focus on the MainLight_half function. The function looks like this:

    首先打开 项目 的 Assets> Include 文件夹中的 CustomLighting包含文件 。 现在,我们仅关注MainLight_half函数。 该函数如下所示:

    1

    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    void MainLight_half(float3 WorldPos, out half3 Direction, out half3 Color, out half DistanceAtten, out half ShadowAtten)
    {
    #if SHADERGRAPH_PREVIEW
       Direction = half3(0.5, 0.5, 0);
       Color = 1;
       DistanceAtten = 1;
       ShadowAtten = 1;
    #else
    #if SHADOWS_SCREEN
       half4 clipPos = TransformWorldToHClip(WorldPos);
       half4 shadowCoord = ComputeScreenPos(clipPos);
    #else
       half4 shadowCoord = TransformWorldToShadowCoord(WorldPos);
    #endif
       Light mainLight = GetMainLight(shadowCoord);
       Direction = mainLight.direction;
       Color = mainLight.color;
       DistanceAtten = mainLight.distanceAttenuation;
       ShadowAtten = mainLight.shadowAttenuation;
    #endif
    }

    1

    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    void MainLight_half ( float3 WorldPos , out half3 Direction , out half3 Color , out half DistanceAtten , out half ShadowAtten )
    {
    #if SHADERGRAPH_PREVIEW
       Direction = half3 ( 0.5 , 0.5 , 0 ) ;
       Color = 1 ;
       DistanceAtten = 1 ;
       ShadowAtten = 1 ;
    #else
    #if SHADOWS_SCREEN
       half4 clipPos = TransformWorldToHClip ( WorldPos ) ;
       half4 shadowCoord = ComputeScreenPos ( clipPos ) ;
    #else
       half4 shadowCoord = TransformWorldToShadowCoord ( WorldPos ) ;
    #endif
       Light mainLight = GetMainLight ( shadowCoord ) ;
       Direction = mainLight . direction ;
       Color = mainLight . color ;
       DistanceAtten = mainLight . distanceAttenuation ;
       ShadowAtten = mainLight . shadowAttenuation ;
    #endif
    }

    This function includes some new input and output data, so let’s go back to our Custom Function node and add them. Add two new outputs for DistanceAtten (distance attenuation) and ShadowAtten (shadow attenuation). Then, add the new input for WorldPos (world position). Now that we have our inputs and outputs, we can reference the include file. Change the Type dropdown to File. In the Source input, navigate to the include file, and select the Asset to reference. Now, we need to tell the node which function to use. In the Name box, we’ve entered “MainLight”.

    该函数包括一些新的输入和输出数据,因此让我们回到“自定义函数”节点并添加它们。 为 DistanceAtten (距离衰减)和 ShadowAtten (阴影衰减) 添加两个新的输出 。 然后,为 WorldPos 添加新的输入 (世界位置)。 现在我们有了输入和输出,我们可以引用包含文件了。 将 类型 下拉列表 更改 为 文件 。 在源输入中,导航到包含文件,然后选择要引用的资产。 现在,我们需要告诉节点要使用哪个函数。 在“ 名称” 框中,我们输入了“ MainLight”。

    You’ll notice that the include file has _half at the end of the function name, but our name option doesn’t. This is because the Shader Graph compiler appends the precision format to each function name. Since we’re defining our own function, we need the source code to tell the compiler which precision format our function uses. In the node, however, we only need to reference the main function name. You can create a duplicate of the function that uses ‘float’ values to compile in float precision mode. The ‘Precision’ Color Mode lets you easily track the precision set for each node in the graph, with blue representing float and red representing half.

    您会注意到,包含文件的函数名称末尾有_half ,但我们的name选项没有。 这是因为Shader Graph编译器将精度格式附加到每个函数名称。 由于我们正在定义自己的函数,因此需要源代码来告诉编译器函数使用哪种精度格式。 但是,在节点中,我们只需要引用主函数名称。 您可以创建使用“ float”值在浮点精度模式下编译的函数的副本。 “精确度”颜色模式使您可以轻松跟踪图中每个节点的精确度设置,蓝色代表浮点数,红色代表一半。

    We’ll probably want to use this function again somewhere else, and the easiest way to make this Custom Function reusable is to wrap it in a Sub Graph. Select the node and its group, and then right-click to find Convert to Sub-graph. We’ve called ours “Get Main Light”. In the Sub Graph, simply add the required output ports to the Sub Graph output node, and plug the node’s output into the Sub Graph output. Next, we’ll add a world position node to plug into the input. 

    我们可能想在其他地方再次使用此函数,并使此自定义函数可重用的最简单方法是将其包装在Sub Graph中。 选择节点及其组,然后右键单击以找到“ 转换为子图形” 。 我们称其为“获取主灯”。 在Sub Graph中,只需将所需的输出端口添加到Sub Graph输出节点,然后将节点的输出插入Sub Graph输出。 接下来,我们将添加一个世界位置节点以插入输入中。

    Save the Sub Graph, and go back to our unlit graph. We’re going to add two new multiply nodes to our existing logic. First, multiply the two attenuation outputs together. Then, multiply that output by the light color. We can multiply this by NdotL from earlier to properly calculate attenuation in our basic shading.

    保存子图,然后返回到我们未打开的图。 我们将向现有逻辑中添加两个新的乘法节点。 首先,将两个衰减输出相乘。 然后,将输出乘以浅色。 我们可以将其乘以 较早 的 NdotL 来正确计算基本阴影中的衰减。

    创建直接镜面着色器 (Creating a Direct Specular Shader)

    The shader we’ve made is great for matte objects, but what if we want some shine? We can add our own specular calculations to our shader! For this step, we’ll use another Custom Function node wrapped in a Sub Graph, called Direct Specular. Take a look at the CustomLighting include file again, and see that we’re now referencing another function from the same file: 

    我们制作的着色器非常适合遮罩对象,但是如果我们想要一些光泽,该怎么办? 我们可以将自己的镜面反射计算添加到我们的着色器中! 在此步骤中,我们将使用包裹在子图中的另一个“自定义功能”节点,称为“ 直接高光” 。 再次查看CustomLighting包含文件,看看我们现在正在引用同一文件中的另一个函数:

    1

    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    void DirectSpecular_half(half3 Specular, half Smoothness, half3 Direction, half3 Color, half3 WorldNormal, half3 WorldView, out half3 Out)
    {
    #if SHADERGRAPH_PREVIEW
       Out = 0;
    #else
       Smoothness = exp2(10 * Smoothness + 1);
       WorldNormal = normalize(WorldNormal);
       WorldView = SafeNormalize(WorldView);
       Out = LightingSpecular(Color, Direction, WorldNormal, WorldView, half4(Specular, 0), Smoothness);
    #endif
    }

    1

    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    void DirectSpecular_half ( half3 Specular , half Smoothness , half3 Direction , half3 Color , half3 WorldNormal , half3 WorldView , out half3 Out )
    {
    #if SHADERGRAPH_PREVIEW
       Out = 0 ;
    #else
       Smoothness = exp2 ( 10 * Smoothness + 1 ) ;
       WorldNormal = normalize ( WorldNormal ) ;
       WorldView = SafeNormalize ( WorldView ) ;
       Out = LightingSpecular ( Color , Direction , WorldNormal , WorldView , half4 ( Specular , 0 ) , Smoothness ) ;
    #endif
    }

    This function performs some simple specular calculations, and if you’re curious, you can read more about them here. The Sub Graph for this function also includes some inputs on the Blackboard:

    此函数执行一些简单的镜面反射计算,如果您好奇的话,可以 在此处 阅读有关它们的更多信息 。 此功能的子图还包括黑板上的一些输入:

    Make sure that your new node has all the appropriate input and output ports to match the function. Adding properties to the Blackboard is simple; just click the Add (+) icon on the top right, and select the data type. Double-click the pill to rename the input, and drag and drop the pill to add it to the graph. Lastly, update the output port for your Sub Graph, and save it. 

    确保新节点具有所有适当的输入和输出端口以匹配该功能。 向Blackboard添加属性很简单。 只需单击右上角的 添加(+) 图标,然后选择数据类型。 双击药丸以重命名输入,然后拖放药丸以将其添加到图形中。 最后,更新子图的输出端口,并保存它。

    Now that specular calculation is set up, we can go back to the unlit graph, and add it through the Create Node menu. Connect the Attenuation output to the Color input of the Direct Specular Sub Graph. Next, connect the Direction output from the Get Main Light function to the Direction input of the specular Sub Graph. Add the result of NdotL*Attenuation to the output of the Direct Specular Sub Graph, and plug this in the Color output. 

    既然已经设置了镜面反射计算,我们可以返回到未点亮的图形,然后通过“创建节点”菜单将其添加。 将“ 衰减” 输出 连接 到 “ 直接高 光子图” 的“ 颜色” 输入 。 接下来,将“ 获取主光源”功能 的“ 方向” 输出 连接 到 高光子图 的“ 方向” 输入。 将NdotL * Attenuation的结果添加到 Direct Specular Sub Graph 的输出中 ,并将其插入 Color 输出中。

    Now we’ve got a bit of shine!

    现在,我们有了一点光彩!

    使用多个光源 (Working with Multiple Lights)

    The LWRP’s main light refers to the brightest directional light relative to the object, which is usually the sun. To improve performance on lower end hardware, the LWRP calculates the main light and any additional lights separately. To make sure our shader calculates correctly for all lights in the Scene, and not just the brightest directional light, you need to create a loop in your function. 

    LWRP的主光源是相对于物体的最亮的定向光,通常是太阳。 为了提高低端硬件的性能,LWRP分别计算主光源和任何其他光源。 为了确保我们的着色器能够正确计算场景中的所有灯光,而不仅仅是最明亮的定向灯光,您需要在函数中创建一个循环。

    To get the additional light data, we used a new Sub Graph to wrap a new Custom Function node. Take a look at the AdditionalLight_float function in the CustomLighting include file:

    为了获得更多的灯光数据,我们使用了新的子图来包装新的“自定义函数”节点。 看一下CustomLighting包含文件中的AdditionalLight_float函数:

    1

    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    void AdditionalLights_half(half3 SpecColor, half Smoothness, half3 WorldPosition, half3 WorldNormal, half3 WorldView, out half3 Diffuse, out half3 Specular)
    {
       half3 diffuseColor = 0;
       half3 specularColor = 0;
    #ifndef SHADERGRAPH_PREVIEW
       Smoothness = exp2(10 * Smoothness + 1);
       WorldNormal = normalize(WorldNormal);
       WorldView = SafeNormalize(WorldView);
       int pixelLightCount = GetAdditionalLightsCount();
       for (int i = 0; i < pixelLightCount; ++i)
       {
           Light light = GetAdditionalLight(i, WorldPosition);
           half3 attenuatedLightColor = light.color * (light.distanceAttenuation * light.shadowAttenuation);
           diffuseColor += LightingLambert(attenuatedLightColor, light.direction, WorldNormal);
           specularColor += LightingSpecular(attenuatedLightColor, light.direction, WorldNormal, WorldView, half4(SpecColor, 0), Smoothness);
       }
    #endif
       Diffuse = diffuseColor;
       Specular = specularColor;
    }

    1

    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    void AdditionalLights_half ( half3 SpecColor , half Smoothness , half3 WorldPosition , half3 WorldNormal , half3 WorldView , out half3 Diffuse , out half3 Specular )
    {
       half3 diffuseColor = 0 ;
       half3 specularColor = 0 ;
    #ifndef SHADERGRAPH_PREVIEW
       Smoothness = exp2 ( 10 * Smoothness + 1 ) ;
       WorldNormal = normalize ( WorldNormal ) ;
       WorldView = SafeNormalize ( WorldView ) ;
       int pixelLightCount = GetAdditionalLightsCount ( ) ;
       for ( int i = 0 ; i < pixelLightCount ; ++ i )
       {
           Light light = GetAdditionalLight ( i , WorldPosition ) ;
           half3 attenuatedLightColor = light . color * ( light . distanceAttenuation * light . shadowAttenuation ) ;
           diffuseColor += LightingLambert ( attenuatedLightColor , light . direction , WorldNormal ) ;
           specularColor += LightingSpecular ( attenuatedLightColor , light . direction , WorldNormal , WorldView , half4 ( SpecColor , 0 ) , Smoothness ) ;
       }
    #endif
       Diffuse = diffuseColor ;
       Specular = specularColor ;
    }

    Like before, use the AdditionalLights function in the file reference of the Custom Function node, and ensure that you’ve created all the proper inputs and outputs. Make sure to expose Specular Color and Specular Smoothness on the Blackboard of the Sub Graph in which the node is wrapped. Use the Position, Normal Vector, and View Direction nodes to plug in the World Position, World Normal, and World Space View Direction in the Sub Graph.

    与之前一样,在“自定义函数”节点的文件引用中使用AdditionalLights函数,并确保已创建所有正确的输入和输出。 确保 在包裹节点的子图的黑板上 显示“ 镜面反射颜色” 和“ 镜面反射平滑度 ”。 使用“位置”,“法线向量”和“视图方向”节点 在子图中 插入“ 世界位置” ,“ 世界法线 ”和“ 世界空间视图方向 ”。

    After you’ve set up the function, use it! First, take your main Unlit graph from the previous step, and collapse it to a Sub Graph. Select the nodes, and right-click Convert to Sub-graph. Remove the last Add node, and plug the outputs into the output ports of the Sub Graph. We recommend that you also create input properties for Specular and Smoothness

    设置功能后,请使用它! 首先,从上一步中获取您的主Unlit图,并将其折叠为Sub Graph。 选择节点,然后右键单击“ 转换为子图” 。 删除最后一个“添加”节点,然后将输出插入子图的输出端口。 我们建议您还为“ 镜面反射” 和“ 平滑度” 创建输入属性 。

    Now you can combine your main light calculations and your additional light calculations together. In the main Unlit graph, create a new node for the Additional Light calculations to go alongside the Main Light calculations. Add the Diffuse and Specular outputs from Main Light and Additional Lights together. Pretty simple!

    现在,您可以将主要的光照计算和其他的光照计算结合在一起。 在主“未照明”图中,为“其他照明”计算创建一个新节点,使其与“主照明”计算一起进行。 将“ 主光源”和“附加光源” 的“ 漫反射” 和“ 镜面反射” 输出相加。 很简单!

    创建一个简单的卡通着色器 (Creating a Simple Toon Shader)

    Now you know how to get the data from all lights in a Scene for an LWRP project, but what can you do with it? One of the most common uses for custom lighting in shaders is a classic toon shader! 

    现在,您知道如何从LWRP项目的“场景”中的所有灯光中获取数据,但是您将如何处理呢? 着色器中自定义照明的最常见用途之一是经典的卡通着色器!

    With all of the light data, creating a toon shader is pretty simple. First, take all the light calculations you’ve done so far, and wrap them in a Sub Graph one more time. This will help with readability in the final shader. Don’t forget to remove the final Add node, and feed Diffuse and Specular into separate output ports on the Sub Graph output node. 

    利用所有的灯光数据,创建卡通着色器非常简单。 首先,进行到目前为止的所有光照计算,然后再将它们包装在“子图中”。 这将有助于最终着色器的可读性。 不要忘记删除最终的“添加”节点,并将“ 漫反射” 和“ 镜面 反射” 馈送 到“子图”输出节点上的单独输出端口。

    There are lots of methods to create toon shading, but in this example, well use light intensity to look up colors from a Ramp Texture. This technique is usually called Ramp Lighting.  We’ve included some examples of the kind of Texture Asset needed for Ramp Lighting in the sample project. You can also sample a gradient to use dynamic ramps in Ramp Lighting. 

    有很多创建卡通阴影的方法,但是在此示例中,很好地利用光强度从“渐变纹理”中查找颜色。 此技术通常称为“斜坡照明”。 我们在示例项目中提供了一些示例示例,说明了“坡道照明”所需的纹理资产类型。 您也可以在渐变照明中采样渐变以使用动态渐变。

    The first step is to convert the intensity of Diffuse and Specular from RGB values to HSV values. This lets us use the intensity of the light color (the HSV values) to determine the brightness on the shader, and helps us sample the Texture at different spots along the horizontal axis of the Asset. Use a static value for the Y channel of the UV to determine, from top to bottom, what part of the image should be sampled. You c

    第一步是将“ 漫反射” 和“ 镜面 反射” 的强度 从RGB值转换为HSV值。 这使我们能够使用浅色的强度(HSV值)来确定着色器上的亮度,并帮助我们在沿着资源的水平轴的不同点处对纹理进行采样。 对UV的Y通道使用静态值,从上到下确定应该对图像的哪一部分进行采样。 你c

    an use this static value as an index to reference multiple lighting ramps for the project in a single Texture Asset.

    使用此静态值作为索引来引用单个Texture Asset中该项目的多个照明坡度 。

    Once you’ve set the UV values, use a Sample Texture 2D LOD node to sample the Ramp Texture. The Sample LOD is important; if we use a regular Sample Texture 2D node, the ramp is automatically mipped in a Scene, and objects further away will have different lighting behaviors. Using a Sample Texture 2D LOD node allows us to manually determine the mip level. Additionally, since the Ramp Texture is only 2 pixels high, we created our own Sampler State for the Textures.  To make sure that the Texture is sampled correctly, we set the Filter to Point, and the Wrap to Clamp. We exposed this as a property on the Blackboard so that you can change the settings if the Texture Asset changes. 

    设置UV值后,使用“采样纹理2D LOD”节点采样“渐变纹理”。 样本LOD很重要; 如果我们使用常规的Sample Texture 2D(采样纹理2D)节点,则渐变将自动在场景中进行剪切,并且较远的对象将具有不同的照明行为。 使用“采样纹理2D LOD”节点可以使我们手动确定Mip级别。 另外,由于斜坡纹理只有2个像素高,因此我们为纹理创建了自己的采样器状态。 为了确保正确采样纹理,我们将“滤镜”设置为“点”,将“环绕”设置为“钳位”。 我们将此属性公开为Blackboard上的一个属性,以便在Texture Asset更改时可以更改设置。

    Finally, we multiply the ramp sample from the diffuse calculations by a color property, Diffuse, so that we can change the object’s colors. Add the ramp sample from the specular calculations to the Diffuse output, and plug the final color into the Master node.

    最后,我们将来自漫反射计算的渐变样本乘以颜色属性 Diffuse ,以便可以更改对象的颜色。 将镜面反射计算中的渐变样本添加到“漫反射”输出中,然后将最终颜色插入“主”节点中。

    扩展定制照明 (Expanding Custom Lighting)

    This simple custom lighting setup can be expanded and applied to a wide variety of use cases in all kinds of Scenes. In our example project, we’ve included a full Scene configured with shaders that use our custom lighting setup. It also contains vertex animation, a simple subsurface scattering approximation, as well as refractions and coloring that use depth. Download the project, and check out our Example Assets to explore more advanced methods!

    这种简单的自定义照明设置可以扩展并应用于各种场景中的各种使用案例。 在示例项目中,我们包括一个完整的场景,该场景配置了使用自定义照明设置的着色器。 它还包含顶点动画,简单的地下散射近似值以及使用深度的折射和着色。 下载项目,并查看我们的示例资产以探索更高级的方法!

    保持学习! (Keep Learning!)

    If you want to discuss Shader Graph, and the shaders you can make with it, come hang out in our brand new forum space! You can also find community members and (sometimes) a few developers hanging out in the community Discord

    如果您想讨论Shader Graph及其可以使用的着色器,请在我们全新的 论坛空间中 闲逛 ! 您还可以在 社区Discord中 找到社区成员和(有时)一些开发人员 。

    Don’t forget to keep an eye out for recordings of our SIGGRAPH 2019 sessions, where we go into even more detail about using Shader Graph for custom lighting!

    别忘了留意SIGGRAPH 2019会议的录音,在此我们将详细介绍如何使用Shader Graph进行自定义照明!

    翻译自: https://blogs.unity3d.com/2019/07/31/custom-lighting-in-shader-graph-expanding-your-graphs-in-2019/

    shader graph

    展开全文
  • Unity的ShaderGraph插件,我决定把我自己实验的所有效果记录到这篇博客中,附带完整高清的连线动态图,希望对想要学习ShaderGraph的同学有所启发。

    文章目录

    一、ShaderGraph前言

    点关注不迷路,持续输出Unity干货文章。

    嗨,大家好,我是新发。最近在捣腾UnityShaderGraph插件,挺好玩的,我决定把我自己实验的所有效果记录到这篇博客中,附带完整高清的连线动态图,希望对想要学习ShaderGraph的同学有所启发。

    二、ShaderGraph科普

    1、渲染管线(Render Pipline)

    渲染管线也称渲染流水线,是显示芯片(GPU)内部处理图形信号相互独立的并行的处理单位。
    渲染管线流程包括下面几个步骤:顶点处理、面处理、光栅化、像素处理等。
    Unity内置的渲染管线,我们可以使用shader来实现渲染管线中的某些步骤的逻辑。

    2、可编程渲染管线,SRP(Scriptable Render Pipline)

    Unity2018中引入了可编程渲染管线(Scriptable Render Pipline),简称SRP,是一种在Unity中通过C#脚本配置和执行渲染的方式。

    为什么需要SRP?
    Unity内置的渲染管道只有ForwardDeferred两种。

    Forward Shading
    原理:每个作用于物体的像素光单独计算一次,drawCall随着物体与光照数量增加而成倍增加
    优点:不受硬件限制
    缺点:光照计算开销成倍增加随着光源和物体数量增加。
    每个物体接受光照数量有限。

    Deferred Shading
    原理:物体颜色、法线、材质等信息先渲染到G-Buffer中,光照最后单独渲染,避免每个物体多个光照批次的问题
    优点:作用于每个物体光照数量不再受到限制,光照计算不随着物体增加而增加
    缺点:移动设备需要支持OpenGL3.0。
    不支持MSAA。
    半透明物体仍然使用前向渲染。

    如上,这两种内置的管道各有优缺点 ,还有,我们看不到源代码,如果为了表现某种特殊的视觉效果修改起来非常不便。所以就有了SRP的诞生。另外,根据项目的需求写合适的SRP,也可以降低DrawCall,提高运行效率。
    SRP引入了CommandBuffer

    CommandBuffer,用于拓展Unity渲染管线。
    包含一系列渲染命令,比如设置渲染目标,绘制网格等,并可以设置为在摄像机期间的各个点执行渲染。

    下面是CommandBuffer的一个简单的例子:(具体可看官方Github的例子,传送门

    public override void Render(ScriptableRenderContext context, Camera[] cameras)
    {
        base.Render(context, cameras);
        
        var cmd = new CommandBuffer();
        cmd.ClearRenderTarget(true, true, m_ClearColor);
        context.ExecuteCommandBuffer(cmd);
        cmd.Release();
        context.Submit();
    }
    

    自己定制渲染管线对编程要求很高,难度大。

    所以Unity提供里2个预制的管线:高清渲染管线(HDRP,全称High Definition Render Pipleline)、通用渲染管线(URP,全称Universal Render Pipleline),

    注意,URP的前身就是轻量级渲染管线LWRP(全称Light Weight Render Pipleline)。

    3、高清渲染管线,HDRP(High Definition Render Pipleline)

    Unity2018版本,Unity为了提高引擎的画面表现,推出了High Definition Render Pipeline,高清晰渲染管线,简称HDRP
    HDRP专注于高端图形渲染,针对高端硬件配置,像PCXBoxPlaystation,其面向高逼真度的游戏、图形demo和建筑渲染、超写实效果,以及所需的最佳图形效果,目前还不支持在手机移动端使用HDRP
    想得到HDRP的完美表现能力,需要大量的贴图,漫反射贴图、高光贴图、金属贴图、平滑贴图、AO贴图、法线贴图、凹凸贴图、高度贴图等等,所以要做HDRP流程需要非常长的时间和庞大的制作团队以及充足的预算。

    4、通用渲染管线,URP(Universal Render Pipleline)

    2019.3版本中,Unity将轻量渲染管线LWRP重命名为通用渲染管线URP,通用渲染管线是制作精美图形和显示效果的强力方案,并且同时支持多个平台。轻量渲染管线设计初时具有快捷、可伸缩的优点,可为所有移动端带来高质量的图形效果。URPUnity未来的默认渲染方式。
    Unity官方将致力于改进通用渲染管线,为用户带来VFX GraphShader GraphCustom Render Passes及最新Post-Processing的各种便利,实现等同甚至更好的品质与性能,且只需一次开发,便能在大量的平台上部署。

    需要注意的是,通用渲染管线将不会取代或包括高清渲染管线(HDRP)。

    5、ShaderGraph

    Unity2018推出了一个可编程渲染管线工具ShaderGraph,让开发者们可以通过可视化界面拖拽来实现着色器的创建和编辑。
    目前ShaderGraph支持的URP通用渲染管线,也支持HDRP高清渲染管线。
    我们通过UnityPackageManager安装ShaderGraph,还需要安装对应的渲染管线工具包,比如要使用URP通用渲染管线,则需要通过PackageManager安装Universal RP,如果要使用HDRP高清渲染管线,则需要通过PackageManager安装High Definition RP
    安装了渲染管线工具包之后,就可以通过菜单 Assets - Create - Rendering创建对应的渲染管线配置。
    在这里插入图片描述
    接着在Editor - Project Setting - Graphics中的Scriptable Render Pipeline Settings设置渲染管线配置文件。
    如果是使用URP,则设置URP的渲染管线配置
    在这里插入图片描述
    如果是使用HDRP,则设置HDRP的渲染管线配置
    在这里插入图片描述
    然后,我们就可以创建对应的ShaderGraph,愉快得进行连连看了。
    在这里插入图片描述

    6、URP和HDRP效果对比

    我实验了一下URPHDRP的效果,感受一下
    先看URP的效果
    在这里插入图片描述
    再看HDRP的效果
    在这里插入图片描述

    三、ShaderGraph使用前的环境准备

    首先除了安装ShaderGraph本身外,还得安装渲染管线工具,以URP渲染管线(工具包名叫Universal RP)为例。

    1、安装Universal RP

    点击菜单Window - Package Manager,打开Package Manager窗口。
    在这里插入图片描述
    点击Packages,选择Unity Registry
    在这里插入图片描述
    然后搜索Universal RP,点击Install按钮,等等安装完毕。
    在这里插入图片描述

    2、创建Pipeline Assets

    Project窗口中右键 - Create - Rendering - Universal Render Pipeline - Pipeline Asset (Forward Renderer),即可创建一个Pipeline Assets资源:UniversalRenderPipelineAssets
    在这里插入图片描述

    3、设置Pipeline Assets

    点击菜单 Edit - Project Settings,弹出Project Settings窗口,点击Graphics,将上面创建的UniversalRenderPipelineAssets拖到Scriptable Render Pipeline Settings中。
    在这里插入图片描述

    四、ShaderGraph入门:PBR Graph的简单使用

    1、创建PBR Graph

    Project窗口中右键-Create-Shader-PBR Graph,即可创建一个PBR Graph脚本。
    在这里插入图片描述
    在这里插入图片描述
    双击PBRShaderGraph文件,即可打开编辑窗口
    在这里插入图片描述

    2、创建一个颜色变量

    点击左上角的属性窗口中的+号可以创建变量,这里我们创建一个Color变量。
    在这里插入图片描述
    如下,出现了一个Color变量,我们可以设置默认颜色,如下设置了红色
    在这里插入图片描述

    3、将Color变量连到Master节点中

    将变量拖动到操作区中
    在这里插入图片描述
    Color节点连到PBR Master节点的Albedo插槽中,即可看到预览窗口中的模型的表面已变成了红色。
    在这里插入图片描述

    4、保存ShaderGraph文件

    点击Save Asset即可保存ShaderGraph文件。
    在这里插入图片描述

    5、将ShaderGraph赋值给Material材质球

    创建一个Material材质球:PBRTestMaterial,然后直接将ShaderGraph文件拖动到材质球文件上即可。
    在这里插入图片描述
    材质球上,可以看到我们在ShaderGraph中创建的Color变量,通过变量可以调整材质球的颜色。
    在这里插入图片描述

    6、将材质球赋值给3D模型

    Hierachy窗口中右键 - 3D Object - Capsule,创建衣蛾胶囊体模型
    在这里插入图片描述
    将材质球赋值给胶囊体的材质属性中,即可看到胶囊体变成了红色
    在这里插入图片描述
    调整材质球的Color变量,胶囊体的颜色也相应的发生变化。
    在这里插入图片描述

    五、ShaderGraph进阶:实战特效案例

    1、模型裁切,主要节点、Position、AlphaClip

    原理:AlphaClip的值如果比Alpha的值大,则会不显示
    在这里插入图片描述
    进阶:在裁剪的基础上添加裁剪边缘光
    首先利用Smoothstep做出一个边缘渐变

    Smoothstep:如果输入In的值分别在输入Edge1和Edge2的值之间,则返回0和1之间的平滑Hermite插值的结果。如果输入In的值小于输入Step1的值,则返回0;如果大于输入Step2的值,则返回1 。

    在这里插入图片描述
    然后将边缘渐变和颜色叠加,连到PBR Master的发光插槽Emission
    在这里插入图片描述

    2、模型溶解,主要节点:Simple Noise、AlphaClip

    原理:AlphaClip的值如果比Alpha的值大,则会不显示
    在这里插入图片描述
    进阶:溶解边缘添加发光,原理就是对Noise噪声做两个Step,然后相减,再乘个颜色,连到Emission发光节点上。
    在这里插入图片描述

    3、边缘光效果,主要节点:Fresnel Effect

    原理:Fresnel Effect,菲涅耳效应,根据观察角度产生不同反射率从而对表面效果产生影响,当你靠近时,会反射更多的光。菲涅耳效应节点通过计算表面法线与视线方向的夹角来近似。这个角度越大,返回值越大。这种效果经常被用来实现边缘照明,这在很多艺术风格中都很常见。

    在这里插入图片描述
    进阶:带方向的菲涅尔边缘光效果
    在这里插入图片描述

    4、卡通阴影色块效果,主要节点:Normal Vector、Dot Product、Sample Gradient

    原理:使用Sample Gradient设置几个阴影色块颜色
    在这里插入图片描述

    5、表面水纹叠加,主要节点:Tilling And Offset、Lerp

    原理:通过Tilling And Offset节点的Offset来控制水纹的UV偏移,然后再使用Lerp将水纹和主贴图做一个线性差值
    在这里插入图片描述

    6、积雪效果,主要节点:Nomal Vector、Dot Product

    原理:使用一个向上的 Vector3和 模型的 Normal Vertor(法线向量) 点乘,得到的是 一个标量,表示模型法线向量和垂直向量的夹角(方向的相似度),然后通过 Step过滤得到要显示白色的部分,将要显示的 白色部分再和一个噪声相乘后输入到MasterEmission发光槽中。
    在这里插入图片描述

    7、不锈钢效果、冰晶效果,主要节点:View Direction、Tilling And Offset、Simple Noise

    原理:由View Direction视角移动, 引发Tilling And Offset节点 移动 贴图,产生的效果。注意View Direction使用Tangent切线空间。该效果也可用于冰晶效果。
    在这里插入图片描述

    8、UV抖动效果,主要节点:UV、Simple Noise、Split

    原理,使用SplitUV分开成xy两个分类,对x分类做一个噪音抖动,最后和y再合并作用到主贴图的UV上。
    在这里插入图片描述

    9、水面上下波动效果,主要节点:Gradient Noise、Position

    原理:使用Gradient Noise随机噪声,再通过一个 Normal Vector结点,代表垂直于物体的法向量,接着,对Position进行一个叠加。
    注意Normal VectorPositionSpace都选择Object空间
    在这里插入图片描述

    10、红旗飘飘效果,主要节点:Simple Noise、UV、Position

    原理:通过噪声的UV移动,形成一个动态移动的噪声,作用到Position上,为了让旗的根部所以在通过一个UVx分量来限制根部的噪音。
    在这里插入图片描述

    11、马赛克效果,主要节点:UV、Posterize

    原理:Posterize的作用是色调分离。
    在这里插入图片描述
    通过官方文档,我们可以知道Posterize这个节点的公式为:

    void Unity_Posterize_float4(float4 In, float4 Steps, out float4 Out)
    {
        Out = floor(In / (1 / Steps)) * (1 / Steps);
    }
    

    根据公式,我们也可以自己实现马赛克效果
    在这里插入图片描述

    12、无贴图水球效果,主要节点:UV、Ellipse、Step

    原理:通过UVy方向构造一个垂直渐变的UV,作为噪声的Step边缘,形成一条波浪,最后差值两个颜色,再用形状做裁切。
    在这里插入图片描述

    13、无贴图火焰效果,主要节点:Voronoi、Tiling And Offset、Blend

    原理:通过两个Voronoi的融合,得到类似火焰向上燃烧的形状,再通过UV和一个Vector 2Distance制造两个圆形区域,分别作为火焰内心和外围的区域,再合火焰形状相乘,最后再乘上颜色。
    在这里插入图片描述

    14、无贴图旋涡效果,主要节点:Twirl、Voronoi

    原理:使用TwirlVoronoi产生一个旋涡形状。
    在这里插入图片描述

    15、无贴图闪电效果,主要节点:Simple Noise、Rectangle

    原理:噪声通过Rectangle后,可以形成类似闪电的形状。
    在这里插入图片描述
    一个UV向下移动的噪声和一个UV向上移动的噪声相加,再通过Rectangle,则可以形成动态闪电效果。
    在这里插入图片描述

    16、全息效果,主要节点:Position、Fraction、Time、Fresnel Effect

    原理:通过Fraction获取Positiony分量得到一个条纹效果,再通过UV移动得到一个扫描的效果,最后和菲涅尔效果叠加。
    在这里插入图片描述

    17、水波纹效果,主要节点:UV、Sine

    原理:通过UVSine构造一个圆心向外扩散的效果,再作用到贴图的UV上。
    在这里插入图片描述

    18、高斯模糊

    具体实现参见我这篇文章:Unity ShaderGraph实现图片的高斯模糊效果
    在这里插入图片描述

    19、自发光

    具体实现参见我这篇文章:Unity Unlit ShaderGraph实现与PBR的自发光贴图类似的叠加效果
    在这里插入图片描述

    20、粒子系统溶解效果

    具体实现参见我这篇文章:Unity ShaderGraph溶解效果运用到粒子系统中
    在这里插入图片描述

    21、物体靠近局部溶解效果

    具体实现参见我这篇文章:Unity使用ShaderGraph实现根据坐标控制溶解的位置,物体靠近局部溶解
    在这里插入图片描述

    22、2D描边效果

    具体实现参见我这篇文章:Unity ShaderGraph 2D描边效果、不规则描边效果
    在这里插入图片描述

    23、子弹拖尾效果

    具体实现参见我这篇文章:Unity使用ShaderGraph配合粒子系统,制作子弹拖尾特效
    在这里插入图片描述

    24、在模型上涂鸦

    具体实现参见我这篇文章:使用Unity ShaderGraph实现在模型涂鸦的效果
    在这里插入图片描述

    25、刮刮乐效果

    具体实现参见我这篇文章:使用Unity ShaderGraph实现刮刮乐的刮卡剔除效果
    在这里插入图片描述


    待续

    展开全文
  • ShaderGraph节点详解完整版20210331
  • thi.ng/shadergraph 内容 注入特性 依存关系 运行 发展 莱宁根项目文件 ClojureScript HTML工具 在运行时访问库版本版本名称空间 发行历史 贡献者 关于该项目 概述 该项目提供了一种面向功能的方法来构成复杂的...
  • Shader Graph Example Library,修正了部分Shader丢失的问题,可使用2019.3打开,Shader Graph学习的素材。
  • ShaderGraph节点大全

    千次阅读 2021-03-26 17:00:53
    之前一直是代码编写Shader,ShaderGraph出了很久了,一直被我无视了,最近学习了一下ShaderGraph感觉真的让我又有了很多新的想法,在很多效果实现方面真的方便很多。 因为原来就有写Shader的基础 ,学习起来不算太...

    最近事情比较杂乱学习的内容也比较零散,所以也没怎么拿出来和大家分享。之前一直是代码编写Shader,ShaderGraph出了很久了,一直被我无视了,最近学习了一下ShaderGraph感觉真的让我又有了很多新的想法,在很多效果实现方面真的方便很多。
    因为原来就有写Shader的基础 ,学习起来不算太吃力,这里把学习到的内容在这里记录一些,当然不全是我 自己原创的内容,搬过来方便自己和大家查阅。

    ShaderGraph也有些要注意的:
    1.ShaderGraph只能用于新HDPR(高清渲染管线)和LWRP(轻量级渲染管线)中。
    2.ShaderGraph最好还是能掌握一些Shader编写规则,否则难以深入。
    3.HDPR和LWRP下的编辑出来的节点和效果也有些差异
    4.一些节点需要和一些选项配合才能出效果,比如DepthTexture或是视频的远近截面有关。
    5.不同版本的Unity含有的节点和节点的位置也会有的不同

    ShaderGraph类型含义
    BPR Graph基于物理规律的渲染流程
    Sub Graph
    Unlit Graph无光线处理的渲染流程
    节点(Artistic>Adjustment)含义说明
    Channel Mixer混合通道将RGB三个通道进行混合
    Contrast对比度对比度调整
    Hue色调色调调整 Degrees:0~360 Normalized:0~1在这里插入图片描述
    Invert Colors反色
    Replace Color颜色替换可以选择指定颜色进行替换
    Saturation饱和度
    White Balance白平衡用于改变色温色调
    节点(Artistic>Blend)含义说明
    Blend混合有多种混合模式可以选择
    节点(Artistic>Filter)
    Dither混色屏幕空间下的图形处理
    节点(Artistic>Mask)含义说明
    Channel Mask通道遮罩显示/隐藏各颜色通道
    Color Mask颜色遮罩通过颜色控制遮罩
    节点(Artistic>Normal)含义说明
    Normal Blend法线混合将两个法线贴图按指定方式混合
    Normal From Height高度法线可以从一张调试图中得到法线
    Normal Form Texture贴图法线可以从一张贴图中生成法线
    Normal Reconstruct Z从生成的贴图中重建他的Z向量
    Normal Strength法线增强用于调整法线强度
    Normal Unpack法线解压将RGB通道的贴图重建成法线贴图,图片类型不需要再改Normal
    节点(Artistic>Utility)
    Colorspace Conversion色彩模型转换RGBLinear和HSV之间转换色彩模型
    节点(Channel)含义说明
    Combine组合将n个数组合并为一个
    Flip取反将输入的值取反
    Split拆分将组中的值拆分
    Swizzle搅拌将一个通道的值输出到另一个通道
    节点(Input>Basic)含义说明
    Boolean布尔值
    Color颜色值
    Constant常量
    Integer整数值
    Slider滑动条
    Time时间值
    Vector 1一维向量
    Vector 2二维向量
    Vector 3三维向量
    Vector 4四维向量
    节点(Input>Geometry)含义说明
    Bitangent Vector双切线向量网格顶点或片段的双切线向量
    Normal Vector法向量网格顶点或片段的法向量
    Position位置网格顶点或片段的位置
    Screen Position屏幕位置当前点在屏幕空间下的位置
    Tangent Vector切线网格顶点或片段的切线
    UVUV坐标网格顶点或片段的UV坐标
    Vertex Color顶点颜色网格顶点或片段的顶点颜色
    View Direction视角方向相机到网格顶点或片段的视角方向
    节点(Input>Gradient)
    Gradient渐变设置渐变常量在这里插入图片描述
    Sample Gradient渐变样本时间控制渐变在这里插入图片描述
    节点(Input>Lighting)含义说明
    Ambient环境取得环境光的设置参数
    Baked GI光照贴图烘焙过后的光照贴图,可以用动态或静态的UV采样光照贴图
    Reflection Probe反射探测器访问物体对应的反射探测器。需要Normal和View Direction 两个输入参数进行彩样。LOD参数可以设置LOD的级别
    节点(Input>Matrix)含义说明
    Matrix 2X2二维矩阵
    Matrix 3X3三维矩阵
    Matrix 4X4四维矩阵
    Transformation Matrix变换矩阵
    节点(Input>PBR)含义说明
    Dielectric Specular介电反射个基于物理材质的高光系数,可以通过Material,下拉选择类型
    Metal Reflectance金属反射率返回基于材质的金属反射值 Specular Workflow转出节点为Specular ,Matallic Workflow节点输出为Albedo。
    节点(Input>Scene)含义说明
    Camera相机参数获得当前摄像机的相关参数
    Fog雾参数获取当前场景中的Fog参数
    Object对像获取物体的位置和缩放
    Scene Color场景颜色获得当前相机的颜色缓冲
    Scene Depth场景深度用来访问当前场景的深度
    Screen屏幕获取当前屏幕的宽高(像素)
    节点(Input>Texture)含义说明
    Cubemap Asset立体贴图定义cubemap常量后连接Sample Cubemap节点,可作为外部属性使用
    Sample Cubemap立方贴图采样根据输入参数View Direction和Normal进行cubemap采样。可以设置LOD作为LOD采样级别
    Sample Texture 2D贴图采样通过此节点配合UV坐标和Sampler State获取贴图中的数据
    Sample Texture 2D Array贴图Array采样
    Sample Texture 2D LOD贴图LOD采样
    Sample Texture 3D立方贴图采样
    Texel Size?
    Texture 2D Array Asset贴图Array资源
    Texture 2D Array贴图资源
    Texture 3D Array立方贴图资源
    Sampler State采样器用Sample Texture节点中的输入结点Sampler
    节点(Master)含义说明
    PBR
    Unlit
    节点(Math>Advancend)含义说明
    Absolute绝对值
    Exponential指数可选择以e为底或2为底
    Length长度二维: x平方加y平方的和再开方 , **三维:**x平方加y平方加z平方的和再开方
    Log对数
    Modulo取余
    Negate取反
    Normalize归一 化
    Posterize色调分离将颜色分级在这里插入图片描述
    Reciprocal倒数二的倒数是二分之一,三的倒数是三分之一…
    Reciprocal Square Root反平方根平方根的倒数
    节点(Math>Basic )含义说明
    Add相加
    Divide相除
    Multiply相乘
    Power次方
    Square Root开方
    Subtract相减
    节点(Math>Derivative)含义说明
    DDX偏导数X坐标基于X求导
    DDXY偏导数XY坐标的和基于XY求导
    DDY偏导数Y坐标基于Y求导
    节点(Math>Interpolation )含义
    Inverse Lerp逆向线性差值Out = (T-A)/(B-A) 比如 A:0 B:10 T:5 输出 T就是在0和10之间50%的位置输出0.5
    Lerp线性差值*Out = (B-A)T+A 用T来控制倾越接近0越倾向于A,越接近1越倾向于B
    Smoothstep平滑差值映射差值,输入值小于Edge1则返回0,大于Edge2则返回1,如图小于0.2的归为0了,大于0.8的归为1了,基体值映射到0~1之间在这里插入图片描述
    节点(Math>Matrix )含义说明
    Matrix Construction构造矩阵用于构建一个矩阵
    Matrix Determinant矩阵行列式用于求解行列式
    Matrix Split矩阵拆分将N维矩阵转换为N个行列式
    Matrix Transpose矩阵转置返回传入值的转置
    节点(Math>Range )含义说明
    Clamp范围限制返回传入值A,A在min与max之间返回原来值A,小于min返回min,大于max返回max
    Fraction取小数返回值的小数部分
    Maximum最大值返回输入值最大的那个
    Minimum最小值返回输入值最小的那个
    One Minus一减一减输入值
    Random Range范围随机值返回一个在min和max之间的伪随机值
    Remap重映射如下图则是将 -1~1 得映射到0~1 ?
    Saturate截取返回输入值到0~1的范围
    节点(Math>Round )含义说明
    Ceiling向上取整
    Floor向下取整
    Round四舍五入(要大于0.5才算1)
    Sign取符号
    Step取值输入值X,大于X返回1,小于X返回0
    Truncate截断小数和Floor不同,这个是直接截断
    节点(Math>Trigonometry )含义说明
    Arccosine反余弦
    Arcsine反正弦
    Arctangent反正切?
    Arctangent2反正切?
    Cosine余弦
    Degrees To Radians角度转弧度
    Hyperbolic Cosine双曲余弦
    Hyperbolic Sine双曲正弦
    Hyperbolic Tangent双曲正切
    Radians To Degrees弧度转角度
    Sine正弦
    Tangent正切
    节点(Math>Vector )含义说明
    Cross Product叉乘用来获取法向量
    Distance距离获取两个点的距离
    Dot Product点积用来获取投影
    Fresnel Effect菲涅尔效应夹角越小值越接近于0,夹角越大越接近于1,常用于制作外发光在这里插入图片描述
    Projection射影求A在B上的投影
    Pejection反投影求A在B上的反投影
    Reflection反射求进入的向量反射出去的向量
    Rotate About Axis转轴旋转一坐标在某个轴上的旋转
    Sphere Mask球型遮罩三维空间中建立一个球,球以外的输出为1,以内的为0
    Transform变换空间转换
    节点(Math>Wave )含义说明
    Noise Sine Wave噪点正弦波返回转入的正弦波,添加振幅,噪点在min和max之间在这里插入图片描述
    Sawtooth Wave锯齿波在这里插入图片描述
    Square Wave方波在这里插入图片描述
    Triangle Wave三角波在这里插入图片描述
    节点(Procedural)含义说明
    Checkerboard棋盘生成原始像棋盘纹理,可调整大小和颜色
    Gradient Noise噪音可以改变大小
    Simple Shape圆型
    Voronoi泰森多边形法如下的图形,可以改变大小密度在这里插入图片描述
    Ellipse椭圆形
    Polygon多边型
    Rectangle矩形
    Rounded Rectangle圆角四边型
    节点(Properties)含义说明
    Property : BaseColor
    Property : Metallic
    Property : Normal
    Property : Wind Density
    Property : Wind Movement
    Property : Wind Strength
    节点(Sub Graphs)含义说明
    Sub Graphs
    节点(Utility)含义说明
    Preview预览预览效果
    All所有当输入的所有参数不为0或flash的时候返回真
    And两个为真的时候返回真
    Any任何任何一个参数为真或0以外时为真
    Branch分岔逻辑转回数字,将真假转加数值
    Comparison比较按条件比较
    Is Front Face是否正面是正面为真
    Is Infinite无限大是无际大返回真
    Is NaN非数字输入不是数字返回真
    Nand为假输入值都为假反加真
    Not取反假为真,真为假
    Or一个为真,则返回真
    节点(UV)含义说明
    Flipbook翻页书用于裁切动画帧
    Polar Coordinates极坐标
    Radial Shear径向剪切
    Rotate旋转
    Spherize球面化
    Tiling And Offset平铺和偏移
    Triplanar三维映射贴图映射到正面
    Twirl扭曲旋转

    最后呢留下全解析的视屏,可以快速过一次,个人觉得挺好的:
    Unity3D Shader Graph 全节点解析

    展开全文
  • ShaderGraph介绍.zip

    2019-11-04 14:38:30
    shader graph 文档
  • shader graphA recent Unity Labs paper introduces a new framework for blending normal maps that is easy and intuitive for both technical artists and graphics engineers. This approach overcomes several ...

    shader graph

    A recent Unity Labs paper introduces a new framework for blending normal maps that is easy and intuitive for both technical artists and graphics engineers. This approach overcomes several limitations of traditional methods.

    Unity Labs最近发表的一篇论文介绍了一种用于混合法线贴图的新框架,该框架对于技术美术师和图形工程师而言都非常容易且直观。 这种方法克服了传统方法的一些局限性。

    Since the introduction of normal mapping in real-time computer graphics, combining or blending normal maps in a mathematically correct way to get visually pleasing results has been a difficult problem for even very experienced graphics engineers. Historically, people often blend normals in world space, which produces incorrect and less than satisfactory results. The paper “Surface Gradient Based Bump Mapping Framework” introduces a new framework that addresses the limitations of traditional normal mapping. This new approach is easy and intuitive for both technical artists and graphics engineers, even where different forms of bump maps are combined. 

    自从 在实时计算机图形中 引入 法线贴图 以来 ,即使是非常有经验的图形工程师,以数学上正确的方式组合或混合法线贴图以获得视觉上令人愉悦的结果也是一个难题。 从历史上看,人们经常在世界空间中融合法线,这会产生不正确且不令人满意的结果。 论文“ 基于表面梯度的凹凸贴图框架 ”介绍了一个新的框架,该框架解决了传统法线贴图的局限性。 即使将不同形式的凹凸贴图结合起来,对于技术美术师和图形工程师而言,这种新方法都非常容易直观。

    In modern computer graphics, material layering is critical to achieve rich and complex environments. To do this, we need support for bump mapping across multiple sets of texture coordinates as well as blending between multiple bump maps. Additionally, we want to be able to adjust the bump scale on object space normal maps and be able to composite/blend these maps correctly with tangent space normal maps and with triplanar projection.

    在现代计算机图形学中,材料分层对于实现丰富而复杂的环境至关重要。 为此,我们需要支持跨多个纹理坐标集的凹凸贴图以及多个凹凸贴图之间的混合。 此外,我们希望能够在对象空间法线贴图上调整凹凸比例,并能够与切线空间法线贴图和三面投影正确地合成/混合这些贴图。

    Traditionally, real-time graphics has supported bump mapping on only one set of texture coordinates. Bump mapping requires data for every vertex to be pre-calculated and stored (tangent space). Supporting additional sets of texture coordinates would require proportional amounts of extra storage per vertex. Further, doing so does not support procedural geometry/texture coordinates or advanced deformation of the geometry.

    传统上,实时图形仅在一组纹理坐标上支持凹凸贴图。 凹凸映射要求预先计算和存储每个顶点的数据(切线空间)。 支持额外的纹理坐标集将需要每个顶点成比例的额外存储量。 此外,这样做不支持程序几何/纹理坐标或几何的高级变形。

    The High Definition Rendering Pipeline (HDRP) solves this problem by leveraging the surface gradient-based framework for bump mapping. In HDRP, traditional tangent space, per vertex, is used for the first set of texture coordinates to support strict compliance with MikkTSpace. This is required for difficult cases such as baked normal maps made for low-polygonal hard surface geometry.

    高清晰度渲染管线(HDRP)通过利用基于 表面梯度的凹凸映射框架 解决了此问题 。 在HDRP中,每个顶点的传统切线空间用于第一组纹理坐标,以支持严格遵守 MikkTSpace 。 这 对于困难的情况必需的, 例如为低多边形硬表面几何图形制作的烘焙法线贴图。

    For all subsequent sets of texture coordinates, we calculate tangent space on the fly in the pixel shader. Doing so allows us to support normal mapping across all sets of texture coordinates as well as using it with procedural geometry and advanced deformers beyond simple skinning. 

    对于所有后续的纹理坐标集,我们可以在像素着色器中动态计算切线空间。 这样做可以使我们支持跨所有纹理坐标集的法线贴图 ,以及将其与 除简单蒙皮之外的程序几何和高级变形器 一起使用 。

    Correct blending is achieved by accumulating surface gradients as described in the paper.
    Up until now, this framework has been available only when using shaders that are built into HDRP. However, a prototype version made for Shader Graph is now available on Github in a sample scene made with Unity 2019.3.0b4 and Shader Graph version 7.1.2. The framework itself is implemented entirely as subgraphs for Shader Graph, and each subgraph is made with only built-in nodes.

    如本文所述,通过累积表面梯度可以实现正确的混合。
    到目前为止,仅当使用内置在HDRP中的着色器时,此框架才可用。 但是,现在 可以在Github 上使用Unity 2019.3.0b4和Shader Graph版本7.1.2制作的示例场景中 为Shader Graph创建原型版本 。 框架本身完全作为Shader Graph的子图实现,并且每个子图仅由内置节点组成。

    The method involves the following steps:

    该方法包括以下步骤:

    1. Establish a surface gradient for each bump map.

      为每个凹凸贴图建立一个表面渐变。

    2. Scale each surface gradient by a user-defined bump scale.

      通过用户定义的凹凸比例缩放每个表面渐变。

    3. Add (or blend) all the surface gradients into one.

      将所有表面渐变相加(或混合)。

    4. Resolve to produce the final bump mapped normal.

      解析以生成最终的凹凸贴图法线。

    By adhering to this framework, every single form of bump map produces a surface gradient, which allows for uniform processing. This includes tangent/object space normal maps, planar projection, triplanar projection and even bump maps in the form of a procedural 3D texture. This makes it much easier to correctly blend. 

    通过遵守此框架,凹凸贴图的每种形式都会产生表面梯度,从而可以进行统一处理。 这包括程序3D纹理形式的切线/对象空间法线贴图,平面投影,三面投影以及甚至凹凸贴图。 这样可以更轻松地正确混合。

    The sample comes with several graphs that use the framework. Each graph illustrates a different use-case of the framework. We will go through some of these in the following sections.

    该示例附带了几个使用该框架的图形。 每个图都说明了框架的不同用例。 我们将在以下各节中介绍其中一些内容。

    基本法线贴图 (Basic normal mapping)

    The graph for the shader basic illustrates the flow but also shows the difference between using vertex tangent space and using procedural tangent space.

    着色器 基本 图形 显示了流程,但也显示了使用顶点切线空间和使用过程切线空间之间的区别。

    1. The subgraph basisMikkTS.shadersubgraph produces the conventional tangent and bitangent. This works for UV0 only.

      子图基础 MikkTS.shadersubgraph 产生常规切线和双切线。 这仅适用于UV0。

    2. A procedural tangent and bitangent is obtained with the subgraph GenBasisTB.shadersubgraph using any texture coordinate.

      使用任何纹理坐标 ,通过子图 GenBasisTB.shadersubgraph 获得过程切线和双切线 。

    Since this sample uses UV0 specifically, a Boolean property on the Blackboard serves as a toggle. For any other UV set, the shader would have to use the second method.

    由于此示例专门使用UV0,因此Blackboard上的Boolean属性用作切换。 对于任何其他UV集,着色器将必须使用第二种方法。

    Note that a special subgraph – tex ts norm to deriv.shadersubgraph – is used to sample the tangent space normal map. Rather than returning a vector3, it returns a vector2 called a derivative. You can add or blend derivatives when you sample them using the same UV set. However, to support adding and blending when using different UV sets or even different forms of bump maps, you need to add or blend surface gradients.

    请注意,一个特殊的子图 -tex ts norm to deriv.shadersubgraph- 用于采样切线空间法线贴图。 而不是返回vector3,而是返回称为 导数 的vector2 。 使用相同的UV集采样衍生物时,可以添加或混合它们。 但是, 要在使用不同的UV集甚至不同形式的凹凸贴图时支持添加和混合,则需要添加或混合表面渐变。

    To produce a surface gradient, use the subgraph called Surfgrad TBN.shadersubgraph, shown above.

    要产生表面渐变,请使用 上面显示的 名为 Surfgrad TBN.shadersubgraph 的子图 。

    To adjust the bump scale on a surface gradient, use a simple multiply node. Alternatively, you can use a subgraph called Apply Bump Scale.shadersubgraph.

    要在表面渐变上调整凹凸比例,请使用简单的乘法节点。 另外,您可以使用一个称为 Apply Bump Scale.shadersubgraph 的子图 。

    Then you can convert the surface gradient into a final bump mapped normal by using the subgraph Resolve Surfgrad.shadersubgraph.

    然后,可以使用子图 Resolve Surfgrad.shadersubgraph 将表面渐变转换为最终的凹凸贴图,以法线 表示

    对象空间法线贴图 (Object space normal maps)

    Object space normal maps are also integrated into the surface gradient-based workflow. This lets you adjust the bump mapping intensity and blend/add object space normal maps with other forms of bump maps.

    对象空间法线贴图也已集成到基于曲面梯度的工作流程中。 这使您可以调整凹凸贴图的强度,并与其他形式的凹凸贴图混合/添加对象空间法线贴图。

    Below is the graph called OS nmap basic.

    下面是称为 OS nmap basic 的图 。

    First, transform the sampled normal from object space into world space. For best results, this would be transformed as a normal, but Shader Graph’s built-in transformations do not support this, so direction is the best option. Then, convert the normal into a surface gradient by using the subgraph called Normal to surfgrad.shadersubgraph. Once the bump contribution is a surface gradient, proceed as you would for other forms of bump maps – adjusting the bump scale as described in the previous section and adding/blending multiple surface gradients until you resolve at the end to produce the final normal.

    首先,将采样的法线从对象空间转换为世界空间。 为了获得最佳结果,可以正常进行转换,但是Shader Graph的内置转换不支持此操作,因此方向是最佳选择。 然后,通过使用称为 surfgrad.shadersubgraph的法线 的子图将法线转换为表面渐变 。 一旦凹凸贡献是一个表面梯度,就可以像处理其他形式的凹凸贴图一样继续进行–按照上一节中的说明调整凹凸比例,并添加/混合多个表面梯度,直到最终解析以生成最终法线。

    三面投影 (Triplanar projection)

    Triplanar projection represents a special case for a bump map as a 3D texture. The paper “Surface Gradient Based Bump Mapping Framework” describes the full calculations to correctly do this. Below, see conventional normal map blending (left) compared with the surface gradient-based approach (right) (from a Unity presentation at Siggraph 2018). 

    三面投影代表凹凸贴图作为3D纹理的一种特殊情况。 论文“ 基于表面梯度的凹凸贴图框架 ”描述了正确执行此操作的完整计算。 下面,请参阅常规法线贴图混合(左)与基于表面梯度的方法(右)相比(来自 Siggraph 2018Unity演示 )。

    The graph Triplanar uses this method for blending by using the subgraph Triplanar to surfgrad.shadersubgraph to produce a surface gradient from a triplanar projection. As before, you can modulate the surface gradient using a bump scale, blend/add the surface gradient to other surface gradients, and then resolve to obtain the final normal.

    Triplanar 使用此方法进行混合,方法是使用子图 Triplanar进行surfgrad.shader 子图 以从三面投影产生曲面梯度。 和以前一样,您可以使用凹凸刻度调整表面梯度,将表面梯度混合/添加到其他表面梯度,然后解析以获得最终法线。

    混合/添加多个凹凸贴图 (Blending/adding multiple bump maps)

    One of the most valuable aspects of this framework is that it allows the correct blending of any category and number of bump maps, across any number of sets of texture coordinates, including procedural UVs. The example below shows three kinds of bump maps being blended: a tileable tangent space normal map, an object space normal map, and a bump map as a procedural 3D texture.

    该框架最有价值的方面之一是,它可以跨任意数量的纹理坐标集(包括程序UV)正确混合任何类别和数量的凹凸贴图。 下面的示例显示了三种混合的凹凸贴图:可拼贴的切线空间法线贴图,对象空间法线贴图和作为过程3D纹理的凹凸贴图。

    The graph Mixing performs blending in this way (see below). Note how each bump map results in a surface gradient that is modulated by its respective bump map intensity and also how the surface gradients can be combined by adding or blending them. In the end, the combined surface gradient is resolved to produce the final normal.

    图形“ 混合” 以这种方式执行混合(请参见下文)。 请注意,每个凹凸贴图如何产生由其各自的凹凸贴图强度调制的表面梯度,以及如何通过添加或混合它们来组合表面梯度。 最后,解析组合的表面梯度以生成最终法线。

    更多例子 (More examples)

    The Unity sample scene includes several other examples such as triplanar projection applied to a normal mapped surface, detail normal mapping applied after parallax correction or parallax occlusion mapping (POM), bump mapping from a height map, bump mapping using a procedural 3D texture, and more.

    统一样品场景 包括几个其它实例中,如三平面投影施加到一个正常映射表面,细节正常映射应用于视差校正或视差闭塞映射(POM),从一个高度图凹凸贴图,使用程序3D纹理凹凸贴图,后和更多。

    2019.3的新功能 (What’s new in 2019.3)

    You can now visually author shaders in Shader Graph and use them in Visual Effect Graph to create custom looks and rendering behaviors. We have added Shader Keywords, which can create static branches in your graph. Use this for things like building your own Shader LOD system. There is also added support for vertex skinning for DOTS animation which allows you to author better water and foliage. In addition, sticky notes improve your workflow by allowing you to leave comments and explanations for whomever is working on the project. Finally, procedural pattern subgraph samples show how math can be used to create procedural shapes and patterns. 

    现在,您可以在Shader Graph中直观地创建着色器,并在Visual Effect Graph中使用它们来创建自定义外观和渲染行为。 我们添加了着色器关键字,可以在图形中创建静态分支。 使用此功能构建自己的Shader LOD系统。 还为DOTS动画增加了对顶点蒙皮的支持,使您可以创作更好的水和树叶。 此外,s 尖刻的注释使您可以为项目的任何人留下评论和解释,从而改善了工作流程。 最后, 过程模式子图样本 显示了如何使用数学来创建过程形状和模式。

    -

    Please share your feedback in the Shader Graph forum!

    请在“ Shader Graph” 论坛上 分享您的反馈

    翻译自: https://blogs.unity3d.com/2019/11/20/normal-map-compositing-using-the-surface-gradient-framework-in-shader-graph/

    shader graph

    展开全文

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 3,075
精华内容 1,230
关键字:

shadergraph