Unity UI.Image 六边形+流光 Shader

效果图

参考代码

Shader"Custom/HexFlowImage"
{Properties{[PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {}_Color ("Tint", Color) = (1,1,1,1)_StencilComp ("Stencil Comparison", Float) = 8_Stencil ("Stencil ID", Float) = 0_StencilOp ("Stencil Operation", Float) = 0_StencilWriteMask ("Stencil Write Mask", Float) = 255_StencilReadMask ("Stencil Read Mask", Float) = 255_ColorMask ("Color Mask", Float) = 15/*六边形参数*/_HexLineSize("HexLineSize",Range(0.02,0.2)) = 0.05       //线条粗细_HexZoom("HexZoom",Range(5,50)) = 10                     //六边形缩放/*流光参数*/_Angle("Angle",Range(0,3.1415926))=0                     //坐标系旋转角度_LineStrength("LineStrength",Range(0.01,0.99))=0.1       //流光线条粗细_LineEdge("LineEdge",Range(0,0.1))=0.01                  //流光边界过度粗细_LineOffset("LineOffset",Range(0,1))=0.5                 //流光坐标偏移_LineSpeed("MoveSpeed",float) =1                         //流光移动速度_LineColor("Color",Color)=(1,1,1,1)                      //流光颜色[Toggle(UNITY_UI_ALPHACLIP)] _UseUIAlphaClip ("Use Alpha Clip", Float) = 0}SubShader{Tags{"Queue"="Transparent""IgnoreProjector"="True""RenderType"="Transparent""PreviewType"="Plane""CanUseSpriteAtlas"="True"}Stencil{Ref[_Stencil]Comp [_StencilComp]Pass [_StencilOp]ReadMask[_StencilReadMask]WriteMask [_StencilWriteMask]}Cull OffLighting OffZWrite OffZTest[unity_GUIZTestMode]Blend OneOneMinusSrcAlphaColorMask[_ColorMask]Pass{Name"Default"CGPROGRAM#pragma vertex vert#pragma fragment frag#pragma target 2.0#include "UnityCG.cginc"#include "UnityUI.cginc"#pragma multi_compile_local _ UNITY_UI_CLIP_RECT#pragma multi_compile_local _ UNITY_UI_ALPHACLIP#define aspec _ScreenParams.x/_ScreenParams.y                          /*屏幕长款比例*/                                   #define rot float2x2(cos(_Angle),sin(_Angle),-sin(_Angle),cos(_Angle)) /*旋转矩阵*/        struct appdata_t{float4 vertex : POSITION;float4 color : COLOR;float2 texcoord : TEXCOORD0;UNITY_VERTEX_INPUT_INSTANCE_ID};struct v2f{float4 vertex : SV_POSITION;fixed4 color : COLOR;float2 texcoord : TEXCOORD0;float4 worldPosition : TEXCOORD1;float4 mask : TEXCOORD2;float2 viewTexcoord : TEXTCOORD3;   //屏幕坐标UNITY_VERTEX_OUTPUT_STEREO};sampler2D _MainTex;fixed4 _Color;fixed4 _TextureSampleAdd;float4 _ClipRect;float4 _MainTex_ST;float _UIMaskSoftnessX;float _UIMaskSoftnessY;float _HexLineSize;float _HexZoom;float _Angle;float _LineStrength;float _LineEdge;float _LineOffset;float _LineSpeed;fixed4 _LineColor;float HexDist(fixed2 p){p = abs(p);float c = dot(p, normalize(fixed2(1, 1.73)));c = max(c, p.x);return c;}fixed4 HexCoords(fixed2 uv){const fixed2 r = fixed2(1, 1.73);const fixed2 h = r * .5;fixed2 a = fmod(uv, r) - h;fixed2 b = fmod(uv - h, r) - h;  fixed2 gv = dot(a, a) < dot(b, b) ? a : b;float x = atan2(gv.x, gv.y);float y = .5 - HexDist(gv);fixed2 id = uv - gv;return fixed4(x, y, id.x, id.y);}v2f vert(appdata_t v){v2f OUT;UNITY_SETUP_INSTANCE_ID(v);UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(OUT);float4 vPosition = UnityObjectToClipPos(v.vertex);OUT.worldPosition = v.vertex;OUT.vertex = vPosition;float2 pixelSize = vPosition.w;pixelSize /= float2(1, 1) * abs(mul((float2x2) UNITY_MATRIX_P, _ScreenParams.xy));float4 clampedRect = clamp(_ClipRect, -2e10, 2e10);float2 maskUV = (v.vertex.xy - clampedRect.xy) / (clampedRect.zw - clampedRect.xy);OUT.texcoord = TRANSFORM_TEX(v.texcoord.xy, _MainTex);OUT.mask = float4(v.vertex.xy * 2 - clampedRect.xy - clampedRect.zw, 0.25 / (0.25 * half2(_UIMaskSoftnessX, _UIMaskSoftnessY) + abs(pixelSize.xy)));OUT.color = v.color;//计算屏幕坐标fixed4 vpos = ComputeScreenPos(OUT.vertex);OUT.viewTexcoord = vpos.xy / vpos.w;OUT.viewTexcoord.x *= aspec;OUT.viewTexcoord += 0.5;return OUT;}fixed4 frag(v2f IN) : SV_Target{const half alphaPrecision = half(0xff);const half invAlphaPrecision = half(1.0 / alphaPrecision);IN.color.a = round(IN.color.a * alphaPrecision) * invAlphaPrecision;//获取屏幕坐标 计算六边形像素float2 uv1 = IN.viewTexcoord + float2(0, sin(IN.viewTexcoord.x * 5. + _Time.y) * 0.01);half4 hex = smoothstep(_HexLineSize, .0, HexCoords(uv1 * _HexZoom).y) * IN.color.a;//旋转屏幕坐标计算流光像素float2 uv2 =   mul(rot,IN.viewTexcoord.xy);uv2.x +=  _Time.y * _LineSpeed;uv2.x = frac(uv2.x);float d = smoothstep(_LineOffset,_LineOffset + _LineEdge,uv2.x) * smoothstep(_LineOffset + _LineStrength,_LineOffset + _LineStrength - _LineEdge,uv2.x);//通过lerp函数进行差值融合 再与原始图像进行叠加half4 color = lerp( IN.color * hex , hex  * _LineColor,d)+ tex2D(_MainTex, IN.texcoord);#ifdef UNITY_UI_CLIP_RECThalf2 m = saturate((_ClipRect.zw - _ClipRect.xy - abs(IN.mask.xy)) * IN.mask.zw);color.a *= m.x * m.y;
#endif#ifdef UNITY_UI_ALPHACLIPclip (color.a - 0.001);
#endifcolor.rgb *= color.a;return color;}ENDCG}}
}

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/62726.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

“一日之际在于晨”,欢迎莅临WAVE SUMMIT上午场:Arm 虚拟硬件早餐交流会

8月16日&#xff0c;盛夏的北京将迎来第九届WAVE SUMMIT深度学习开发者大会。在峰会主论坛正式开启前&#xff0c;让我们先用一份精美的元气早餐&#xff0c;和一场“Arm虚拟硬件交流会”&#xff0c;唤醒各位开发小伙伴的开发魂&#xff01; 8月16日&#xff0c;WAVE SUMMIT大…

简单入门seleniumUI自动化测试

目录 一、selenium的介绍 二、selenium的原理 三、selenium的八种元素定位的方法 1、ID定位&#xff1a; 2 、name定位&#xff1a; 3、class定位&#xff1a; 4、tag定位&#xff1a; 5、link_text定位&#xff1a; 6、partial_link_text定位&#xff1a; 7、css定位…

【uniapp】uniapp设置安全区域:

文章目录 一、效果图:二、实现代码: 一、效果图: 二、实现代码: {"path": "pages/index/index","style": {"navigationStyle": "custom","navigationBarTextStyle": "white","navigationBarTitle…

Mysql:Access denied for user ‘root‘@‘localhost‘ (using password:YES)解决方案

最近在配置Maven以及Mybatis时&#xff0c;连接localhost数据库时出现无法连接&#xff0c;用cmd测试时报错&#xff1a;Access denied for user ‘ODBC’‘localhost’ (using password: NO)&#xff0c;这个意思就是不允许远程访问&#xff0c;一开始笔者进入mysql试了一下是…

为什么金鸣识别不做成离线版?

来百度APP畅享高清图片 在众多的用户咨询中&#xff0c;金鸣识别客服常常会被用户问及为何不做成离线版的问题&#xff0c;下面我就在这里跟大伙说说其中的原因吧。 离线版的OCR准确率相对于网络版可能会较低&#xff0c;主要有以下几个原因&#xff1a; 1. 数据量和模型更新…

定制 ChatGPT 以满足您的需求 自定义说明

推荐&#xff1a;使用 NSDT场景编辑器 快速助你搭建可二次编辑的3D应用场景 20 月 <> 日&#xff0c;OpenAI 宣布他们正在引入带有自定义说明的新流程&#xff0c;以根据您的特定需求定制 ChatGPT。 什么是自定义说明&#xff1f; 新的测试版自定义指令功能旨在通过防止…

从数据仓库到数据结构:数据架构的演变之路

在上个世纪&#xff0c;从电子商务巨头到医疗服务机构和政府部门&#xff0c;数据已成为每家组织的生命线。有效地收集和管理这些数据可以为组织提供宝贵的洞察力&#xff0c;以帮助决策&#xff0c;然而这是一项艰巨的任务。 尽管数据很重要&#xff0c;但CIOinsight声称&…

C#--设计模式之单例模式

单例模式大概是所有设计模式中最简单的一种&#xff0c;如果在面试时被问及熟悉哪些设计模式&#xff0c;你可能第一个答的就是单例模式。 单例模式的实现分为两种&#xff1a; 饿汉式&#xff1a;在静态构造函数执行时就立即实例化。懒汉式&#xff1a;在程序执行过程中第一…

Cadence OrCAD Capture CIS批量替换GND符号的方法

🏡《总目录》   🏡《宝典目录》 目录 1,概述2,方法3,总结1,概述 如下图所示,有时由于绘图是从多个地方复制粘贴而来,一个图纸中会存在多种GND符号。此时比较容易引起GND网络名不同意的问题,为了避免该问题可对其批量替换。 2,方法 第1步:选择需要替换的GND符号…

个保新标 | 《信息安全技术 敏感个人信息处理安全要求》(征求意见稿)发布

8 月 9 日&#xff0c;全国信息安全标准化技术委员会公开发布关于国家标准《信息安全技术 敏感个人信息处理安全要求》&#xff08;征求意见稿&#xff09;&#xff08;以下简称《标准》&#xff09;的通知&#xff0c;面向社会广泛征求意见。 《标准》的制定背景是为支撑《个人…

服装行业多模态算法个性化产品定制方案 | 京东云技术团队

一、项目背景 AI赋能服装设计师&#xff0c;设计好看、好穿、好卖的服装 传统服装行业痛点 • 设计师无法准确捕捉市场趋势&#xff0c;抓住中国潮流 • 上新周期长&#xff0c;高库存滞销风险大 • 基本款居多&#xff0c;难以满足消费者个性化需求 解决方案 • GPT数据…

树莓派命令行运行调用音频文件的函数,不报错,没有声音解决办法

树莓派接上音频首先需要切换音频不是HDMI&#xff0c;然后可以双击运行wav文件可以播放&#xff0c;但是&#xff1a; 命令行直接运行wav文件报错&#xff1a; Playing WAVE twzc.wav : Signed 16 bit Little Endian, Rate 16000 Hz, Mono命令行运行main方法也是无法播放&am…