本日はShader学習枠です。
〇SpatialScanShaderとは?
SpatialScanShaderは筆者オリジナルのHoloLens向けシェーダーです。(もちろんVRでも使えます。)
HoloLensシリーズではSpatialAwareness(空間認識)によって周囲の環境を認識し、メッシュを貼ることができます。このメッシュをSpatialMesyと呼びます。
MRTKでは2021年1月現在(MRTK v2.53)次のようなSpatialMesh用のShaderが提供されています。
〇Oclussion
透明なマテリアルを作成するShaderです。
SpatialMeshは場合によってユーザー体験の質を落とすことにもつながるので必要がない場面ではこのOclussionShaderを使用する場面が多いです。
〇Wireframe
SpatialMeshのポリゴンの輪郭を浮かび上がらせるShaderです。
〇PulshShader
SpatialMeshのポリゴン単位でパルスが流れる表現が行えるShaderです。
これらMRTKで提供されているShaderはSpatialMeshのポリゴンを基準として表現を行っています。
今回はポリゴン基準ではなく、滑らかにパルスが走る表現を目的としてオリジナルShaderを開発しました。
このSpatialScanShaderではMRTKのWireframeSahaderをベースにMRTKStandardShaderのTriplanarShaderを応用してTextureを扱えるようにしています。
今回はこのShaderをさらに改造します。
〇リング数を増やす。
今回はリングの数を増やして二重のリングを放つShaderを作成します。
まずはSpatialScanShaderのおさらいをします。
このShaderではピクセルごとの色を処理するフラグメントシェーダーで重要な処理を行っています。
float4 frag(v2f i ):COLOR{ float radius; #if _AUTO_WAVE_ON float speed = 1/_Speed; radius =_WaveSize*(_Time/speed - floor(_Time/speed+1/2)); #else radius = _Radius; #endif float dist = distance(_Center, i.worldPos); float Isize =_LineSize +_InnerSize; float intensity =1/_MasterIntensity ; float val = 1 - step(dist, radius - _LineSize) * _Inner; val = lerp(radius - Isize, dist,radius - 3) * step(dist, radius) * val/intensity; return fixed4(val * _Color.r, val * _Color.g,val * _Color.b, 1.0); }
float val = 1 - step(dist, radius - _LineSize) * _Inner;
上記の処理で円の内側を塗りつぶさないように処理をしています。
val = lerp(radius - Isize, dist,radius - 3) * step(dist, radius) * val/intensity;
上記の画像の状態でさらにリングの余計な部分を塗りつぶさないように処理をします。
この二つの処理で残された領域が描画の対象になります。
この領域が時間とともにノコギリ波で周期的に広がることでScanの表現(パルス)を行っています。
つまり二重のリングにするためには
float val = 1 - step(dist, radius - _LineSize) * _Inner;
によって内側の領域がクリッピング(塗りつぶししない処理)される際にもう一つのリングを作成すればよいことになります。
次のように書いてみました
//全体のリング内部 float ring1 =step(dist, radius - Isize) * _Inner; //第二リング float ring2= step(dist, radius*0.5 - Isize*0.5)*_Inner; float inring2 =lerp(radius*0.5-Isize*0.5,dist,radius*0.5 -3)*step(dist,radius*0.5)*(1-ring2)/intensity; float rings =ring1-inring2;
変更点は二つ目のリングとして一つ目の円から半分の大きさの円を作成します。
//第一リング内部 float ring1 =step(dist, radius - Isize) * _Inner; //第二リング float ring2= step(dist, radius*0.5 - Isize*0.5)*_Inner; // float inring2 =lerp(radius*0.5-Isize*0.5,dist,radius*0.5 -3)*step(dist,radius*0.5)*(1-ring2)/intensity; float rings =ring1-ring2; float val = 1-rings; // val = lerp(radius - Isize, dist,radius - 3) * step(dist, radius) * val/intensity; return fixed4(clamp(0,1,val*val) * albedo.r,clamp(0,1,val*val) * albedo.g,clamp(0,1,val*val)* albedo.b, 1.0);
先に内側のリングを作成します。
//第一リング内部 float ring1 =step(dist, radius - Isize) * _Inner; //第二リング float ring2= step(dist, radius*0.5 - Isize*0.5)*_Inner; float inring2 =lerp(radius*0.5-Isize*0.5,dist,radius*0.5 -3)*step(dist,radius*0.5)*(1-ring2)/intensity; float rings =ring1-ring2; float val = 1-rings; // val = lerp(radius - Isize, dist,radius - 3) * step(dist, radius) * val/intensity; return fixed4(clamp(0,1,val*val) * albedo.r,clamp(0,1,val*val) * albedo.g,clamp(0,1,val*val)* albedo.b, 1.0);
次に第一リングの外側の領域を描画しないように処理します。
//第一リング内部 float ring1 =step(dist, radius - Isize) * _Inner; //第二リング float ring2= step(dist, radius*0.5 - Isize*0.5)*_Inner; float inring2 =lerp(radius*0.5-Isize*0.5,dist,radius*0.5 -3)*step(dist,radius*0.5)*(1-ring2)/intensity; float rings =ring1-inring2; float val = 1-rings; val = lerp(radius - Isize, dist,radius - 3) * step(dist, radius) * val/intensity; return fixed4(clamp(0,1,val*val) * albedo.r,clamp(0,1,val*val) * albedo.g,clamp(0,1,val*val)* albedo.b, 1.0);
以上で二重リングのSpatialScanShaderが完成しました。
実機で動かすと次のようになります。
〇コード全文
///Made by HoloMoto Shader "HoloMoto/SpatialScenerDoubleRings" { Properties { _MainTex("Texutre",2D)="white"{} _Color ("Color", Color) = (1, 1, 1, 1) _Center ("CenterX", vector) = (0, 0, 0) [Toggle] _Auto_Wave("AutoWave", Float) = 0 _WaveSize("MaxWaveSize",Float)=10 _Speed("WaveSpeed",float)=1 _Radius ("Radius", float) = 5 _LineSize("LineSize",Range(0,1))=0.075 _Inner("InnerIntensity",Range(0,1))=0.806 _InnerSize("InnerSize",Range(0,200))=0.14 _MasterIntensity("MasterIntensity",Range(0,10))=0.2 } SubShader { Tags{"RenderType"="Opaque"} Blend SrcAlpha OneMinusSrcAlpha BlendOp Add ZTest LEqual ZWrite On Cull Back Pass{ CGPROGRAM #pragma vertex vert #pragma fragment frag #pragma shader_feature _AUTO_WAVE_ON #include "UnityCG.cginc" float4 _Color; float3 _Center; float _Radius; float _LineSize; float _Inner; float _InnerSize; float _MasterIntensity; sampler2D _MainTex; fixed4 _MainTex_ST; struct appdata_t { float4 vertex :POSITION; float2 uv :TEXCOORD0; fixed3 normal :NORMAL; }; struct v2f { float2 uv :TEXCOORD0; float4 pos : SV_POSITION; float4 worldPos : TEXCOORD1; //Triplanaer Mapping fixed3 worldNormal:COLOR3; fixed3 triplanaerNormal : COLOR4; fixed4 triplanaerPosition : TEXCOORD6; UNITY_VERTEX_OUTPUT_STEREO }; v2f vert(appdata_t v) { v2f o; UNITY_SETUP_INSTANCE_ID(v); UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(0); o.pos = UnityObjectToClipPos(v.vertex); o.worldPos = mul(unity_ObjectToWorld, v.vertex).xyzw; fixed3 localNormal = v.normal; fixed3 worldNormal = UnityObjectToWorldNormal(localNormal); o.triplanaerPosition = o.worldPos; o.uv =TRANSFORM_TEX(v.uv,_MainTex); o.worldNormal = worldNormal; o.triplanaerNormal = worldNormal; o.triplanaerPosition = o.worldPos; return o; } float _Speed; float _Test; float _WaveSize; float4 frag(v2f i ,fixed faceing :VFACE):COLOR{ float radius; #if _AUTO_WAVE_ON float speed = 1/_Speed; radius =_WaveSize*(_Time/speed - floor(_Time/speed+1/2)); #else radius = _Radius; #endif //TriplanaerSettings fixed3 triplanarBlend = pow(abs(i.triplanaerNormal),1); triplanarBlend/=dot(triplanarBlend,fixed3(1,1,1)); float2 uvX = i.triplanaerPosition.zy * _MainTex_ST.xy+_MainTex_ST.zw; float2 uvY = i.triplanaerPosition.xz * _MainTex_ST.xy+_MainTex_ST.zw; float2 uvZ = i.triplanaerPosition.xy *_MainTex_ST.xy+_MainTex_ST.zw; float3 axisSign = i.triplanaerNormal <0? -1 : 1; uvX*=axisSign.x; uvY*=axisSign.y; uvZ*=axisSign.z; fixed4 albedo = tex2D(_MainTex,uvX)*triplanarBlend.x + tex2D(_MainTex,uvY)* triplanarBlend.y+tex2D(_MainTex,uvZ)*triplanarBlend.z; //TriplanaerSettingsEnd. albedo *= _Color; float dist = distance(_Center, i.worldPos); float Isize =_LineSize +_InnerSize; float intensity =1/_MasterIntensity ; //第一リング内部 float ring1 =step(dist, radius - Isize) * _Inner; //第二リング float ring2= step(dist, radius*0.5 - Isize*0.5)*_Inner; float inring2 =lerp(radius*0.5-Isize*0.5,dist,radius*0.5 -3)*step(dist,radius*0.5)*(1-ring2)/intensity; float rings =ring1-inring2; float val = 1-rings; val = lerp(radius - Isize, dist,radius - 3) * step(dist, radius) * val/intensity; return fixed4(clamp(0,1,val*val) * albedo.r,clamp(0,1,val*val) * albedo.g,clamp(0,1,val*val)* albedo.b, 1.0); } ENDCG } } FallBack "Diffuse" FallBack "Mixed Reality Toolkit/Standard" }