要开始了，之前废话和api堆的太多，主要是官方教程就是这么个顺序，来开始动手实践了
今天来进行的是2d实践
画一个矩形
- 拖拽一个图片到场景中
-
点击属性面板/canvasItem/material，新建一个ShaderMaterial，然后在Shader属性处新建一个shader （这里我把shader独立出来了，这样编辑代码只要在库里双击文件就行了，比较方便
- 输入代码
shader_type canvas_item;
void fragment(){
COLOR = vec4(0.4, 0.6, 0.9, 1.0);
}
你会发现图片是个蓝色，这是因为所有的像素点都设置了同样的值导致的
填充个彩色颜色
修改一下代码
shader_type canvas_item;
void fragment(){
COLOR = vec4(UV,.5,1.);
}
这是因为按照每个点的不同位置去填充导致的，UV上的x和y对应的是整个图片的左上角到右下角的0～1范围的小数，这里不用像素来表示，简单吧
使用图片，修改颜色
void fragment(){
COLOR = texture(TEXTURE, UV); //read from texture
COLOR.b = 1.0;
COLOR.g = .0;
}
这里不能只设置
COLOR.b，因为只要被修改，原有获取默认图片的方法就失效了，自己运行一下结果屏幕是什么颜色的，在下方留言给我 ；p
使用uniform输入变量
可以把变量的变化放到编辑器上，十分方便
shader_type canvas_item;
uniform float blue:hint_range(.0,1.,.1) = 1.;
void fragment(){
COLOR = texture(TEXTURE, UV); //read from texture
COLOR.b = blue;
COLOR.g = .0;
}
参数可以限制范围和步长
从gdscript修改和获取shader的uniform数值
var blue_value = material.get_shader_param("blue");
material.set_shader_param("blue", blue_value);
通过gd设置的值不会反应在编辑器界面上
顶点操作
之前都是对颜色处理，现在来试试顶点的处理
void vertex() {
VERTEX += vec2(10.0, 10.0);
}
这里直接将图像整体向右向下偏移了10个像素
让图片绕着原有的位置顺时针绕圈
···
void vertex() {
VERTEX += vec2(cos(TIME)100.0, sin(TIME)100.0);
}
···
就不录gif了，太麻烦了
进阶 2d水面
https://docs.godotengine.org/zh_CN/latest/tutorials/shading/intro_to_shaders_water_workshop.html
官方视频教程，比较详细