پس زمینه رو برای اینکه قشنگ تر بشه می تونیم یکم سبز کنیم

برای تمرین رسم کردن گراف-توی رو به شما پیشنهاد می کنم

Shader"ShaderMan/MyShader"{

SubShader{
Pass{
CGPROGRAM
#pragma vertex vert
#pragma fragment frag

#include "UnityCG.cginc"
struct appdata{
float4 vertex : POSITION;
float2 uv : TEXCOORD0;
};

struct v2f
{
float2 uv : TEXCOORD0;
float4 vertex : SV_POSITION;
float4 screenCoord : TEXCOORD1;
};

v2f vert(appdata v)
{
v2f o;
o.vertex = UnityObjectToClipPos(v.vertex);
o.uv = v.uv;
o.screenCoord.xy = ComputeScreenPos(o.vertex);
return o;
}
fixed4 frag(v2f i) : SV_Target{
{
i.vertex.y /= _ScreenParams.y;
i.vertex.y += tan(_Time.y + tan(i.vertex.x) + sin(.2 * i.vertex.x));
return fixed4(0., .3 + (i.vertex.y < 0. ? 0. : 1. - i.vertex.y * 3.), 0., 1.);
}
}ENDCG
}
}
}

اینم شیدر معادل برای یونیتی

این داستان ادامه دارد... (:
منتظر ادامه ی این آموزش باشید

سلام دوستان بعد از مدت ها بالاخره فرصت شد ادامه ی این آموزش رو بزارم...

برای نوشتن شیدر ماتریکس نیاز داریم تا حروف الفبا رو با شیدر بنویسیم چون قراره نوشته ها پایین بیان اما چطوری؟!

به نظرم بهتره یه چیز ساده براتون توضیح بدم به جای اینکه تک تک حروف رو با کد در بیاریم.
با رندوم میشه یه چیز ساده نوشت که در صورت تمایل می تونید گسترشش بدید...

خب برای شروع uv رو خروجی میگریم

میدونید چرا این رنگیه؟
شما حتماً با RGB آشنا هستید
Red 1,0,0
Green 0,1,0
Blue 0,0,1
این رنگ به خاطر مختصاتشه
سرچ کنید uv coordinates
(0,0) سیاه
(1,0) قرمز R
(1,1) زرد RG
(0,1) سبز G
.

void mainImage( out vec4 fragColor, in vec2 fragCoord ){
vec2 st = fragCoord.xy / iResolution.xy;
st.y *= iResolution.y/iResolution.x;

fragColor = vec4(st.xy,0.0,0.0);
}

چون قراره نوشته ها از بالا بیاد پایین نیاز داریم تا uv رو به قسمت های مساوی تقسیم کنیم .... این کار با استفاده از fract انجام میشه(تو یونیتی معادلش frac هست)

5 ردیف

vec3 matrix(in vec2 st){
float rows = 5.0;
vec2 ipos = floor(st*rows)+vec2(1.,0.);

vec2 fpos = fract(st*rows);
vec2 center = (.5-fpos);

return vec3(fpos,0.0);
}

void mainImage( out vec4 fragColor, in vec2 fragCoord ){
vec2 st = fragCoord.xy / iResolution.xy;
st.y *= iResolution.y/iResolution.x;

fragColor = vec4(matrix(st),0.0);
}

ما نیاز داریم تا تعداد ردیف هامون بیشتر باشه مثلاً 50 تا

حالا به صورت رندوم خونه ها رو خاموش می کنیم جوری که انگار uv های کوچک (پیکسل ها) داره میاد پایین
(دقت کنید که در شیدر نویسی از ضرب برای تیرگی و از تقسیم برای روشنایی تصویر استفاده میشه)

float random(in float x){
return fract(sin(x)*43758.5453);
}

float random(in vec2 st){
return fract(sin(dot(st.xy ,vec2(12.9898,78.233))) * 43758.5453);
}

vec3 matrix(in vec2 st){
float rows = 50.0;
vec2 ipos = floor(st*rows)+vec2(1.,0.);


vec2 fpos = fract(st*rows);
vec2 center = (.5-fpos);

float pct = random(ipos);
return vec3(fpos * pct,0.0);
}

void mainImage( out vec4 fragColor, in vec2 fragCoord ){
vec2 st = fragCoord.xy / iResolution.xy;
st.y *= iResolution.y/iResolution.x;

fragColor = vec4(matrix(st),1.0);
}