用Unity做水波效果

遇到了需要做动态水波效果的需求,类似下图

用Unity做水波效果

1. 最简单最naive的是只用一张水波图

  • 将这个图片挂在一个有mask组件的父节点上,这个父节点可以挂一个圆形的图当做遮罩。注意这个水波图的宽度一定要比圆形的直径长。
  • 用代码控制水波图的左右移动,来做水流波动的效果,进度条的位置通过调整其y轴的大小。
  • 这种方法很容易实现,但明显的缺点是无法很好的调整水波的状态,可能达不到想要的效果

用Unity做水波效果

最终效果:

用Unity做水波效果

2. 用动画帧做水波效果

  • 用一张包含多个sprite的图片做动画(随便拿了个图),将Texture type 设成Sprite (2D and UI), sprite mode设为multiple
  • 打开sprite editor,选取单个sprite所取的大小,生成多个图片序列
  • 选取图片序列,拖拽到animation中, 调整位置得到想要的动画效果。
  • 和第一个方法一样也是挂在一个有mask组件的父节点上当做遮罩,进度条的位置通过调整其y轴的大小。

用Unity做水波效果用Unity做水波效果

用Unity做水波效果

 

最终效果:

 用Unity做水波效果

 

 3. 用UV动画,在shader里操作。具体可参考:https://gameinstitute.qq.com/community/detail/123918

 

 参考资料:

  1. https://docs.coronalabs.com/guide/media/spriteAnimation/index.html
上一篇:2D骨骼动画工具Sprite Studio使用教程


下一篇:【教程】在页面上使用SVG(SVG Sprite)