Godot Shader特效:用Shader实现循环滚动背景

循环滚动背景是游戏中常用的效果，实现方式有很多，比较传统的方式是用2个Sprite同步运动来实现;Godot还提供了一个ParallaxBackground节点也可以实现这个效果;实际上用Shader也可以很简单地实现这个效果，并且还可以简化场景节点结构以及表现和逻辑的结耦合。

效果图

循环滚动背景2d

实现方式

首先要对用作背景的图片启用repeat模式

启用repeat模式

代码如下

shader_type canvas_item;
render_mode unshaded;
uniform float speed_x = 0.0;
uniform float speed_y = 0.0;

void vertex(){
    UV += TIME * vec2(speed_x,speed_y);
}

补充一下在3D 中的实现，原理一致，这次不用设置那个repeat模式了

循环滚动背景3d

代码如下

shader_type spatial;
uniform sampler2D tex;
uniform float uv_speed_x = 0.5;
uniform float uv_speed_y = 0.0;

void vertex(){
    UV += TIME * vec2(uv_speed_x,uv_speed_y);
}
void fragment(){
    vec4 color = texture(tex,UV);
    ALBEDO = color.rgb;
    ALPHA =  color.a;
}