Horizontally Scrolling DynamicFont Shader

Question

I'm trying to scroll a Label's text using a shader. Im using custom dynamic font. I've been trying the same technique I've learned for textures, so far without avail. My code :

shader_type canvas_item;

void fragment(){
    vec2 newuv = UV;
    newuv.x += TIME;
    vec4 c = texture(TEXTURE, newuv);
    COLOR = c;
}

Answer 1

It's because the text UV is different than others UV. It can be a bit tricky but let me show you this dark magic

First, you need to repeat your text 3 times

Now, lets animate the vertex

Time with multiplication by 0.5 means the speed is 0.5
Time is some kind of infinite and keeps increasing, that's why we need frac so when it passes 1 it will loop and return to zero
Multiplication by 87 to extend when should it loop and 87 because "Scrolling text" length is 87 pixels

Of course you didnt want if your player see the looping, to hide that we need a mask

Now that is the UV, as you can see, every char has different color, it's basically the UV position of every char, meaning that Godot actually use sheet-like text mapping

But don't worry, we can use our vertex color to create a new UV

Then use GradientTexture as a mask with the uv we created and finally multiply with the original alpha

Limitation: You cant change the text on the game because it will mess up unless you find a formula on how to calculate the size

Edit: I figured out how to calculate the UV, it turns out that 1 in vertex = 1 pixel ‍
So just simply divide the color.x by rect size.x

So no more uneditable limitation, just put a shader uniform + gdscript to automatically fits the text