Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit b150a40

Browse files
author
Adam Leung
committed
Part 6 Complete
1 parent e75fa27 commit b150a40

File tree

5 files changed

+112
-0
lines changed

5 files changed

+112
-0
lines changed

‎Assets/Shaders/Tutorial_Shader.shader

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,9 @@
22
Properties {
33
_Colour ("Colour", Color) = (1, 1, 1, 1)
44
_MainTexture ("Main Texture", 2D) = "white" {}
5+
_DissolveTexture ("Dissolve Texture", 2D) = "white" {}
6+
_DissolveCutoff ("Dissolve Cutoff", Range(0, 1)) = 1
7+
_ExtrudeAmount ("Extrue Amount", float) = 0
58
}
69

710
SubShader {
@@ -15,6 +18,7 @@
1518
struct appdata {
1619
float4 vertex : POSITION;
1720
float2 uv : TEXCOORD0;
21+
float3 normal : NORMAL;
1822
};
1923

2024
struct v2f {
@@ -24,16 +28,22 @@
2428

2529
float4 _Colour;
2630
sampler2D _MainTexture;
31+
sampler2D _DissolveTexture;
32+
float _DissolveCutoff;
33+
float _ExtrudeAmount;
2734

2835
v2f vertexFunction (appdata IN) {
2936
v2f OUT;
37+
IN.vertex.xyz += IN.normal.xyz * _ExtrudeAmount * sin(_Time.y);
3038
OUT.position = UnityObjectToClipPos(IN.vertex);
3139
OUT.uv = IN.uv;
3240
return OUT;
3341
}
3442

3543
fixed4 fragmentFunction (v2f IN) : SV_TARGET {
3644
float4 textureColour = tex2D(_MainTexture, IN.uv);
45+
float4 dissolveColour = tex2D(_DissolveTexture, IN.uv);
46+
clip(dissolveColour.rgb - _DissolveCutoff);
3747
return textureColour;
3848
}
3949
ENDCG

‎Images/Playing_With_Shaders_1.gif

320 KB
Loading[フレーム]

‎Images/Playing_With_Shaders_2.gif

880 KB
Loading[フレーム]

‎Images/Playing_With_Shaders_3.gif

1.47 MB
Loading[フレーム]

‎README.md

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -431,3 +431,105 @@ __Note: We can change how Textures in Unity are sampled by going back to the tex
431431

432432
## Part 6: Playing With Shaders
433433

434+
So now that we know the basics, we can start having some fun with shaders and achieve some simple effects. First, we're going to use our noise texture and achieve a sort of "dissolve" or "cutout" effect. We'll start by adding another texture property and a float property:
435+
```
436+
Properties {
437+
_Colour ("Colour", Color) = (1, 1, 1, 1)
438+
_MainTexture ("Main Texture", 2D) = "white" {}
439+
_DissolveTexture ("Dissolve Texture", 2D) = "white" {}
440+
_DissolveCutoff ("Dissolve Cutoff", Range(0, 1)) = 1
441+
}
442+
```
443+
Notice how we've set _DissolveCutoff to be a Range from (0, 1). This represents a float value from 0 to 1 (inclusive) and this notation also allows us to easily set it's value using a slider. Now let's add them to our CGPROGRAM:
444+
```
445+
float4 _Colour;
446+
sampler2D _MainTexture;
447+
sampler2D _DissolveTexture;
448+
float _DissolveCutoff;
449+
```
450+
Now we can sample the dissolve texture in our fragment function:
451+
```
452+
fixed4 fragmentFunction (v2f IN) : SV_TARGET {
453+
float4 textureColour = tex2D(_MainTexture, IN.uv);
454+
float4 dissolveColour = tex2D(_Dissolve)
455+
return textureColour;
456+
}
457+
```
458+
Notice we're still using the same UV coordinates as our main texture. Now here's where the magic happens:
459+
```
460+
fixed4 fragmentFunction (v2f IN) : SV_TARGET {
461+
float4 textureColour = tex2D(_MainTexture, IN.uv);
462+
float4 dissolveColour = tex2D(_DissolveTexture, IN.uv);
463+
clip(dissolveColour.rgb - _DissolveCutoff);
464+
return textureColour;
465+
}
466+
```
467+
The *clip* function works by checking if the value given is less than 0. If it is, then we discard the pixel and draw nothing. If it isn't we keep the pixel and continue as normal. The way our code currently works is:
468+
469+
1. We sample the main texture for colour.
470+
2. We sample the cutout texture for it's colour.
471+
3. We subtract the cutoff value from the "brightness" of our cutoff sample, and...
472+
4. If it's less than 0, we draw nothing
473+
5. Otherwise, return the main texture sample colour.
474+
475+
Now, save your shader and return to Unity. Set the "Dissolve Texture" to our noise texture, and start moving the "Dissolve Cutoff" slider, you should see an effect like this:
476+
477+
![Playing With Shaders 1](./Images/Playing_With_Shaders_1.gif)
478+
479+
Pretty cool huh? We can do more too. Let's try playing with the vertices before we pass them to our fragment function. Let's expose another property:
480+
481+
```
482+
Properties {
483+
_Colour ("Colour", Color) = (1, 1, 1, 1)
484+
_MainTexture ("Main Texture", 2D) = "white" {}
485+
_DissolveTexture ("Dissolve Texture", 2D) = "white" {}
486+
_DissolveCutoff ("Dissolve Cutoff", Range(0, 1)) = 1
487+
_ExtrudeAmount ("Extrue Amount", float) = 0
488+
}
489+
490+
...
491+
492+
float4 _Colour;
493+
sampler2D _MainTexture;
494+
sampler2D _DissolveTexture;
495+
float _DissolveCutoff;
496+
float _ExtrudeAmount;
497+
```
498+
We're also going to using normals from the model, so lets add the field into the appdata struct so we can access them:
499+
```
500+
struct appdata {
501+
float4 vertex : POSITION;
502+
float2 uv : TEXCOORD0;
503+
float3 normal : NORMAL;
504+
};
505+
```
506+
Now let's add a single line to our vertex function:
507+
```
508+
v2f vertexFunction (appdata IN) {
509+
v2f OUT;
510+
IN.vertex.xyz += IN.normal.xyz * _ExtrudeAmount;
511+
OUT.position = UnityObjectToClipPos(IN.vertex);
512+
OUT.uv = IN.uv;
513+
return OUT;
514+
}
515+
```
516+
What we're doing here is, before we transform our vertices out of local model space, we're going to offset them a certain amount outwards by adding their normal direction times our _ExtrudeAmount. A normal is just a vector that represents the direction that the vertex is facing. Now if you save and return to Unity and play with the "Extrude Amount" value, you should see an effect like this:
517+
518+
![Playing With Shaders 2](./Images/Playing_With_Shaders_2.gif)
519+
520+
We can even animate these properties:
521+
522+
```
523+
v2f vertexFunction (appdata IN) {
524+
v2f OUT;
525+
IN.vertex.xyz += IN.normal.xyz * _ExtrudeAmount * sin(_Time.y);
526+
OUT.position = UnityObjectToClipPos(IN.vertex);
527+
OUT.uv = IN.uv;
528+
return OUT;
529+
}
530+
```
531+
*_Time* is a variable included in *UnityCG.cginc* that represents the time, with the y value representing seconds.
532+
Make sure "Animated Materials" is checked on in the scene view in order to preview this effect in the editor:
533+
534+
![Playing With Shaders 3](./Images/Playing_With_Shaders_3.gif)
535+

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /