大神们,Happy Glass中的水滴的粘连效果如何实现啊?

RT,
这款游戏中水的粘连效果在Construct3中利用图层很容易实现,就是每个水滴都是挂了两个圆形图片素材,其中一个是水滴本来的蓝色,另一个是其他颜色且素材边缘半是透明的。当几个水滴靠近时让半透明素材边缘相互重叠,这时原本半透明的边缘透明度变低。通过在当前图层中使用Shader,并设定Alpha阈值——小于Alpha阈值部分按全透明处理,大于Alpha阈值部分则按不透明处理——这样一来,一个单独孤立的水滴,其半透明边缘全部被处理成全透明,以此表现一个孤立的水滴,而挤在一起的几个水滴,其重叠的边缘就会处理成不透明,从而形成水滴粘连的效果,代表汇集在一起的水滴,并模拟水的张力。

由于Cocos Creator没有Construct3中的图层Layer概念,不能对一个图层中全部的图片素材整体使用一个Shader,因此上述方法并不适用。

那么问题就是——有没有别的办法让Cocos Creator实现上述水的效果?

9赞

怪不得这游戏效果和效率很好,比每个球各自挂shader传入参数计算(而非使用图片素材)的方式明显更省运算(初期我是一张图传入所有球坐标,爆卡)

liquidfun + shader

3赞

你对点坐标的处理不要放在shader里,在shader外做间距运算,只传入需要做metaball的势能处理的相近点

如何合入到cocos?

我说的是初期,只想一个sprite,所以自然是需要传所有坐标。
后期是每个球带shader,传范围内最近几个球的坐标,超范围的不管,范围内超过9个则只算最近9个。

大神,这个效果如何做到的?效率怎么样?

可以私信聊聊吗?

metaball+shader。
效率。。。一个球一个drawcall(最开始不想那么多一个sprite结果卡到死)
骁龙430还能50帧,
果子机直接60/30不停跳并卡顿

厉害了

如何应用到 cocos creator的 js中

liquidfun 有js版本的

http://google.github.io/liquidfun/

说来惭愧,完全不知道怎么合并进去

liquidfun.zip (195.3 KB)

我找到了这个js文件但是不知道如何应用 有简单的demo吗 参考一下

http://google.github.io/liquidfun/testbed/index.html

你发的链接我看到了,我想的是如何 把这个合并到cocos creator ,
1,假设liquidfun 为第三方物理系统,是不是creator中就会存在 两个物理世界,是完全替换掉 内置的物理世界?
2,不然通过creator生成的物理组件,和第三方的 处于两个世界?
3,我想最小代价是 直接替换掉 creator中的粒子系统,为liquidfun中的粒子系统,尝试了一下 一脸懵逼!!!
4,https://blog.csdn.net/final5788/article/details/49200947文章中提到直接替换掉box2d,但是在liquidfun.js中所有的都合并到了一个文件,拆分出box2d.js 我不知道可不可以?
5,最坏的方法直接替换掉物理系统,所有碰撞系统都需要重新写,渲染系统 是不是也得需要 第三方的 库?

以上是我的想法 ,有没有大神提供一点思路?

liquidfun 似乎就是box2d的流体扩展类,cocoscreator就内置box2d