Horizontally Scrolling DynamicFont Shader

Archive
1
:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By wretch11

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;
}
2
:bust_in_silhouette: Reply From: AlphinAlbukhari

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
enter image description here

First, you need to repeat your text 3 times
enter image description here

Now, lets animate the vertex
enter image description here
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
enter image description here
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
enter image description here

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

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
enter image description here
So no more uneditable limitation, just put a shader uniform + gdscript to automatically fits the text