码迷,mamicode.com
首页 > 编程语言 > 详细

Unity Shaders and Effects Cookbook (6-4) GUI 和 透明度

时间:2016-05-10 02:55:12      阅读:256      评论:0      收藏:0      [点我收藏+]

标签:

在游戏项目中使用透明最多的地方就是 GUI 了。这一节用一个非常简单的 GUI 例子,来熟悉控制透明物体的渲染顺序。


搭建场景,导入随书资源。

创建着色器 GUI,创建两个Material,一个 GUIBG 用于背景图片,一个 GUIGRP 用于 按钮界面。

转自http://blog.csdn.net/huutu http://www.thisisgame.com.cn

把创建的Material 分别赋值给 GUIBG 和 GUIGRP。

场景搭建完毕后 效果如下

技术分享


因为创建的Shader 默认是 Diffuse ,所以没有透明度。

我故意把灯光调的很强,是为了设置 不接受灯光 后 对比方便。


下面进行一系列修改。

1、使用 IgnoreProjector 标签 设置不接受Projector。

ags {"IgnoreProjector"="True" "RenderType"="Opaque" }

因为没有添加Projector 组件,所以这里修改后 场景中没有什么变化。


2、修改渲染队列为 Transparent,修改RenderType 为 Transparent。

Tags {"Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" }

声明Alpha 参数

#pragma surface surf Lambert alpha

这时候已经有透明了

技术分享


3、自定义光照函数 GUI,不接受光照影响

#pragma surface surf GUI alpha


inline fixed4 LightingGUI(SurfaceOutput s,fixed3 lightDir,fixed3 viewDir,fixed atten)
{
	fixed4 c;
	c.rgb=s.Albedo;
	c.a=s.Alpha;
	return c;
}

现在已经不受光照影响了。

技术分享


4、声明 novertexlights 参数,告诉Unity 这里不需要任何顶点级的光照。

#pragma surface surf GUI alpha novertexlights

添加 novertexlights 参数,可以让 Shader 更加轻便。

转自http://blog.csdn.net/huutu http://www.thisisgame.com.cn

5、添加 ZWrite Off 、Cull Back

ZWrite Off
Cull Back
LOD 200

完整的Shader 代码如下

Shader "CookBookShaders/Chapt6-4/GUI" 
{
	Properties 
	{
		_MainTex ("Base (RGB)", 2D) = "white" {}
	}

	SubShader 
	{
		Tags {"Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" }


		ZWrite Off
		Cull Back
		LOD 200
		
		CGPROGRAM
		#pragma surface surf GUI alpha novertexlights

		sampler2D _MainTex;

		struct Input {
			float2 uv_MainTex;
		};

		void surf (Input IN, inout SurfaceOutput o) {
			half4 c = tex2D (_MainTex, IN.uv_MainTex);
			o.Albedo = c.rgb;
			o.Alpha = c.a;
		}

		inline fixed4 LightingGUI(SurfaceOutput s,fixed3 lightDir,fixed3 viewDir,fixed atten)
		{
			fixed4 c;
			c.rgb=s.Albedo;
			c.a=s.Alpha;
			return c;
		}

		ENDCG
	} 
	FallBack "Diffuse"
}

但是还没完,为什么 PLAY GAME 和 QUIT GAME 这两个按钮,被 背景图 遮住了呢?

这是因为默认是由 摄像机的距离来决定渲染顺序的,背景图 和 按钮的 Z 都是0,判断不了哪个先,哪个后。

这种情况,可以单独给 按钮 指定 Queue ,但是这样的话要新建一个Shader,未免太麻烦了。

我们可以从 脚本中去修改 Queue ,只需要创建一个脚本,然后在编辑器中赋不同的值。


创建脚本 RenderQueue.cs 完整代码如下:

using UnityEngine;
using System.Collections;

[ExecuteInEditMode]
public class RenderQueue : MonoBehaviour 
{

    public int queueValue = 2000;

	// Use this for initialization
	void Start () {
	
	}
	
	// Update is called once per frame
	void Update () 
    {
        Material curMaterial = transform.renderer.sharedMaterial;
        if(curMaterial)
        {
            curMaterial.renderQueue = queueValue;
        }
        else
        {
            Debug.LogError(transform.name+":  need Material to set the Render Queue");
        }
	}
}

把脚本添加到 PLAY GAME 上,效果如下

技术分享

因为默认值是2000,而 背景图的Queue 是 Transparent = 3000,所以现在是先渲染了 按钮,再渲染 背景图。

由于 几个按钮是共用一个 Material 的,所以修改了 PLAY GAME ,其它两个按钮也变了。

转自http://blog.csdn.net/huutu http://www.thisisgame.com.cn

在编辑器中修改 Queue Value 为3050,大于 Transparent。

效果如下,已经是正确的了:

技术分享



示例项目下载:

http://pan.baidu.com/s/1hrDw71U


Unity Shaders and Effects Cookbook (6-4) GUI 和 透明度

标签:

原文地址:http://blog.csdn.net/huutu/article/details/51358970

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!