平湖模板网站建设公司,广告设计培训机构哪家好,如何做盗版视频网站,网页设计师的工作时间文章目录 前言一、ShaderToy网站二、ShaderToy基本框架1、我们可以在ShaderToy网站中#xff0c;这样看用到的GLSL文档2、void mainImage 是我们的程序入口#xff0c;类似于片断着色器3、fragColor作为输出变量#xff0c;为屏幕每一像素的颜色#xff0c;alpha一般赋值为… 文章目录 前言一、ShaderToy网站二、ShaderToy基本框架1、我们可以在ShaderToy网站中这样看用到的GLSL文档2、void mainImage 是我们的程序入口类似于片断着色器3、fragColor作为输出变量为屏幕每一像素的颜色alpha一般赋值为 14、fragCoord作为输入变量 三、怎么把ShaderToy的Shader转化为Unity中的Shader1、使用到的代码基础模板2、逐条把ShaderToy代码转化到Unity中Shader 三、最终效果 前言
我们在之前的文章中学习了很多的Shadar知识。但是我们没有自己实现一些奇特的效果。而ShaderToy是一个国外的网站上面刚好有很多Shader大神实现的效果提供给我们借鉴。我们在这篇文章中了解一下ShaderToy。 一、ShaderToy网站
ShaderToy
我们可以借鉴这个网站中的 视觉灵感 和 算法 来提升自我 我们来看看iq大神的作品 ShaderToy本质使用的是GLSL我们可以查看OpenGL的官方文档来学习 二、ShaderToy基本框架
1、我们可以在ShaderToy网站中这样看用到的GLSL文档 2、void mainImage 是我们的程序入口类似于片断着色器 3、fragColor作为输出变量为屏幕每一像素的颜色alpha一般赋值为 1 4、fragCoord作为输入变量 三、怎么把ShaderToy的Shader转化为Unity中的Shader
因为ShaderToy的操作是类似于直接对屏幕上的图像做处理并且覆盖。 处理起来和Unity中的后处理很像所以我们可以直接使用后处理脚本框架来实现 Unity中后处理简介 Unity中后处理 脚本 和 Shader
1、使用到的代码基础模板
因为ShaderToy是直接对屏幕像素进行覆盖修改。 所以我们的功能主要在Shader的片元着色器中完成并且不需要外部传入属性
C#
using System;
using System.Collections;
using System.Collections.Generic;
using UnityEngine;//后处理脚本
[ExecuteInEditMode]
public class P2_8 : MonoBehaviour
{public Shader PostProcessingShader;private Material mat;public Material Mat{get{if (PostProcessingShader null){Debug.LogError(没有赋予Shader);return null;}if (!PostProcessingShader.isSupported){Debug.LogError(当前Shader不支持);return null;}//如果材质没有创建则根据Shader创建材质并给成员变量赋值存储if (mat null){Material _newMaterial new Material(PostProcessingShader);_newMaterial.hideFlags HideFlags.HideAndDontSave;mat _newMaterial;return _newMaterial;}return mat;}}private void OnRenderImage(RenderTexture source, RenderTexture destination){Graphics.Blit(source,destination,Mat);}
}
Shader
Shader MyShader/P2_8
{SubShader{// No culling or depthCull Off ZWrite Off ZTest AlwaysPass{CGPROGRAM#pragma vertex vert#pragma fragment frag#include UnityCG.cgincstruct appdata{float4 vertex : POSITION;float2 uv : TEXCOORD0;};struct v2f{float2 uv : TEXCOORD0;float4 vertex : SV_POSITION;};v2f vert (appdata v){v2f o;o.vertex UnityObjectToClipPos(v.vertex);o.uv v.uv;return o;}fixed4 frag (v2f i) : SV_Target{return 1;}ENDCG}}
}
2、逐条把ShaderToy代码转化到Unity中Shader
void mainImage( out vec4 fragColor, in vec2 fragCoord )
{// Normalized pixel coordinates (from 0 to 1)vec2 uv fragCoord/iResolution.xy;// Time varying pixel colorvec3 col 0.5 0.5*cos(iTimeuv.xyxvec3(0,2,4));// Output to screenfragColor vec4(col,1.0);
}i 开头的变量都是着色器的内部输入变量 fragCoord输入图像的像素 所在屏幕中的位置 x(宽)、y(高) iResolution.xy : x代表屏幕宽度y代表屏幕高度 fragCoord/iResolution.xy 得到一个归一化后01的值 等效 i.uv iTime是一个一维变量单位为秒 等效_Time.y fragColor输出变量 等效return col
转化后的片元着色器
fixed4 frag (v2f i) : SV_Target
{//vec2 uv fragCoord/iResolution.xy;//i.uv//vec3 col 0.5 0.5*cos(iTimeuv.xyxvec3(0,2,4));float3 col 0.5 0.5*cos(_Time.y i.uv.xyx fixed3(0,2,4));//fragColor vec4(col,1.0);return fixed4(col,1);
}三、最终效果
