ShaderGraph 案例集:2D/基础/箭头移动像素化(200517)

1.箭头移动

在这里插入图片描述原理讲解
Tilling And Offset 节点其实就是UV节点,只是提供了Tilling和Offset 两种变化属性
最后就是简单的通过Time设置 Tilling ,从而驱动UV产生动态变化

2.像素化

在这里插入图片描述

原理讲解

节点的步骤是:

  1. Tilling and Offset节点其实就是相当于UV
  2. UV乘上pixels(像素化程度)相当于UV放大
  3. 再加上了0.5,这里的0.5相当于Y轴的偏移,不影响像素化
  4. 上面的结果又通过Round节点,四舍五入
  5. 最后的再除以pixels,还原UV

我们都知道

  • A*B=C
  • B/C = A
    就是说一个数乘一个倍数再除一个相同的倍数,最后是结果还是这个数.那么这里的UV乘一个pixels后再除一个pixels,最后会有像素化的效果呢?秘密就藏在Round节点上

我们需要将UV的值理解成连续的0到1 - [0,1],而不是一个个0.1,0.2,03这样离散的数组成的.
所以UV乘一个pixels再通过Round节点,经过四舍五入后,连续的数就有一部分丢失了,被取整了.
最后还原UV后,UV的本来连续的数才变成了一个个像素块,从而得到像素化效果

3.栅格化叠加颜色

在这里插入图片描述原理讲解

就是将UV的U(横向分量)放大后,通过Fraction(分数)形成栅格,最后再叠加上颜色.
通过数值说明一下
U的值是 : [0,1] --> [[0,0.1],[0.1,0.2]…[0.9,1]]
放大10倍:[0,10] --> [[0.1],[1,2]…[9,10]]
求分数后[ [0,1],[0,1]…[0,1] ]

Fraction函数图像如下

在这里插入图片描述

4.总览

在这里插入图片描述

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/kill566666/article/details/106172227