UV animation/texture blending/Normal map/process textures

Let vs support shaderlab syntax

VS2013 there is no shaderlab syntax highlighting, fortunately there is a plugin to support syntax highlighting and spelling hints, from here to download the plugin, double-click the installation is good.

Shaderlabvs-https://github.com/wudixiaop/shaderlabvs/releases

However, due to the relationship between the VS color, you need to fine-tune, follow the steps below

1. Open the fonts and colors, environment, tools------
2. Display its settings drop-down list and select text Editor (this is the default if not changed).
3. In the list box below the display item (D) text, select the item that begins with "shaderlab-", and then change the foreground color
4. When you're done, make sure.

Subshader and Pass

A shader has multiple subshader. A subshader can be understood as a rendering scheme for a shader. That is, Subshader is written for different graphics cards. Each shader at least 1 Subshader, theory can be infinitely many, but often two or three is enough.
The compatibility of Subshader and graphics cards is determined by the Subshader label, pass label, and "Unity Render path" supported by the graphics card. The video card automatically chooses a subshader that best suits its performance.

In a subshader we can define multiple passes, and pass differs from Subshader, and each pass you write is executed in the order. We're going to write a specific shader code in the pass, and one more thing to mention, It is not possible to write a pass in Unity's surface shader, because in Unity's lighting model He will automatically define some passes, so you will no longer be allowed to write extra.

UV Animations

UV animation is to change the texture of the UV coordinates to achieve the movement of the texture, often used in water, magma and other simulations, can also reach a good simulation effect, the key performance consumption is very low.

The following is an example of a water flow simulation.

Create the material, shader as follows,

Shader "Custom/scrollshader" {Properties {_maintint ("Diffuse color", color) = (1,1,1,1) _maintex ("Base (RGB)", 2D) = "whit E "{}_scrollxspeed (" X Scroll Speed ", range (0, ten)) = 2_scrollyspeed (" Y Scroll Speed ", range (0, ten)) = 2}subshader {Tags {"Rendertype" = "Opaque"} LOD 200cgprogram#pragma Surface Surf lambertsampler2d _maintex;fixed4 _maintint;fixed _scrollxspeed;fixed _ Scrollyspeed;struct Input {float2 uv_maintex;}; void Surf (Input in, InOut surfaceoutput o) {fixed2 Scrolleduv = in.uv_maintex;fixed Xscrollvalue = _scrollxspeed * _time; Fixed yscrollvalue = _scrollyspeed * _time;scrolleduv + = Fixed2 (Xscrollvalue, yscrollvalue); Half4 C = tex2d (_maintex, SCR OLLEDUV); O. Albedo = C.rgb * _maintint;o. Alpha = C.A;} ENDCG} FallBack "Diffuse"}

Drag the corresponding texture onto the shader and the final effect is as follows:

Texture Blending

Texture blending is often used for terrain textures. If there is no fusion, just use a map of the grass to draw, the terrain is this:

By blending multiple textures, the result is this:

The principle is also very simple, first of all to prepare a number of texture mapping, such as grassland, gravel, land, and then use an index map of the RGBA value to index the fusion scale value.

As shown, four textures are used here, and the last Blendtexture is the scale used for index blending. When editing, you can change the texture of the terrain by simply modifying the blendtexuture.

The shader code is as follows

Shader "Custom/terrain" {Properties {_maintint ("Diffuse color", color) = (1,1,1,1) _colora ("Terrain Color A", Color) = (1, 1,1,1) _colorb ("Terrain Color B", color) = (1,1,1,1) _rtexture ("Red Channel Texture", 2D) = "" {}_gtexture ("Green Channel Texture ", 2D) =" "{}_btexture (" Blue channel Texture ", 2D) =" "" {}_atexture ("Alpha Channel Texture", 2D) = "" "{}_blendtextu Re ("Blend Texture", 2D) = "" {}}subshader {Tags {"rendertype" = "Opaque"}lod 200cgprogram#pragma surface Surf Lambertfloa T4 _maintint;float4 _colora;float4 _colorb;sampler2d _rtexture;sampler2d _gtexture;sampler2d _BTexture;sampler2D _ Atexture;sampler2d _blendtexture;struct Input {float2 uv_rtexture;float2 uv_gtexture;float2 uv_btexture;float2 uv_ Atexture;float2 uv_blendtexture;};  void Surf (Input in, InOut surfaceoutput o) {float4 blenddata = tex2d (_blendtexture, in.uv_blendtexture); Float4 rtexdata = Tex2d (_rtexture, in.uv_rtexture); Float4 gtexdata = tex2d (_gtexture, in.uv_gtexture); Float4 btexdata = tex2d (_BTexture, In.uv_btexture); Float4 atexdata = tex2d (_atexture, in.uv_atexture); Float4 Finalcolor;finalcolor = Lerp (Rtexdata, GTexData, BLENDDATA.G); Finalcolor = Lerp (Finalcolor, Btexdata, blenddata.b); finalcolor = Lerp (Finalcolor, ATexData, BLENDDATA.A) ; finalcolor.a = 1.0;float4 terrainlayers = Lerp (_colora, _colorb, BLENDDATA.R); Finalcolor *= TerrainLayers;finalColor = s Aturate (Finalcolor); O. Albedo = Finalcolor.rgb * _maintint.rgb;o. Alpha = FINALCOLOR.A;} ENDCG} FallBack "Diffuse"}

Normal map

In a nutshell, it is to increase the detail of the model by changing the surface normals in the model of the low polygon number. Take a look at the diagram below to see it.

With Unity's own Builidin shader, the entire computational process has become very simple.

Remember to make sure that the type of the corresponding normal map is set to normal Texture.

Shader code

Shader "Custom/normalmap" {Properties {_maintint ("Diffuse Tint", Color) = (1,1,1,1) _maintex ("Base (RGB)", 2D) = "White" { }_normaltex ("normal map", 2D) = "Bump" {}_normalintensity ("normal map Intensity", Range (0,2)) = 1}subshader {Tags {"Render Type "=" Opaque "}lod 200cgprogram#pragma surface Surf lambertsampler2d _maintex;sampler2d _normaltex;float _ Normalintensity;float4 _maintint;struct Input {float2 uv_maintex;float2 uv_normaltex;}; void Surf (Input in, InOut surfaceoutput o) {float3 Normalmap = Unpacknormal (tex2d (_normaltex, In.uv_normaltex)); Float4 te Xcolor = tex2d (_maintex, In.uv_maintex); normalmap = Normalize (FLOAT3 (normalmap.x * _normalintensity, Normalmap.y * _ Normalintensity, normalmap.z)); O. Normal = Normalmap.rgb;o. Albedo = Texcolor.rgb * _maintint.rgb;o. Alpha = TEXCOLOR.A;} ENDCG} FallBack "Diffuse"}

Final effect

Process Textures

Process textures are generated from code textures that are often used to create natural elements such as wood, marble, granite, metal, stone, etc. In general, the natural appearance of the resulting results is achieved by the use of fractal noise and turbulence functions, such as the following wood grain ball

The idea in unity is simply to create a Texture2d object, then calculate the value of each pixel and finally assign it to the material. The core drawing method is as follows

Texture2d Generateparabola () {texture2d procedualtexture = new Texture2d (widthheight, widthheight); Vector2 centerpixelposition = centerposition * widthheight;for (int x = 0; x < widthheight; + +) for (int y = 0; y < Widthheight; y++) {Vector2 currentposition = new Vector2 (x, y);//debug.log ("+ currentposition +" + centerpixelposition); float Pixeld istance = Vector2.distance (currentposition, centerpixelposition)/(widthheight*0.5f);//debug.log ("PixelDistance1" + pixeldistance);p ixeldistance = Mathf.abs (1-mathf.clamp (Pixeldistance, 0f, 1f)); Color Pixelcolor = new Color (pixeldistance, pixeldistance, Pixeldistance, 1.0f);p rocedualtexture.setpixel (x, Y, Pixelcolor);} Procedualtexture.apply (); return procedualtexture;}

This is a simple build, and the resulting texture is like this.

Revise it slightly to change the pixeldistence calculation to

Pixeldistance = (Mathf.sin (pixeldistance * 30.0f) * pixeldistance);

The textures that can be generated are as follows

and finally change it.

Vector2 pixeldirection = Centerpixelposition-currentposition;pixeldirection.normalize (); Float rightdirection = Vector2.angle (pixeldirection, vector3.right)/360;float leftdirection = Vector2.angle (pixelDirection, Vector3.left)/ 360;float updirection = Vector2.angle (pixeldirection, vector3.up)/360; Color Pixelcolor = new Color (rightdirection, leftdirection, Updirection, 1.0f);

The resulting textures are as follows

Use the following code to dump the resulting texture.

var bytes = Generatedtexture.encodetopng (); File.writeallbytes (Application.datapath + "/... /savedscreen.png ", bytes);

Reference

Normal Map-Http://zh.wikipedia.org/wiki/%E6%B3%95%E7%BA%BF%E8%B4%B4%E5%9B%BE

Unity Shaders and Effects Cookbook

UV animation/texture blending/Normal map/process textures