小功能⭐️Unity2018 Shader Graph——全息影像、物体消融

简介: 小功能⭐️Unity2018 Shader Graph——全息影像、物体消融

🟥 内容概要:

1、Shader Graph介绍

2、设置及工作流程介绍

3、Demo展示

4、自定义节点介绍

🟧 Shader Graph介绍

Shader分为Vertex Shader和Fragment Shader

Vertex Shader(顶点着色器):位置、法线、UV。将CPU传来的以上信息转换正确映射到屏幕坐标里面

Fragment Shader(片段着色器):贴图、光照、阴影。为屏幕上面片进行着色处理

Shader Graph优点:不必编程调试、可视化编辑

🟨 基本设置

1️⃣ 为Unity添加ShaderGraph组件

Window—Package Manager—All—Shader Graph、Lightweight Render Pipeline—Install

2️⃣ 创建Lightweight的配置文件

Assets中,右键Create—Rendering—LightweightAsset

3️⃣ 将创建的配置文件配置到U3D

Edit—Project Settings—Graphics—Scriptable Render Pipeline Settings,将2步创建的配置文件拖拽到此

4️⃣ Assets新建Shader—UnlitGraph

双击打开创建的UnlitGraph。该窗口可多开,可复制粘贴

Unlit Master:节点中最后一个节点,有且仅有一个,是定义材质表面的一个节点

SkodeUnlitGraph:最终效果显示窗口,可右键更改显示预览的模型/形状

Save Asset:保存结果

5️⃣ 给要体现该shader的物体设置该shader

Material—graphs—Shader

6️⃣ 更改ShaderGraph的Color,并且Save Asset,我们会发现SkodeUnlitGraph(最终效果显示窗口)和scene窗口结果发生改变

7️⃣ 在窗口内右键Create Node

Artistic:美术相关,饱和度等

Channel:RGB。。。

Input:从mesh可以获取的一些信息,法线、切线、位置、Matrix、贴图等

Master:上面第4条有提到

Math:数学相关函数

Procedural:在ShaderGraph中程序化的生成噪音贴图、形状贴图

Utility:逻辑与或等

UV:UV相关功能

🟩 利用ShaderGraph实现的特效

1️⃣全息影像

🚩 实现基本贴图材样

a、左上角graphs添加Texture

b、为Default添加logo

c、空白窗口右键Create Node搜索“Sample Texture 2D”并创建

d、拖拽MainTexture,将生成的Property放到工作区成为属性节点

e、将MainTexture属性节点的输出端口(小红点)与Sample Texture 2D的Texture连起来

f、将Sample Texture 2D的RGBA赋给Unlit Master的Color

g、在最终显示窗口UnlitGraph右键改为Quad形状

h、Save Asset

#pic_center =550x)

🚩 Scene窗口显示

a、创建面片,并创建Material赋值给面片,Material选择你创建的Shader:graphs—…

b、给面片Material的Shader—Main Texture赋值Logo

🚩 增添color属性

a、跟1)类似,在graphs/UnlitGraph添加Color,并将其作为属性拖拽出来

b、上色:Create Node—Multiply节点(乘法操作),将Color属性输出给Multiply A(4),Smaple Texture 2D的RGBA给Multiply B(4),Multiply Out给Unlit Master的Color(3)

这时我们即可通过改变颜色属性来控制最终显示的颜色

注意:我们在Shader窗口设置的数据不能实时体现在Scene窗口,因为Material不能动态根据Shader改变。因此只能删除Materiall重新赋值

🚩 将条纹贴图与logo混合

a、如3)所示,添加"HoloTexture"、“Sample Texture 2D”、“Multiply”

b、将Unlit Master的Surface改为Transparent,Blend改为Additive

🚩 添加Tiling And Offset节点

Tiling And Offset实现UV偏移。将Tiling And Offset的输出连至条纹贴图的UV输入端口。滚动Tiling And Offset—Offset的Y值,发现此时输出显示有了波纹的效果

🚩 实现全息影像的滚动效果

创建Time节点、Vector2节点以及Multiply节点,Multiply节点将Time和Vector2乘起来的值赋值给Tiling And Offset的Offset输入端口。

Vector2:X,0;Y,0.1

🚩 Add

也可通过添加Split节点,将输出至最后一步的颜色信息通过它分离开,只输出RGBA中想要的颜色

最终节点图:

最终效果图:

2️⃣Fresnel Effect(边缘光)

基本效果

1)、创建PBR Graph

2)、创建Fresnel Effect节点

通过Power调节外发光区域

3)、添加外发光颜色Color、相乘节点Mutiply,相乘即可改变外发光的颜色,将相乘结果赋值给PBR Master的Emision输入接口即可

4)、添加Sample Texture 2D,Ctrl+D复制第二个Sample Texture 2D

这两个节点用于得到输入的Albedo、法线贴图

5)、在左上角的graphs里创建两个Texture输入接口,分别是材质贴图、法线贴图,将这两个输入点拖出来作为属性,分别赋值给4),将其中一个的Type改为Normal(Normal连接Normal接口),将Albedo节点、Normal节点的RGBA输出端口分别连显示节点的Albedo、Normal输入端口

6)、将外发光的值作为属性暴露出来

在左上角的graph窗口创建Vector1,改名Power。将其作为属性拖到工作区,连接至Fresnel Effect的Power端口。值暂设为3

7)、给模型设置该ShaderGraph:graphs—…

积雪效果

3️⃣ 溶解效果

1)、选中2的法线和主贴图的两个节点,右键转化成子图:Convert To Sub-graph

子图保存在文件夹中,后续其他ShaderGraph共享该子图。

2)、工作窗口添加刚才创建的子图(主贴图、法线贴图两节点的子图),graphs添加主贴图、法线贴图两个属性,将该两个属性赋值给子图。将子图输出节点1给显示节点的Albedo,2给Normal

3)、添加噪音贴图Sample Noise,输出赋值给显示结果的Alpha,调整Scale的值,暂为100

4)、添加Vector1,赋给AlphaClipThreshold

这时,调整Vector1的值,便可看到消融效果的出现

5)、显示边缘,使消融效果更明显

a、创建Subtract节点(减去)

将Vector1的值给Subtract节点的A,噪音输出的值给B端口,即Subtract值为Vector1值减去噪音值

b、增加Step节点:该节点通过Edge将输入的值进行二元区分

将Subtract结果赋给Step的In(输入)端口,为使物体有边缘效果,Edge值暂设为-0.05(Edge为0时,无边缘效果。大于0的为1,小于的为0)

c、添加Color节点(调整Color的颜色。默认黑色,无法显示边缘),乘以Step输出的值,将结果赋给显示节点的Emission端口。

e、添加Time、Fraction节点(该节点使数值一直在0-1之间循环)

Time的Time输出端口连至Fraction节点输入端口,输出端口连至Subtract的A端口。

删除Vector1节点,将Faction的输出值连至显示结果的AlphaClipThreshold端口

4️⃣ 传送门效果

1)、创建Twirl节点、Sample Texture 2D

Twirl节点:作为Sample Texture 2D的输入属性,旋转Sample Texture 2D的UV

Offset:控制明暗区域的改变

2)、创建Voronoi噪音,删掉Sample Texture 2D,改连至Voronoi

Angle Offset:控制噪音形状的改变;Cell Density:细胞密度

3)、创建Ellipse

4)、将Ellipse和Voronoi用Mutiply相乘

5)、这时调整Twirl Offset的X、Y或Voronoi的X,即可实现传送门效果

5️⃣ 电视效果


相关文章
|
10天前
|
图形学
Unity 获取鼠标位置下的UGUI或3D物体
本文总结了两种检测方法,分别用于UGUI和3D物体的检测。第一种方法`GetOverUIobj`专门用于检测鼠标悬停的UGUI元素,通过`GraphicRaycaster`实现。第二种方法`GetOverWordGameObject`则同时适用于UI和3D物体检测,利用`PhysicsRaycaster`进行射线检测。两者均返回悬停对象或null。
|
10天前
|
图形学
unity 物体震动
在Unity中实现物体震动效果,主要通过改变物体的位置、旋转或缩放属性来模拟震动。以下是位置震动的实现原理及代码示例:通过随机生成微小偏移量并累加到物体位置上,在短时间内不断改变位置产生震动效果。生成随机偏移,并结合时间控制持续震动。
|
10天前
|
前端开发 图形学
unity UGUI跟随3D物体的坐标转换
在 Unity 中实现 UGUI 元素跟随 3D 物体,关键是将 3D 物体的世界坐标转换为屏幕或画布坐标。通过 Camera.WorldToScreenPoint 方法,可将 3D 物体位置映射到屏幕上,再更新 UGUI 元素的位置。代码示例展示了如何使用该方法,使 UGUI 图像跟随 3D 模型,并提供文字显示、图像和线条的显示/隐藏功能。
|
10天前
|
图形学
unity噪声消融效果Shader实现
在 Unity 中实现噪声消融效果,利用噪声纹理和透明度裁剪技术。噪声纹理(如 Perlin 噪声)为物体表面提供随机参考值,透明度裁剪通过设置阈值控制显示与消失。具体步骤包括引入噪声纹理、设置阈值和边缘颜色,使用自定义着色器代码实现物体部分消失的视觉效果。通过调整材质球和噪声贴图,可优化最终呈现。
|
10天前
|
存储 图形学 索引
unity 使物体跟随路径点自动移动位置
在Unity中,物体沿路径点自动移动的核心原理是通过预设路径点,控制物体依次移动。路径点可用空对象或三维向量数组定义,并按顺序存储。移动时,计算当前位置与下一个路径点的向量差以确定方向,使用`Vector3.MoveTowards`逐步靠近目标点。代码实现包括路径点设置、移动控制及插值计算,确保物体平滑移动和旋转。
|
10天前
|
图形学
Unity 射线移动物体Ray
在Unity中,通过射线检测实现3D物体的拖拽和移动。射线由起点和方向组成,使用`Physics.Raycast`检测与物体的交点。点击物体时,记录位置偏移量,拖动过程中更新物体位置。代码包括基本拖拽和上下拖动功能,适用于正交摄像机场景。测试时为物体设置特定标签(如"JQR")以便区分和操作。 示例代码展示了如何通过鼠标事件控制物体移动,并结合层级掩码优化射线检测。具体实现包括:点击选中物体、拖动更新位置、释放鼠标取消选择。此外,提供了上下拖动的额外功能,通过按键切换模式。
|
10天前
|
图形学 开发者
unity 从工具栏拖动生成物体
在 Unity 中实现从工具栏拖动生成物体的功能,基于编辑器扩展、事件系统和预制体实例化。通过自定义编辑器窗口、处理鼠标事件(按下、移动、释放)及使用 Instantiate 方法,可实现拖动并生成预制体物体。代码示例展示了如何检测鼠标事件并在指定位置实例化物体。
|
11天前
|
图形学 UED
unity Tab键实现切换输入框功能
该脚本用于简化输入框之间的Tab键切换操作。只需将脚本挂载在InputField上,无需其他设置。脚本通过监听Tab键和Shift键组合,自动选择下一个或上一个可交互的InputField,提升用户体验。
|
6月前
|
定位技术 C# 图形学
从零开始的unity3d入门教程(二)----基本功能讲解
这是一篇Unity3D入门教程,详细介绍了Unity界面操作、游戏物体创建修改、场景搭建、玩家控制、音效添加以及游戏测试和导出的全过程。
从零开始的unity3d入门教程(二)----基本功能讲解
|
6月前
|
图形学 数据可视化 开发者
超实用Unity Shader Graph教程:从零开始打造令人惊叹的游戏视觉特效,让你的作品瞬间高大上,附带示例代码与详细步骤解析!
【8月更文挑战第31天】Unity Shader Graph 是 Unity 引擎中的强大工具,通过可视化编程帮助开发者轻松创建复杂且炫酷的视觉效果。本文将指导你使用 Shader Graph 实现三种效果:彩虹色渐变着色器、动态光效和水波纹效果。首先确保安装最新版 Unity 并启用 Shader Graph。创建新材质和着色器图谱后,利用节点库中的预定义节点,在编辑区连接节点定义着色器行为。
448 0