[技美CG]Unity3D复刻UnityShader 之 ShaderToy

Unity3D复刻UnityShader 之 ShaderToy - Bubbles

背景:
官方地址/参考资料:
ShaderToy-Bubbles原始代码:
Unity复刻开始
- 核心显示类:
- 核心unity shader:
复刻结束,展示效果:
- ShaderToy-Bubbles效果:
- Unity-Bubbles效果
github完整项目地址:

背景:

突然发现了一个Shader相关的神仙网站,之前对Shader也不了解,准备把能自己搬得,都用Unity实现[复刻]一遍…

官方地址/参考资料:

官网地址:https://www.shadertoy.com/view/4dl3zn

参考:https://www.freesion.com/article/2242713762/

ShaderToy-Bubbles原始代码:

// Created by inigo quilez - iq/2013
// I share this piece (art and code) here in Shadertoy and through its Public API, only for educational purposes.
// You cannot use, sell, share or host this piece or modifications of it as part of your own commercial or non-commercial product, website or project.
// You can share a link to it or an unmodified screenshot of it provided you attribute "by Inigo Quilez, @iquilezles and iquilezles.org".
// If you are a techer, lecturer, educator or similar and these conditions are too restrictive for your needs, please contact me and we'll work it out.void mainImage( out vec4 fragColor, in vec2 fragCoord )
{vec2 uv = -1.0 + 2.0*fragCoord.xy / iResolution.xy;uv.x *=  iResolution.x / iResolution.y;// background  vec3 color = vec3(0.8 + 0.2*uv.y);// bubbles for( int i=0; i<40; i++ ){// bubble seedsfloat pha =      sin(float(i)*546.13+1.0)*0.5 + 0.5;float siz = pow( sin(float(i)*651.74+5.0)*0.5 + 0.5, 4.0 );float pox =      sin(float(i)*321.55+4.1) * iResolution.x / iResolution.y;// buble size, position and colorfloat rad = 0.1 + 0.5*siz;vec2  pos = vec2( pox, -1.0-rad + (2.0+2.0*rad)*mod(pha+0.1*iTime*(0.2+0.8*siz),1.0));float dis = length( uv - pos );vec3  col = mix( vec3(0.94,0.3,0.0), vec3(0.1,0.4,0.8), 0.5+0.5*sin(float(i)*1.2+1.9));//    col+= 8.0*smoothstep( rad*0.95, rad, dis );// renderfloat f = length(uv-pos)/rad;f = sqrt(clamp(1.0-f*f,0.0,1.0));color -= col.zyx *(1.0-smoothstep( rad*0.95, rad, dis )) * f;}// vigneting   color *= sqrt(1.5-0.5*length(uv));fragColor = vec4(color,1.0);
}

Unity复刻开始

核心显示类:

using System;
using UnityEngine;[ExecuteInEditMode]
public class ShaderToy : MonoBehaviour
{public int horizontalResolution = 320;public int verticalResolution = 240;public Shader shaderToy;private Material shaderToyMaterial = null;public Material material{get{shaderToyMaterial = CheckShaderAndCreateMaterial(shaderToy, shaderToyMaterial);return shaderToyMaterial;}}// Called by camera to apply image effectvoid OnRenderImage(RenderTexture source, RenderTexture destination){// To draw the shader at full resolution, use: // Graphics.Blit (source, destination, material);// To draw the shader at scaled down resolution, use:RenderTexture scaled = RenderTexture.GetTemporary(horizontalResolution, verticalResolution);Graphics.Blit(source, scaled, material);Graphics.Blit(scaled, destination);RenderTexture.ReleaseTemporary(scaled);}protected Material CheckShaderAndCreateMaterial(Shader shader, Material material){if (shader == null){return null;}if (shader.isSupported && material && material.shader == shader)return material;if (!shader.isSupported){return null;}else{material = new Material(shader);material.hideFlags = HideFlags.DontSave;if (material)return material;elsereturn null;}}
}

核心unity shader:

// Upgrade NOTE: replaced 'mul(UNITY_MATRIX_MVP,*)' with 'UnityObjectToClipPos(*)'// See https://www.shadertoy.com/view/4dl3zn
// GLSL -> HLSL reference: https://msdn.microsoft.com/en-GB/library/windows/apps/dn166865.aspxShader "Custom/Bubbles" {SubShader {Pass {CGPROGRAM#pragma vertex vert#pragma fragment fragstruct v2f{float4 position : SV_POSITION;};v2f vert(float4 v:POSITION) : SV_POSITION {v2f o;o.position = UnityObjectToClipPos (v);return o;}fixed4 frag(v2f i) : SV_Target {float2 uv = -1.0 + 2.0*i.position.xy/ _ScreenParams.xy;uv.x *= _ScreenParams.x/ _ScreenParams.y ;// Backgroundfixed4 outColour = fixed4(0.8+0.2*uv.y,0.8+0.2*uv.y,0.8+0.2*uv.y,1);// Bubblesfor (int i = 0; i < 40; i++) {// Bubble seedsfloat pha =      sin(float(i)*546.13+1.0)*0.5 + 0.5;float siz = pow( sin(float(i)*651.74+5.0)*0.5 + 0.5, 4.0 );float pox =      sin(float(i)*321.55+4.1);// Bubble size, position and colorfloat rad = 0.1 + 0.5*siz;float2  pos = float2( pox, -1.0-rad + (2.0+2.0*rad)*fmod(pha+0.1*_Time.y*(0.2+0.8*siz),1.0));float dis = length(uv-pos);float3 col = lerp( float3(0.94,0.3,0.0), float3(0.1,0.4,0.8), 0.5+0.5*sin(float(i)*1.2+1.9));// Add a black outline around each bubblecol+= 8.0*smoothstep( rad*0.95, rad, dis );// Renderfloat f = length(uv-pos)/rad;f = sqrt(clamp(1.0-f*f,0.0,1.0));outColour.rgb -= col.zyx *(1.0-smoothstep( rad*0.95, rad, dis )) * f;}// Vignetting    outColour *= sqrt(1.5-0.5*length(uv));return outColour;}ENDCG}}
}

复刻结束,展示效果:

ShaderToy-Bubbles效果:

Unity-Bubbles效果

github完整项目地址:

https://github.com/zld126126/MyUnity/tree/main/MyShaderToy/Assets/MyExamples/Bubbles

[技美CG]Unity3D复刻UnityShader 之 ShaderToy - Bubbles相关推荐

[unity3d][复刻]复刻刺客信条鹰眼效果
简介今天看到国外的一个大佬做的一个魔方刺客信条鹰眼的效果,我看着不错,就学着做了一下,秉着取其精华去其糟粕的原则进行了自己的复刻,并介绍一下我的制作步骤.大佬的视频地址我真的已经不知道了,所以也就不 ...
[技美CG]ShaderToy对照UnityShader方法目录 [入门替换版]
ShaderToy对照UnityShader 对照调整部分: 一个完整例子: 效果展示: 其他例子: 对照调整部分: 语法相同不再列举, 只列举需要改变语法的部分... ShaderToy Unity ...
[技美CG][DX12实战]Demo 运行【DX12】【VS2022】【龙书】【新手开箱可用】
DirectX12 3D 游戏开发实践 Demo 运行前言官方网站运行官方demo 1.安装vs2022 2.如图解压Common文件夹和MyD3D12Project到本地 3.解压后如图 4. ...
乐高幻影忍者推出十周年复刻经典套装；炸鸡大师Popeyes开设首家南京旗舰店 | 美通企业日报...
今日看点:乐高幻影忍者系列诞生十周年,推出复刻经典套装与时尚联名系列.炸鸡大师Popeyes正式宣布入驻南京.麦德龙中国发布2020可持续发展报告.Cytiva向龙沙集团交付模块化生物工厂.拜耳以医药 ...
最新复刻李峋爱心表白HTML源代码+超唯美
正文: 果然没一个人能逃过命韵峋环,李峋的爱心代码真的甜到发昏.(个人感觉这个有点像GIF图"没有断定"没有演示代码的执行过程),是动态的,爱心可以动. 下面是经博主美化后的复刻的 ...
「技美之路」图形 1.1 渲染流水线
今日起开始分享学习技美之路专栏,文章来源听课笔记以及业界大佬分享的经验文章,主要来自CSDN_知乎等.技美路漫长一定要坚持开始吧! 一.整体流程整体流程(渲染管线可分为四个阶段)每一个阶段的输 ...
无人配送的Nuro再融5亿美元，为啥中国复刻者们没它这么火
雷刚发自凹非寺量子位报道 | 公众号 QbitAI 复旦才俊朱佳俊的无人车公司Nuro.ai,又完成了新一轮融资. C轮次,5亿美元. 本轮融资由T. Rowe Price Associat ...
10年代码经验程序员UP主复刻“阴间”超级马里奥，获赞27万，马里奥：我头呢？
本文转载自大数据文摘 <超级马里奥兄弟>是很多人童年的回忆,对B站up主"M木糖M"来说也不例外. 为了纪念自己的童年,我们这位代码经验丰富的up主决定自己动手复刻一 ...
滴滴正式分拆无人车业务，复刻Uber上市路径，传孙正义再加持
李根发自凹非寺量子位报道 | 公众号 QbitAI 滴滴无人车,终于也官宣分拆了. 今天(8月5日)滴滴出行宣布旗下自动驾驶部门,升级为独立公司,专注于自动驾驶研发.产品应用及相关业务拓展. ...

[技美CG]Unity3D复刻UnityShader 之 ShaderToy - Bubbles

Unity3D复刻UnityShader 之 ShaderToy - Bubbles

背景:

官方地址/参考资料:

ShaderToy-Bubbles原始代码:

Unity复刻开始

核心显示类:

核心unity shader:

复刻结束,展示效果:

ShaderToy-Bubbles效果:

Unity-Bubbles效果

github完整项目地址:

[技美CG]Unity3D复刻UnityShader 之 ShaderToy - Bubbles相关推荐

最新文章

热门文章