Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 11 additions & 11 deletions tutorials/shaders/your_first_shader/your_first_2d_shader.rst
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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
}

Expand Down Expand Up @@ -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;
}

Expand Down