求助：这种瞄准线特效是怎么做的？

Creator 3.x
#1

微信图片_20240121214757
bee5e81dae4b8730a69e -small-original

在开发一个泡泡龙游戏，想实现类似上面图片中瞄准线的特效部分？
不懂shared,求助给个思路，多谢了！
目前我使用的是小球球瞄准线，如下图：

FZkk68rXLt

#2

shader实现反而麻烦了.
中间的波动帧动画(看起来很连贯的效果其实只是一段的循环播放形成的整体效果,让美术去搞定就行),首尾和连接处用发光体特效遮挡住.

#4

射线或者一个个点都直接用美术解决比shared方便很多，效果更好更炫，添加新的效果也比shared快，别给自己找麻烦。

#5

line

#6

如果是帧动画，如果拉长或缩短应该会变形吧

#7

很简单，uv随时间偏移就可以了，论坛有这种shader，你可以搜一下

#8

屏幕录制2024-01-22 10.44.49

#9

归档.zip (1.9 KB)

#10

https://forum.cocos.org/t/shader-uv/96831
可以看看这个

#11

tiled模式

#12

不会shared

#13

没有分享精神！！

#14

你好，请问效果实现了，可以给个简单demo吗

#15

你好，请问你这种效果可以给个demo吗

#16

// Copyright © 2017-2018 Xiamen Yaji Software Co., Ltd.

CCEffect %{
techniques:

  • passes:
    • vert: vs
      frag: fs
      blendState:
      targets:
      • blend: true
        rasterizerState:
        cullMode: none
        properties:
        texture: { value: white }
        u_uvOffset: { value: [0.0,0.0,0.0,0.0] }
        alphaThreshold: { value: 0.5 }
        u_uvRotation: { value: 0.0 }
        }%

CCProgram vs %{
precision highp float;

#include
#include

in vec3 a_position;
in vec4 a_color;
out vec4 v_color;

#if USE_TEXTURE
in vec2 a_uv0;
out vec2 v_uv0;
#endif

void main () {
vec4 pos = vec4(a_position, 1);

#if CC_USE_MODEL
pos = cc_matViewProj * cc_matWorld * pos;
#else
pos = cc_matViewProj * pos;
#endif

#if USE_TEXTURE
v_uv0 = a_uv0;
#endif

v_color = a_color;

gl_Position = pos;

}
}%

CCProgram fs %{
precision highp float;

#include
#include
#include

in vec4 v_color;

#if USE_TEXTURE
in vec2 v_uv0;
uniform sampler2D texture;
#endif

uniform ARGS {
vec4 u_uvOffset;
float u_uvRotation;
};

void main () {
vec4 o = vec4(1, 1, 1, 1);

vec2 uv = v_uv0.xy;
uv.x -= cc_time.x * 0.5;
uv.x = fract(uv.x);

#if USE_TEXTURE
  CCTexture(texture, uv, o);
#endif

o *= v_color;

ALPHA_TEST(o);
gl_FragColor = o;

}
}%

1赞
#17

2.4.x uv偏移effect源文件