ZunGarden水和相关材质逻辑分析

最新推荐文章于 2020-10-16 00:31:02 发布
最新推荐文章于 2020-10-16 00:31:02 发布
阅读量172 收藏 1
点赞数
分类专栏： UE4材质
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_23030843/article/details/104357371
版权

在这里插入图片描述
ZunGarden水和相关材质分析

整体概况

我们对这个模块的主要研究的内容有：

  1. 静态水面其反射是如何实现的
    ![image1.png][2]

  2. 静态水面其流动效果和波纹感是如何实现的

  3. 静态水面如何实现的鼠标点击下的波纹荡漾。
    ![image2.png][3]

  4. 静态水面浮光掠影，主要控制透明度，最后并没有使用

  5. 静态水面如何实现的折射效果

![image3.png][4]

6 . 动态水面的制作

![image4.png][5]

  1. 鱼的材质制作

![image5.png][6]

1.1水面相关所有组件

我们找到水面材质的actor后我们会看到它里面的组件：

![image6.png][7]

  1. Billboard: BillboardComponent 是一个会被渲染为始终朝向摄像机的 2D
    贴图,

  2. StaticMesh:一个巨大的有厚度的平板

  3. Sphere：

  4. :ParticleSystem

1.2水面相关成员变量

![image7.png][8]

![image8.png][9]

这里比较值得先说的就是Billboard，设置Billboard的大小，大小主要和Actor大小一致。

静态水面反射机制

其反射使用的方法是基于IBL的反射原理。其为了性能上的优化，做了基于顶点的计算。所以，其还是使用了自定义UV的技术来在顶点着色器中进行计算

![image9.png][10]

材质会暴露一个LocationandRadius的参数，这个参数的前三个值代表的是其世界空间中的坐标，最后一个值代表的是半径

所有的参数如下

![image10.png][11]

当创建材质时

![image11.png][12]

在蓝图动态创建这个材质

![image12.png][13]

之后对这个参数进行修改。

其中ReflectionOffset的值是：

![image13.png][14]

首先将该actor在空间中对应的反射球的位置ReflectionActor的位置变换到自身的局部空间当中。然后用这个值来设置Reflection
Offset的值。也就是说我们最后对应cubemap的坐标位置是和反射球的位置保持一致的。

![image14.png][15]

之后实际上还有一个操作就是设置Sphere的半径和在世界空间的位置，这个位置主要是用ReflectionActor的位置，也就是说他们两个的世界空间位置是在一块的。

现在我们回到我们的材质当中。

![image15.png][16]

这里最重要的节点就是上图，根据相机位置反射位置和顶点位置，进行顶点级别的操作，这件事情当然是可以在像素着色器中做，但是会更消耗性能。这时我们计算出坐标后，有三个值，我们把之XY存储到第customizedUV1中，然后把Z存在customizedUV2
的u中，然后它的V是存储的它的菲尼尔系数

![image16.png][17]

最后在我们的自发光的模块，进行对应的取值就可以了

![image17.png][18]

当然最后会有菲尼尔的系数叠加

![image18.png][19]

静态水面皱纹与流动

其流动的效果，还是通过自定义Uv,增加一个平移来实现

![image19.png][20]

那么它的皱纹是如何实现的呢，主要是通过Normal贴图来实现的

![image20.png][21]

最后的法线贴图和cubemap里的反射位置进行叠加，呈现波纹的效果

静态水面水面波纹互动

这个效果就是能够在鼠标点击的时候制作一个围绕水面的波纹

![image21.png][22]

![image22.png][23]

主要的做法是传给材质一个Shpere的坐标，然后根据权重，进行从内到外的波纹加权
![image23.png][24]

从而实现这样的基本功能

静态水面浮光掠影

这里在测试的时候好像没看出有什么用，这里其实就是控制其透明度的问题

![image24.png][25]

总之在最终的材质中没有用到，官方的吐槽是保罗的大便？？？

静态水面水底的折射效果

![image25.png][26]

其利用水底的蠕动，进行折射效果的模拟，我们来看具体的材质

![image26.png][27]

首先是看到是只有CUV2是使用的

最主要的就是世界空间偏移，其使用的VertexDistortion进行顶点扭曲，具体的含义就不介绍了。这里的

![image27.png][28]

具体的效果就是两个材质的叠加，然后和我们的CUV2影响，来增加层次感

动态水面的制作

首先我们要知道的是，动态水面这里特指是只水缸里的水制作。它的技巧主要是对场景偏移上的操作上面，剩下所有的都和那些是一样的

![image28.png][29]

其在编辑器中对顶点颜色进行编辑，然后在及逆行一个Jiggle_WPO的偏移操作，

![image29.png][30]

这样就会呈现一个水的溢出效果呈现呼吸感

八. 鱼的材质制作

其主要技术点还是世界场景偏移，让其能进行摆动

最主要的就是顶点颜色的绘制

![image30.png][31]

![image31.png][32]
有非常多的参数进行控制，之后

![image32.png][33]

通过不同的RGB的颜色来判断是头还是尾，这样来进行摆动

Papals
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
UE4材质 阶梯式渐变
papalqi
02-18 1万+
UE4材质 阶梯式渐变 LinearGradient节点。当我们要创建一个从上到下的阶梯式渐变时，选择VGradient（V表示垂直，U代表横向）。 从那里添加一个“乘”节点，然后是“floor”，然后是“除”。将一维参数（在单击时按住键盘上的1，然后右键单击并转换为参数）到“乘和除” –这将控制渐变中的步数。我将我的设置为10，它给出了从黑色到白色的10个波段。 可以从此处进行多种不同的选择。...
UE4材质 制作UV贴图
热门推荐
papalqi
02-18 1万+
我们想要制作一张uv贴图，是一个什么意思呢？我们知道一般来说，我们都是根据uv来采样贴图，一般来说这个事情都是美术同学来制作的，所以我们想要进行的是在UE4中，动态或者根据自己的实际情况来生成一张贴图，并且我们要存储的内容也可以自己定。你可以自己生成法线贴图，或者是世界坐标的贴图，等等，并不拘泥于只存储颜色信息。 那么，我们如何进行相关的操作呢。 渲染目标 首先我们要做的就是生成一张RT，也就是r...
UE4 材质 生成随机数
papalqi
02-18 5991
参考之前的文章中关于随机数和noize的 https://papalqi.cn/201707/cid=558.html
UE4 材质 溶解材质
papalqi
02-18 5070
本文将介绍如何创建一种“溶入”和溶出的材质。 首先，创建一个新的材质并将“材质混合模式”更改为“蒙版”。 要创建材质使用的溶解的图案，请在“basecolor”中添加“noise”节点，进行左下方的调节，直到对结果满意为止 在我们的“噪声”图案中添加一个正弦波，这样它将在全白（完全不透明）到全黑（完全被遮盖）之间移动, 您可以通过使用自己的自定义纹理替换噪声纹理来进一步实现这个功能。我发现...
UE4 基于屏幕空间的描边材质
papalqi
02-17 1305
首先，看需求是什么，是否要透视，是内描边还是外描边。根据不同的需求都会有不同的思路。 为什么是在屏幕空间呢，据法线做当然是可以的，但是如果需求上不能这么做，例如法线很乱，什么光滑组什么破玩意的，那就只能只用基于屏幕空间来做了，而为什么在其他空间没有办法做呢，目前认为是因为没办法做边缘检测，只能知道自身的信息，所以才只能在最后做，现在不太清楚虚幻的渲染流程是什么样的，所以不敢妄加推断。 在UE4中，...
UE4 材质教程1
papalqi
02-18 1175
纹理的加减乘除 我们将“圆形”纹理插入到A输入中，将“线”型纹理插入到B输入中，然后将输出直接插入到basecolor中。 单色纹理 相同颜色的纹理 在两个纹理上使用相同的颜色 不同的颜色纹理 两个纹理上使用不同的颜色 ...
UE4 Element 火山材质分析
papalqi
02-17 694
滚动膨胀效果 可这效果就是让我们的烟能够拥有规律性的膨胀的效果 我们有连个尺度的贴图，一个是大尺度的贴图，粒度比较的大，另一个是小尺度的，比较的零碎。其中两张贴图其实是一样的，不过小的贴图是缩小了36倍。根据时间，对大尺度的斜方向平移贴图，然后锐化贴图，对小尺度的上移材质，然后进行锐化，各自增加自己的参数值。之后两者进行叠加合成一张贴图。 之后衰减上部的数值后，根据顶点的法线进行变换。也就是...
UE4 材质变体研究
papalqi
10-16 611
在编辑器打开时，会从资源包中LoadPackage,我们这里只关心的是材质问题。每一个Obj,都会调用自己的Obj->ConditionalPostLoad()这里已经是在加载的后端了，在这里面会调用子类的PostLoad（） for (int32 i = 0; i < ObjLoaded.Num(); i++) { UObject* Obj = ObjLoaded[i]; check(Obj); #if WITH_EDITOR //一顿操作 #end...
UE4 ZenGarden 窗户的反射和岩石的贴合
papalqi
02-17 411
窗户的反射和岩石的贴合 窗户的反射 这里的反射和水的反射如出一辙，仍然是使用CUV0，CUV1记录顶点的在CubeMap中的坐标值，和存储菲尼尔值。没什么好说的，今天我们就来看看之前说的这个函数把。 说实话，看了半天，完全不知所云，用纸写公式也不知道它想做什么，最后我只能自己想，如果我要做的话该怎么做…，就是先算出反射向量，然后在球体中算出坐标值，就这么简单，归根到底就两个公式，一个是反射公...
UE4 ZenGarden Rake 材质分析
papalqi
02-17 271
ZenGarden Rake 材质分析 今天要讨论的问题就是这个随着鼠标的拖动，能够形成痕迹的效果是怎么实现的 逻辑控制 主要的逻辑控制实在这个actor里面，和之前的讨论一样，如果它被点击的花，会触发它的interaction interface 事件。它会做如下的事情： 将点击点信息存储到LastHitResult中，并将HasLearned打开。 重置SplinePoint数组，...
电信塔施工方案.doc
04-27
5G通信行业、网络优化、通信工程建设资料。
29-【智慧城市与政府治理分会场】10亿大数据助推都市治理-30页.pdf
04-27
29-【智慧城市与政府治理分会场】10亿大数据助推都市治理-30页.pdf
ABB IRC5 Compact 机器人产品手册
04-27
ABB IRC5 Compact 机器人产品手册
LTE容量优化高负荷小区优化指导书.docx
04-27
5G通信行业、网络优化、通信工程建设资料
施工工艺及质量检查记录表.docx
04-27
5G通信行业、网络优化、通信工程建设资料。
25G无源波分安装规范指导.docx
04-27
5G通信、网络优化与通信建设
基于Springboot+Vue在线宠物用品交易网站毕业源码案例设计.zip
04-27
网络技术和计算机技术发展至今，已经拥有了深厚的理论基础，并在现实中进行了充分运用，尤其是基于计算机运行的软件更是受到各界的关注。加上现在人们已经步入信息时代，所以对于信息的宣传和管理就很关键。系统化是必要的，设计网上系统不仅会节约人力和管理成本，还会安全保存庞大的数据量，对于信息的维护和检索也不需要花费很多时间，非常的便利。 网上系统是在MySQL中建立数据表保存信息，运用SpringBoot框架和Java语言编写。并按照软件设计开发流程进行设计实现。系统具备友好性且功能完善。 网上系统在让售信息规范化的同时，也能及时通过数据输入的有效性规则检测出错误数据，让数据的录入达到准确性的目的，进而提升数据的可靠性，让系统数据的错误率降至最低。 关键词：vue；MySQL；SpringBoot框架 【引流】 Java、Python、Node.js、Spring Boot、Django、Express、MySQL、PostgreSQL、MongoDB、React、Angular、Vue、Bootstrap、Material-UI、Redis、Docker、Kubernetes
通信各专业(管道、线路、设备)安全操作规程.docx
04-27
5G通信行业、网络优化、通信工程建设资料
node-v12.13.1-x86.msi
最新发布
04-27
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Papals

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值