写一个让图片呈波浪形抖动的shader,有大大能看下问题吗?

参考网上的写法,在顶点着色器中对顶点y坐标随着x的增大添加偏移值,
具体的偏移值是 sin( 离节点最左边距离/图片宽度 )*20. 为什么没能实现红旗飘动的效果.
module.exports =
attribute vec4 a_position;
attribute vec2 a_texCoord;
attribute vec4 a_color;
varying vec4 v_fragmentColor;
varying vec2 v_texCoord;
uniform float _Strength;
void main()
{
float width = 222.;//纹理宽度
float startX = -width/2.;
float currAngle = ( ( a_position.x - startX )/width )*20.;
float ty = sin( currAngle );

gl_Position = CC_PMatrix*vec4(  a_position.x, a_position.y+ty*100. , a_position.z, 1.0 );
v_texCoord = a_texCoord;

}
``

jelly2.zip (323.9 KB)

顶点着色器应该实现不了吧,sprite只有六个顶点,不可能实现波浪形的,2.1.0有mesh可以实现,或者通过片元着色器实现

1赞

我看unity就是直接实现的,那要在片元着色器里实现,我能想到的就是平移。
那假如一个圆形的图片,我要对将它的边缘编程波浪形,我能想到的就是缩放,有更好的方法吗?

用Spine也可以做啊

就是不愿意用spine,因为要用到的地方会很多,一些搞十多个spine,太占资源了。
话说除了纹理缩放有没有更好的思路做波浪形的纹理啊,大师。

用2.1.1新版的材质系统写了一个类似的shader,是这个效果吗?
用的片段着色,没更改顶点位置

1赞