Hello Guest

Author Topic: Shader Question  (Read 8598 times)

JamesZhan

  • Newbie
  • *
  • Posts: 5
    • View Profile
Shader Question
« on: May 21, 2014, 10:51:21 am »
hi, guys, where I can find out a heat distortion transparent shader for 2dtk sprite ?
Thanks.

wagenheimer

  • 2D Toolkit
  • Jr. Member
  • *
  • Posts: 50
    • View Profile
Re: Shader Question
« Reply #1 on: May 21, 2014, 08:37:40 pm »
Hi! Good Question! =)

Today I was doing research on this, but unfortunately have not found anything. I want to achieve an effect like the FireCracker explosion on this Video : http://youtu.be/78DQGgMNzJw?t=4m7s

It's an explosion effect which distorts the background! I think what you want is similar to this!

I will post here if I find something, please if you find something, keep me informed! =)
« Last Edit: May 21, 2014, 08:42:31 pm by wagenheimer »

unikronsoftware

  • Administrator
  • Hero Member
  • *****
  • Posts: 9709
    • View Profile
Re: Shader Question
« Reply #2 on: May 22, 2014, 09:09:24 am »
http://answers.unity3d.com/questions/478462/distortion-effect-on-particles.html

You will need a custom shader which creates the and animates the ripple, but once you do that, the distortion effect itself is fairly straightforward, you can rip it straight out of the "Glass Refraction" package which comes with unity.

JamesZhan

  • Newbie
  • *
  • Posts: 5
    • View Profile
Re: Shader Question
« Reply #3 on: May 23, 2014, 03:54:41 am »
Thanks for your help.

I have solved it,  found a twist shader for my project though there's still some issues.

Now I have another problem, does 2dtk has some fucntion to split some sprites from a png file like the unity3d 2d sprite editor does? My atlas is from a old project and I cant find any config file.

unikronsoftware

  • Administrator
  • Hero Member
  • *****
  • Posts: 9709
    • View Profile
Re: Shader Question
« Reply #4 on: May 23, 2014, 01:53:53 pm »
No it doesn't, unless your sprites in the png are arranged in a grid.
http://2dtoolkit.com/docs/latest/tutorial/importing_a_spritesheet.html

wagenheimer

  • 2D Toolkit
  • Jr. Member
  • *
  • Posts: 50
    • View Profile
Re: Shader Question
« Reply #5 on: May 23, 2014, 03:02:56 pm »
I was able to create some similar effect using this shader, https://www.assembla.com/code/devworld-unity/subversion/nodes/113/trunk/NovusDawn_UnityProject/Assets/Xffect/Shaders/xf_heat_distortion.shader

But it is not mobily friendly, I got very low framerates on Android and iOS when Using It!

Would you mind to share your shader to I test it?

JamesZhan

  • Newbie
  • *
  • Posts: 5
    • View Profile
Re: Shader Question
« Reply #6 on: May 28, 2014, 03:51:44 am »
Of course, I know nothing about shader but I like to try, I paste two shaders  together and you can see the code blow, and I make a animation to tween those parameters to make that twice effect, only test in pc. hope that work for you.



Shader "james/BlendTwist"
{
   Properties {
      _Background ("Background", 2D) = "" {}         //Receive input from a Texture on Texture Unit 0
      _BackgroundScrollX ("X Offset", float) = 0      //Receive input from float
      _BackgroundScrollY ("Y Offset", float) = 0      //Receive input from float
      _BackgroundScaleX ("X Scale", float) = 1.0      //Receive input from float
      _BackgroundScaleY ("Y Scale", float) = 1.0      //Receive input from float
      _Refraction ("Refraction", float) = 0.0001      //Receive input from float
      _DistortionMap ("Distortion Map", 2D) = "" {}   //Receive input from a Texture on Texture Unit 1
      _DistortionScrollX ("X Offset", float) = 0      //Receive input from float
      _DistortionScrollY ("Y Offset", float) = 0      //Receive input from float
      _DistortionScaleX ("X Scale", float) = 1.0      //Receive input from float
      _DistortionScaleY ("Y Scale", float) = 1.0      //Receive input from float
      _DistortionPower("Distortion Power", float) = 0.08   //Receive input from float      
   }

   //Define a shader
   SubShader {

      //Define what queue/order to render this shader in
      Tags {"Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent"}      //Background | Geometry | AlphaTest | Transparent | Overlay - Render this shader as part of the geometry queue because it does not use blending

      //Define a pass
      Pass {

         Tags {"Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent"}
         ZWrite Off Lighting Off Cull Off Fog { Mode Off } Blend SrcAlpha OneMinusSrcAlpha
         LOD 110

         CGPROGRAM                  //Start a program in the CG language
         #pragma target 2.0            //Run this shader on at least Shader Model 2.0 hardware (e.g. Direct3D 9)
         #pragma fragment frag         //The fragment shader is named 'frag'
         #pragma vertex vert            //The vertex shader is named 'vert'
         #include "UnityCG.cginc"      //Include Unity's predefined inputs and macros

         //Unity variables to be made accessible to Vertex and/or Fragment shader
         uniform sampler2D _Background;               //Define _Background from Texture Unit 0 to be sampled in 2D
         //uniform float4 _Background_ST;            //Use the Float _Background_ST to pass the Offset and Tiling for the texture(s)
         uniform sampler2D _DistortionMap;            //Define _DistortionMap from Texture Unit 1 to be sampled in 2D
         //uniform float4 _DistortionMap_ST;            //Use the Float _DistortionMap_ST to pass the Offset and Tiling for the texture(s)
         uniform sampler2D _DistortionMap2;            //Define _DistortionMap2 from Texture Unit 2 to be sampled in 2D
         //uniform float4 _DistortionMap2_ST;         //Use the Float _DistortionMap2_ST to pass the Offset and Tiling for the texture(s)
         uniform float _BackgroundScrollX;
         uniform float _BackgroundScrollY;
         uniform float _DistortionScrollX;
         uniform float _DistortionScrollY;
         uniform float _DistortionPower;
         uniform float _BackgroundScaleX;
         uniform float _BackgroundScaleY;
         uniform float _DistortionScaleX;
         uniform float _DistortionScaleY;
         uniform float _DistortionScrollX2;
         uniform float _DistortionScrollY2;
         uniform float _DistortionPower2;
         uniform float _DistortionScaleX2;
         uniform float _DistortionScaleY2;
         uniform float _Refraction;
                  
         //Data structure communication from Unity to the vertex shader
         //Defines what inputs the vertex shader accepts
         struct AppData {
            float4 vertex : POSITION;               //Receive vertex position
            half2 texcoord : TEXCOORD0;               //Receive texture coordinates
                     //half2 texcoord1 : TEXCOORD1;            //Receive texture coordinates
                     //fixed4 color : COLOR;                  //Receive vertex colors
         };

         //Data structure for communication from vertex shader to fragment shader
         //Defines what inputs the fragment shader accepts
         struct VertexToFragment {
            float4 pos : POSITION;                  //Send fragment position to fragment shader
            half2 uv : TEXCOORD0;                  //Send interpolated texture coordinate to fragment shader
                     //half2 uv2 : TEXCOORD1;               //Send interpolated texture coordinate to fragment shader
                     //fixed4 color : COLOR;                  //Send interpolated gouraud-shaded vertex color to fragment shader
         };

         //Vertex shader
         VertexToFragment vert(AppData v) {
            VertexToFragment o;                     //Create a data structure to pass to fragment shader
            o.pos = mul(UNITY_MATRIX_MVP,v.vertex);      //Include influence of Modelview + Projection matrices
            o.uv = v.texcoord.xy;      //Send texture coords from unit 0 to fragment shader
            return o;                           //Transmit data to the fragment shader
         }

         //Fragment shader
         fixed4 frag(VertexToFragment i) : COLOR {
            fixed2 distortion = tex2D(_DistortionMap, float2(_DistortionScaleX,_DistortionScaleY)*i.uv+float2(_DistortionScrollX,_DistortionScrollY).xy) * _DistortionPower - (_DistortionPower*0.5);   //Get distortion map, Red=X, Green=Y
             return tex2D(_Background, float2(_BackgroundScaleX,_BackgroundScaleY)*i.uv+(_Refraction*(distortion))+float2(_BackgroundScrollX,_BackgroundScrollY));   //Get the background
         }

         ENDCG                     //End of CG program

      }
   }
}


 

JamesZhan

  • Newbie
  • *
  • Posts: 5
    • View Profile
Re: Shader Question
« Reply #7 on: May 28, 2014, 04:06:30 am »
@unikronsoftware

My team has couple guys and we plant to work with different modules, after we done something, we export and import the package to the main project, today we found the atlas color is not right, that color is more like 16bit rgb, but I have set the Compression of spriteCollection to UNCOMPRESSED.

Any ideas?

unikronsoftware

  • Administrator
  • Hero Member
  • *****
  • Posts: 9709
    • View Profile
Re: Shader Question
« Reply #8 on: May 28, 2014, 11:15:08 am »
Are you in the iOS build platform?

wagenheimer

  • 2D Toolkit
  • Jr. Member
  • *
  • Posts: 50
    • View Profile
Re: Shader Question
« Reply #9 on: May 28, 2014, 02:04:07 pm »
Hi JamesZhan!

Thanks for the Shader Code! But unfortunately I was not able to make a nice looking effect with it... Maybe I'm using the wrong textures. Did you have an example scene where are you using it?

Thanks!

JamesZhan

  • Newbie
  • *
  • Posts: 5
    • View Profile
Re: Shader Question
« Reply #10 on: May 29, 2014, 11:36:05 am »
@unikronsoftware, no, in pc. It's very strange, and it's ok if I export the other package to the 2dtk project.

@wagenheimer, I dont know how to upload files here, pls give me your email and I'll send that texture to you.
« Last Edit: May 29, 2014, 11:40:19 am by JamesZhan »

wagenheimer

  • 2D Toolkit
  • Jr. Member
  • *
  • Posts: 50
    • View Profile
Re: Shader Question
« Reply #11 on: May 29, 2014, 02:54:41 pm »
Hi!

My email is wagenheimer@gmail.com!

Much better with your texture thanks!

But what Kind of texture I need to use with Background?