【转载】UE4 niagara教程--网格破碎

原文链接：UE4 niagara教程--网格破碎 | silver bullet

效果如上图，这里最重要做了两件事：

• （1）一个 sprite 对应一个三角面，计算正确的位置，尺寸，朝向，角度。
• （2）计算正确的 uv，获取颜色。

首先简单做一个发射器。我这里设置粒子生命为 10 秒，burst 粒子 41052（小白人三角面的数量），新建一个 Particles.skeletalmesh ,设置为我们的小白人，更新加一个 noise，用来后面做破碎的效果，渲染只需要 sprite 就行了。

下面一切的重点都在于我们 niagara module script (下图命名为 getskeletalmesh )

• 此图为完成后的图，请简单参考下

我们知道三个点可以确定一个三角面，而我们的 sprite 是个正方形，也就是说有四个点，所以材质那里我们设置为 mask（双面材质）, 简单做个遮罩，把它变成三角形。

如上图所示，你们也可以直接用贴图。

假如我们从网格上获取了一个三角面的三个点 A、B、C, 那我们就是要通过计算把 sprite 的三个点对应上去，其中一条边可以直接对齐 AB ，剩下的点用 世界场景位置偏移 来对齐 C 点。

上图可以用 particle.ID 对应三角面，然后获取三角面三个点的位置。

把 sprite 的原点设置在 (0, 0.5)，我们要把这条边对应到 AB 这条边上，那可得我们的 Particles.Position 就是在 AB 两点的中心。

然后就是要计算面朝向，面朝向需要垂直于三角面，但是我们不能直接从三角面法线获取，因为 ABC 三个点的顺序存在下图两种可能性，为了让后面计算世界位移保持正确，我们用 $\vec{AB} \times \vec{AC}$，向量叉乘得到一个垂直于两个向量的向量，取它的方向给予我们的 Particles.SpriteFacing

• 两种可能排序

位置跟朝向对齐后，我们还要对齐它的 Particles.SpriteAlignment，这个直接取 $\vec{AB}$ 的方向就可以了，这样一条边就算对齐了（如下图），并且 sprite 跟三角面处于同一个平面中。

接下来要算 Particles.SpriteSize, $\vec{AB}$ 对应的是 sprite 的 Y 轴，所以把它的长度给 Y，而 X 我们取 C 点到 $\vec{AB}$ 的垂直距离，也就是 $\vec{AB}$ 归一化后和 $\vec{AC}$ 叉乘。

• 为了截图，线整的有点乱，这里还包括后面 UV 的部分

对齐后是这样的（下图）

接下来要把 sprite 的点 G 移动到点 C，这需要在材质做世界位移，位移量就是 $\vec{GC}$ ,长度就是 $\vec{AB}$ 归一化后和 $\vec{AC}$ 点乘。方向与 $\vec{AB}$ 平行，所以点乘后乘 $\vec{AB}$ 的 direction 就是 $\vec{GC}$ 了。该向量通过 Particles.DynamicMaterialParameter 传递给材质。

因为我们只移动一个角，对齐好 $\vec{AB}$ 的需要固定不动，所以世界位移要乘上 X 的渐变。

到这里面片的计算就好了，你应该能看到一个完整的网格了。

下面来计算 UV。

我们需要把 sprite 的 texcoord 映射到小白人的 UV 上去，这个运算需要在材质里面进行，所以把 ABC 三点的 UV 都直接传递出去，按照我上面截的全图，我的 A、B 两点传递给了 Particles.DynamicMaterialParameter1，C 点分开传递给了 Particles.DynamicMaterialParameter 的 W 值和 Particles.MaterialRandom 。

经过简单的分析，我们易得 sprite 在小白人的 UV 上应该是 $A+x*(\vec{AC})+(1-y)*(\vec{AB})$

把计算好的 UV 连给小白人的贴图就可以得到正确的颜色了。

后面就没啥好说了，按照小白人的贴图进行混合就能还原出原来的网格了（没法做平滑）。

还有需要 注意 的是，最后的效果看起来有很多四边面，这是因为有一些相邻的三角面原点重合了，建议根据 ID 给个随机的力用来分开。