开启辅助访问
 找回密码
 注册帐号

扫一扫,访问微社区

开发者专栏

关注:1631

当前位置:游戏蛮牛 技术专区 开发者专栏

__________________________________________________________________________________
开发者干货区版块规则:

  1、文章必须是图文形式。(至少2幅图)
      2、文章字数必须保持在1500字节以上。(编辑器右下角有字数检查)
      3、本版块只支持在游戏蛮牛原创首发,不支持转载。
      4、本版块回复不得无意义,如:顶、呵呵、不错......【真的会扣分的哦】
      5、......
__________________________________________________________________________________
查看: 985|回复: 16

[海莉zhe] 【知识摘录】 Unity3D 实现六角形花纹效果[Shader](四)

[复制链接]  [移动端链接]
排名
1291
昨日变化
5

37

主题

158

帖子

1688

积分

Rank: 9Rank: 9Rank: 9

UID
76890
好友
26
蛮牛币
2375
威望
0
注册时间
2015-3-4
在线时间
579 小时
最后登录
2017-3-30

专栏作家

发表于 2017-1-4 01:05:57 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?注册帐号

x

    今天小编为大家分享一下,如何做一个六角形花纹效果的小Demo。
   
    好吧!废话不多讲,我直接上图操作!

    1.新建一个 项目,新建一个CameraFilterPack_AAA_SuperHexagon.shader文件。

         
[C#] 纯文本查看 复制代码
Shader "CameraFilterPack/AAA_Super_Hexagon" {
	Properties 
	{
		_MainTex ("Base (RGB)", 2D) = "white" {}
		_TimeX ("Time", Range(0.0, 1.0)) = 1.0
		_Distortion ("_Distortion", Range(0.0, 1.0)) = 0.3
		_ScreenResolution ("_ScreenResolution", Vector) = (0.,0.,0.,0.)
		_Value ("_Value", Range(0.2, 10.0)) = 1
		_HexaColor ("_HexaColor", Color) = (1,1,1,1)
		_BorderSize ("_BorderSize", Range(-0.5, 0.5)) = 0.0
		_BorderColor ("_BorderColor", Color) = (1,1,1,1)
		_SpotSize ("_SpotSize", Range(0, 1.)) = 0.5
		_AlphaHexa ("_AlphaHexa", Range(0.2, 10.0)) = 1
		_PositionX ("_PositionX", Range(-0.5, 0.5)) = 0.0
		_PositionY ("_PositionY", Range(-0.5, 0.5)) = 0.0
		_Radius ("_Radius", Range(0, 1.)) = 0.5
	}
	SubShader 
	{
		Pass
		{
			ZTest Always
			CGPROGRAM
			#pragma vertex vert
			#pragma fragment frag
			#pragma fragmentoption ARB_precision_hint_fastest
			#pragma target 3.0
			#include "UnityCG.cginc"
			
			
			uniform sampler2D _MainTex;
			uniform float _TimeX;
			uniform float _Distortion;
			uniform float4 _ScreenResolution;
			uniform float _Value;
			uniform float _BorderSize;
			uniform float4 _BorderColor;
			uniform float4 _HexaColor;
	
			uniform float _AlphaHexa;
				
			uniform float _PositionX;
			uniform float _PositionY;
			uniform float _Radius;			
			uniform float _SpotSize;			
			
		       struct appdata_t
            {
                float4 vertex   : POSITION;
                float4 color    : COLOR;
                float2 texcoord : TEXCOORD0;
            };
 
            struct v2f
            {
                  half2 texcoord  : TEXCOORD0;
                  float4 vertex   : SV_POSITION;
                  fixed4 color    : COLOR;
           };   
             
  			v2f vert(appdata_t IN)
            {
                v2f OUT;
                OUT.vertex = mul(UNITY_MATRIX_MVP, IN.vertex);
                OUT.texcoord = IN.texcoord;
                OUT.color = IN.color;
                
                return OUT;
            }
            

float hexDist(float2 a, float2 b){
	float2 p = abs(b-a);
	float s = 0.5;
	float c = 0.8660254;
	
	float diagDist = s*p.x + c*p.y;
	return max(diagDist, p.x)/c;
}

float2 nearestHex(float s, float2 st){
	float h = 0.5*s;
	float r = 0.8660254*s;
	float b = s + 2.0*h;
	float a = 2.0*r;
	float m = h/r;

	float2 sect = st/float2(2.0*r, h+s);
	float2 sectPxl = fmod(st, float2(2.0*r, h+s));
	
	float aSection = fmod(floor(sect.y), 2.0);
	
	float2 coord = floor(sect);
	if(aSection > 0.0){
		if(sectPxl.y < (h-sectPxl.x*m)){
			coord -= 1.0;
		}
		else if(sectPxl.y < (-h + sectPxl.x*m)){
			coord.y -= 1.0;
		}

	}
	else{
		if(sectPxl.x > r){
			if(sectPxl.y < (2.0*h - sectPxl.x * m)){
				coord.y -= 1.0;
			}
		}
		else{
			if(sectPxl.y < (sectPxl.x*m)){
				coord.y -= 1.0;
			}
			else{
				coord.x -= 1.0;
			}
		}
	}
	
	float xoff = fmod(coord.y, 2.0)*r;
	return float2(coord.x*2.0*r-xoff, coord.y*(h+s))+float2(r*2.0, s);
}



inline float2 screenDistort(float2 uv)
{
	uv -= float2(.5,.5);
	uv = uv*1.2*(1.0/1.2+2.*uv.x*uv.x*uv.y*uv.y);
	uv += float2(.5,.5);
	return uv;
}

float noise2(float n)
{
	return lerp(0,0.5,smoothstep(0.0,0.5,+fmod(n+0.5,1.0)));
}


float4 frag (v2f i) : COLOR
{
	float2 uv 		= i.texcoord.xy;
	float   s 		= _Value * _ScreenResolution.x/160.0;
	float2 nearest 	= nearestHex(s, i.texcoord.xy * _ScreenResolution.xy);
	float4 texel 	= tex2D(_MainTex, nearest/_ScreenResolution.xy);
	float4 texel2 	= tex2D(_MainTex, uv);
	uv = screenDistort(uv);
	float2 uv2;
	uv2 = uv.yy+float2(0.1*sin(_TimeX/3)*5,0.1*sin(_TimeX/5)*5);
	float3 video = tex2D(_MainTex,uv2).rgb;
	float vigAmt = 2.+.3*sin(15+5.*cos(5.));
	float vignette = (1.-vigAmt*(uv.y-.5)*(uv.y-.5))*(1.-vigAmt*(uv.x-.5)*(uv.x-.5));
	video += (12.+fmod(uv.y*10.+_TimeX,1.))/13.;
	float2 center = float2(_PositionX,_PositionY);
	float dist2 = 1.0 - smoothstep( _Radius,_Radius+0.15*_SpotSize, length(center - uv));
	float dist 		= hexDist(i.texcoord.xy * _ScreenResolution.xy, nearest);
	float luminance = (texel.r + texel.g + texel.b)/3.0;
	float interiorSize = s*_BorderSize;//*(1-dist2*2);
	float interior = 1.0 - smoothstep(interiorSize-1.0, interiorSize, dist);
	float4 result;
	result.rgb=lerp(_BorderColor.rgb,texel.rgb,interior);
	float mem=1-noise2(_TimeX/4+uv.x);
	result.rgb+=float3(mem,mem,mem);
	result.rgb*=_HexaColor.rgb;
	result.rgb/=video.rgb/2;
	result /= vignette*2;
	result.rgb=lerp(result.rgb,texel2.rgb,dist2);
	result.rgb=lerp(result.rgb,texel2.rgb,1-_AlphaHexa);
	result.a=1.0;
	return float4(result);	
}
			
			ENDCG
		}
		
	}
}


    2.我们新建一个CameraFilterPack_AAA_SuperHexagon.cs组件 ,并且直接附加在摄像机对象上。
   
     
[C#] 纯文本查看 复制代码
using UnityEngine;

[ExecuteInEditMode]
[AddComponentMenu ("Camera Filter Pack/AAA/Super Hexagon")]
public class CameraFilterPack_AAA_SuperHexagon : MonoBehaviour {
	#region Variables
	public Shader SCShader;
	[Range(0.0f, 1.0f)]
	public float _AlphaHexa = 1.0f;
	private float TimeX = 1.0f;
	private Vector4 ScreenResolution;
	private Material SCMaterial;
	[Range(0.2f, 10.0f)]
	public float HexaSize = 2.5f;
	public float _BorderSize = 1.0f;
	public Color _BorderColor = new Color (0.75f, 0.75f, 1, 1);
	public Color _HexaColor = new Color (0, 0.5f, 1, 1);
	public float _SpotSize = 2.5f;

	public static float ChangeBorderSize = 1.0f;
	public static Color ChangeBorderColor;
	public static Color ChangeHexaColor;
	public static float ChangeSpotSize = 1.0f;
	public static float ChangeAlphaHexa = 1.0f;
	public static float ChangeValue;
	public Vector2 center = new Vector2(0.5f,0.5f);
	public float Radius = 0.25f;

	public static Vector2 Changecenter;
	public static float ChangeRadius;
	

	#endregion
	
	#region Properties
	Material material
	{
		get
		{
			if(SCMaterial == null)
			{
				SCMaterial = new Material(SCShader);
				SCMaterial.hideFlags = HideFlags.HideAndDontSave;	
			}
			return SCMaterial;
		}
	}
	#endregion
	void Start () 
	{
		Changecenter = center;
		ChangeRadius = Radius;
		ChangeValue = HexaSize;
		ChangeAlphaHexa = _AlphaHexa;

		ChangeBorderSize = _BorderSize;
		ChangeBorderColor = _BorderColor;
		ChangeHexaColor = _HexaColor;
		ChangeSpotSize = _SpotSize;

		SCShader = Shader.Find("CameraFilterPack/AAA_Super_Hexagon");

		if(!SystemInfo.supportsImageEffects)
		{
			enabled = false;
			return;
		}
	}
	
	void OnRenderImage (RenderTexture sourceTexture, RenderTexture destTexture)
	{
		if(SCShader != null)
		{
			TimeX+=Time.deltaTime;
			if (TimeX>100)  TimeX=0;
			material.SetFloat("_TimeX", TimeX);
			material.SetFloat("_Value", HexaSize);
			material.SetFloat("_PositionX", center.x);
			material.SetFloat("_PositionY", center.y);
			material.SetFloat("_Radius", Radius);
			material.SetFloat("_BorderSize", _BorderSize);
			material.SetColor("_BorderColor", _BorderColor);
			material.SetColor("_HexaColor", _HexaColor);
			material.SetFloat("_AlphaHexa", _AlphaHexa);
			material.SetFloat("_SpotSize", _SpotSize);
			material.SetVector("_ScreenResolution",new Vector4(sourceTexture.width,sourceTexture.height,0.0f,0.0f));
			Graphics.Blit(sourceTexture, destTexture, material);
		}
		else
		{
			Graphics.Blit(sourceTexture, destTexture);	
		}

	}
	void OnValidate()
{
		ChangeValue=HexaSize;
		Changecenter=center;
		ChangeRadius=Radius;
		ChangeBorderSize=_BorderSize;
		ChangeBorderColor=_BorderColor;
		ChangeHexaColor=_HexaColor;
		ChangeSpotSize=_SpotSize;
		ChangeAlphaHexa=_AlphaHexa;
}
	// Update is called once per frame
	void Update () 
	{
		if (Application.isPlaying)
		{
			HexaSize = ChangeValue;
			center = Changecenter;
			Radius = ChangeRadius;
			_BorderSize = ChangeBorderSize;
			_BorderColor = ChangeBorderColor;
			_HexaColor = ChangeHexaColor;
			_SpotSize = ChangeSpotSize;
			_AlphaHexa = ChangeAlphaHexa;
		}
		#if UNITY_EDITOR
		if (Application.isPlaying!=true)
		{
			SCShader = Shader.Find("CameraFilterPack/AAA_Super_Hexagon");
		}
		#endif

	}

	void OnDisable ()
	{
		if(SCMaterial)
		{
			DestroyImmediate(SCMaterial);	
		}
	}

}

      
    3.因为操作比较简单,所以我们直奔重点终点看效果吧!
   
      3_0.png

      3_1.png
   
   学习交流群:575561285

评分

参与人数 1鲜花 +2 收起 理由
AnimeKing + 2 很给力!

查看全部评分


回复

使用道具 举报

3偶尔光临
273/300
排名
8626
昨日变化
121

0

主题

138

帖子

273

积分

Rank: 3Rank: 3Rank: 3

UID
109946
好友
0
蛮牛币
184
威望
0
注册时间
2015-6-23
在线时间
55 小时
最后登录
2017-3-30
发表于 2017-1-4 09:08:57 | 显示全部楼层
强,学习了。{:104:}{:104:}{:104:}{:104:}
[发帖际遇]: lxtuntian 发帖时在路边捡到 1 蛮牛币,偷偷放进了口袋. 幸运榜 / 衰神榜

回复 支持 反对

使用道具 举报

6蛮牛粉丝
1226/1500
排名
4657
昨日变化
43

2

主题

771

帖子

1226

积分

Rank: 6Rank: 6Rank: 6

UID
92518
好友
1
蛮牛币
2420
威望
0
注册时间
2015-4-15
在线时间
273 小时
最后登录
2017-3-30
发表于 2017-1-4 09:28:21 | 显示全部楼层
6666666666666666666
[发帖际遇]: 825 乐于助人,奖励 1 蛮牛币. 幸运榜 / 衰神榜

回复 支持 反对

使用道具 举报

2初来乍到
140/150
排名
13473
昨日变化
14

0

主题

72

帖子

140

积分

Rank: 2Rank: 2

UID
60945
好友
0
蛮牛币
9
威望
0
注册时间
2014-12-12
在线时间
36 小时
最后登录
2017-3-15
QQ
发表于 2017-1-4 11:32:18 | 显示全部楼层
666感谢分享!!!!

回复

使用道具 举报

5熟悉之中
532/1000
排名
3359
昨日变化
16

0

主题

113

帖子

532

积分

Rank: 5Rank: 5

UID
168193
好友
0
蛮牛币
175
威望
0
注册时间
2016-9-12
在线时间
127 小时
最后登录
2017-3-30
发表于 2017-1-4 12:08:31 | 显示全部楼层
很强,学习学习

回复

使用道具 举报

排名
17140
昨日变化
14

1

主题

36

帖子

87

积分

Rank: 2Rank: 2

UID
32384
好友
1
蛮牛币
184
威望
0
注册时间
2014-7-3
在线时间
32 小时
最后登录
2017-3-29
发表于 2017-1-4 17:43:40 | 显示全部楼层
6666,学习学习

回复

使用道具 举报

7日久生情
2775/5000
排名
79
昨日变化

0

主题

381

帖子

2775

积分

Rank: 7Rank: 7Rank: 7Rank: 7

UID
239
好友
2
蛮牛币
4984
威望
0
注册时间
2013-6-6
在线时间
546 小时
最后登录
2017-3-30
发表于 2017-1-5 09:24:07 | 显示全部楼层
good!!!!!!!!!!!!!!!!!

回复

使用道具 举报

4四处流浪
431/500
排名
7898
昨日变化
85

0

主题

262

帖子

431

积分

Rank: 4

UID
156480
好友
0
蛮牛币
633
威望
0
注册时间
2016-7-12
在线时间
75 小时
最后登录
2017-3-30
发表于 2017-1-5 10:15:44 | 显示全部楼层
6666666666666666666

回复 支持 反对

使用道具 举报

排名
15784
昨日变化
8

0

主题

33

帖子

75

积分

Rank: 2Rank: 2

UID
38790
好友
0
蛮牛币
28
威望
0
注册时间
2014-8-8
在线时间
22 小时
最后登录
2017-3-2
发表于 2017-1-5 10:53:33 | 显示全部楼层
果然强大,收藏了

回复

使用道具 举报

5熟悉之中
722/1000
排名
2540
昨日变化
19

4

主题

132

帖子

722

积分

Rank: 5Rank: 5

UID
81888
好友
2
蛮牛币
4316
威望
0
注册时间
2015-3-19
在线时间
210 小时
最后登录
2017-3-30
发表于 2017-1-5 14:18:20 | 显示全部楼层

666感谢分享!!!!

回复

使用道具 举报

5熟悉之中
706/1000
排名
19085
昨日变化
20

1

主题

586

帖子

706

积分

Rank: 5Rank: 5

UID
185807
好友
0
蛮牛币
560
威望
0
注册时间
2016-11-22
在线时间
105 小时
最后登录
2017-3-30
发表于 2017-1-18 14:29:08 | 显示全部楼层
强,学习中,谢谢分享

回复 支持 反对

使用道具 举报

排名
45001
昨日变化
203

0

主题

4

帖子

7

积分

Rank: 1

UID
202947
好友
0
蛮牛币
14
威望
0
注册时间
2017-1-18
在线时间
1 小时
最后登录
2017-1-18
发表于 2017-1-18 14:39:59 | 显示全部楼层
666感谢分享!!!!

回复

使用道具 举报

5熟悉之中
563/1000
排名
3592
昨日变化
23

9

主题

109

帖子

563

积分

Rank: 5Rank: 5

UID
174370
好友
1
蛮牛币
2378
威望
0
注册时间
2016-10-10
在线时间
175 小时
最后登录
2017-3-30

活力之星

QQ
发表于 2017-1-18 16:56:35 | 显示全部楼层
好厉害。

回复

使用道具 举报

3偶尔光临
224/300
排名
8210
昨日变化
96

1

主题

95

帖子

224

积分

Rank: 3Rank: 3Rank: 3

UID
158815
好友
0
蛮牛币
249
威望
0
注册时间
2016-7-26
在线时间
40 小时
最后登录
2017-3-30
发表于 2017-1-19 15:29:30 | 显示全部楼层
马一下,学习

回复

使用道具 举报

3偶尔光临
162/300
排名
9714
昨日变化
150

2

主题

46

帖子

162

积分

Rank: 3Rank: 3Rank: 3

UID
104455
好友
0
蛮牛币
299
威望
0
注册时间
2015-5-30
在线时间
52 小时
最后登录
2017-3-30
QQ
发表于 2017-3-7 09:37:09 | 显示全部楼层

666感谢分享!!!!

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册帐号

本版积分规则

快速回复 返回顶部 返回列表