|
@@ -43,7 +43,7 @@ so long as it is drawing to the canvas, so for this tutorial we will use a Sprit
|
|
|
as it is the easiest CanvasItem to start drawing with.
|
|
|
|
|
|
In the Inspector, click beside "Texture" where it says "[empty]" and select
|
|
|
-"Load", then select "Icon.png". For new projects, this is the Godot icon. You
|
|
|
+"Load", then select "icon.svg". For new projects, this is the Godot icon. You
|
|
|
should now see the icon in the viewport.
|
|
|
|
|
|
Next, look down in the Inspector, under the CanvasItem section, click beside
|
|
@@ -132,27 +132,27 @@ other functions or to assign values to ``COLOR`` directly.
|
|
|
Using ``TEXTURE`` built-in
|
|
|
^^^^^^^^^^^^^^^^^^^^^^^^^^
|
|
|
|
|
|
-When you want to adjust a color in a Sprite2D you cannot just adjust the color
|
|
|
+The default fragment function reads from the set Sprite2D texture and displays it.
|
|
|
+
|
|
|
+When you want to adjust a color in a Sprite2D you can adjust the color
|
|
|
from the texture manually like in the code below.
|
|
|
|
|
|
.. code-block:: glsl
|
|
|
|
|
|
void fragment(){
|
|
|
- //this shader will result in an all white rectangle
|
|
|
+ // This shader will result in a blue-tinted icon
|
|
|
COLOR.b = 1.0;
|
|
|
}
|
|
|
|
|
|
-The default fragment function reads from a texture and displays it. When you
|
|
|
-overwrite the default fragment function, you lose that functionality, so you
|
|
|
-have to implement it yourself. You read from textures using the ``texture``
|
|
|
-function. Certain nodes, like Sprite2Ds, have a dedicated texture variable that
|
|
|
-can be accessed in the shader using ``TEXTURE``. Use it together with ``UV`` and
|
|
|
-``texture`` to draw the Sprite2D.
|
|
|
+Certain nodes, like Sprite2Ds, have a dedicated texture variable that can be accessed
|
|
|
+in the shader using ``TEXTURE``. If you want to use the Sprite2D texture to combine
|
|
|
+with other colors, you can use the ``UV`` with the ``texture`` function to access
|
|
|
+this variable. Use them to redraw the Sprite2D with the texture.
|
|
|
|
|
|
.. code-block:: glsl
|
|
|
|
|
|
void fragment(){
|
|
|
- COLOR = texture(TEXTURE, UV); //read from texture
|
|
|
+ COLOR = texture(TEXTURE, UV); // Read from texture again.
|
|
|
COLOR.b = 1.0; //set blue channel to 1.0
|
|
|
}
|
|
|
|
|
@@ -180,7 +180,7 @@ Add a uniform to change the amount of blue in our Sprite2D.
|
|
|
uniform float blue = 1.0; // you can assign a default value to uniforms
|
|
|
|
|
|
void fragment(){
|
|
|
- COLOR = texture(TEXTURE, UV); //read from texture
|
|
|
+ COLOR = texture(TEXTURE, UV); // Read from texture
|
|
|
COLOR.b = blue;
|
|
|
}
|
|
|
|