UGUI（十一）NGUI精灵圆形效果(一)
游戏中有很多地方会使用圆形，圆形icon，Logo等等。shader中实现圆形效果也比较容易，中心点大于0.5的像素点的透明度设置为0即可，写好的shader在NGUI中的UITexture中可以直接使用。
UGUI已经自带的遮罩功能，在这里就不啰嗦了。
那么如何在NGUI的精灵上做效果呢？
因为NGUI自身的shader是针对整个图集，图集中的一个精灵不可以直接单独使用shader，精灵的显示是获取图集中的切片信息，然后绘制顶点取出UV信息进行绘制。所以在UITexture上能用的shader在精灵上就用不了。
但是换个方式想想，可不可以在精灵的节点上增加render，那就也能再增加一个材质球和shader，然后进行融合和裁剪。有了思路，就赶紧试试吧。。。
实践证明，这种方式是可行的：
如下图（原图是长方形，粉红是天空色）：
精灵组件如下图：
注意遮罩材质，中间的圆形在PS中裁剪掉了。
Alpha Test和Blending的渲染顺序：
shader代码如下：
Shader&"Custom/test"&{&&
&&&&Properties&{&&
&&&&&&&&_MainTex&("Base&(RGB)",&2D)&=&"white"&{}&&
&&&&SubShader&{&&
&&&&&&&&Tags&{&"RenderType"="Opaque"&}&&
&&&&&&&&LOD&200&&
&&&&&&&&//&发生在颜色输出之后&&
&&&&&&&&//&融合：当前shader是源，这里不需要源，只需要背景&&
&&&&&&&&//&源rgba&*&0&+&背景rgba&*&1&&
&&&&&&&&Blend&zero&one&&
&&&&&&&&//&对于源而已，我们只需透明度大于0.5的,自己可以根据切片定义&&
//&保留4个角的像素，接着进行融合时*0就被剔除
&&&&&&&&AlphaTest&Greater&0.5&&
&&&&&&&&CGPROGRAM&&
&&&&&&&&#pragma&surface&surf&Lambert&&
&&&&&&&&sampler2D&_MainT&&
&&&&&&&&struct&Input&{&&
&&&&&&&&&&&&float2&uv_MainT&&
&&&&&&&&};&&
&&&&&&&&void&surf&(Input&IN,&inout&SurfaceOutput&o)&{&&
&&&&&&&&&&&&half4&c&=&tex2D&(_MainTex,&IN.uv_MainTex);&&
&&&&&&&&&&&&o.Albedo&=&c.&&
&&&&&&&&&&&&o.Alpha&=&c.a;&&
&&&&&&&&}&&
&&&&&&&&ENDCG&&
&&&&FallBack&"Diffuse"&&
已投稿到：
以上网友发言只代表其个人观点，不代表新浪网的观点或立场。NGUI实现小地图的制作之不同形状的遮罩
之前一篇NGUI做的小地图是通过移动箭头实现的，现在换一种方式通过移动地图来实现，并且给小地图设置一个形状，我这里是设置的圆形（形状可以根据你自己的需求可以设置成不同的形状）。
首先我们做一些开始的准备。
建一个UI Root；在Project里建一个Render
Texture，命名为MiniMap；然后建一个材质球命名为mini；
Texture，Shader，和图片1拖到材质球对应的位置。其中图片1为一张中间是白色的圆，外围为Alpha通道的图片（如果你想要地图是什么形状就相应的把中间的图形P成什么形状）。Shader是新写的，用来剔除，遮罩的，使得图片中间白色部分透明，只显示地图的线路。下面给出Shader代码：
Shader "Custom/QRCTranMask" {
Properties {
_MainTex ("Base (RGB)", 2D) = "white" {}
_CullValue("Cull", range(0,0.2)) = 0
_Mask("Mask (RGBA)", 2D) = "white" {}
//_Alpha("Alpha Value", range(0,1)) = 1
SubShader {
"RenderType"="Transparent"&
"Queue"="Transparent"&
& & & Blend
SrcAlpha OneMinusSrcAlpha
Lighting off
ZWrite Off&
AlphaTest GEqual [_Cutoff]
#pragma vertex vert
#pragma fragment frag
#include "UnityCG.cginc"
& & sampler2D
& & sampler2D _M
& & float _CullV
& & float _A
& &struct v2f
&float4 pos:POSITION;
&float2 uv : Texcoord0;
& & float4
_MainTex_ST;
& & v2f vert(appdata_base
& & o.pos =
mul(UNITY_MATRIX_MVP,v.vertex);
& & o.uv =
TRANSFORM_TEX(v.texcoord,_MainTex);
& & half4 frag(v2f i) :
float4 tex = tex2D(_MainTex, i.uv);
tex *= tex2D(_Mask,i.uv);
if(tex.r&=_CullValue && tex.g&=_CullValue
&& tex.b&=_CullValue)
tex.a = 0;
FallBack "Diffuse"
准备就绪，开始。在建的UI
Root中，把锚点Anchor去掉，把Camera单独拖出来，并且新建一个Camera命名为MiniMapCamera，把它改成正交，具体参数如下。我这里除了MiniMapCamera是Default层，其余的都为GUI层&
对应上面修改Clear Flags， Culling Mask，Projection，已经将MiniMap的Render
Texture拖到MiniMap摄像机中，该摄像机用来渲染纹理。
根据下图，建立小地图的箭头，背景图等等将之前建立的mini材质球拖给Texture
Hierarchy面板里的设置差不多就这样，在场景中，我们把Minimap拖到NGUI
Camera渲染不到的地方，只能被MiniMapCamera渲染。
下面是场景中的
最后我们来让小地图移动：通过移动路线，固定箭头不动。我的代码是拖到箭头上
using UnityE
using System.C
public class Mm : MonoBehaviour {
&&& private
GameObject&
&&& private
Transform MiniMapA
&&& private
Transform MiniM
&& private
GameObject& mainC
car& = QRCGlobalVar.CurrentC
MiniMapArrow =
MiniMaplu = transform.parent.FindChild("lu");
print(MiniMapArrow.name);
print(MiniMaplu.name);
mainCamera = GameObject.Find("Main Camera");
const float miniMapScaleRatio = 400 / 1500f;//小地图与实际场景地图比例
MiniMapArrow.rotation = Quaternion.Euler(0, 0,
-car.transform.rotation.eulerAngles.y);
MiniMaplu.localPosition = new Vector3()//地图的位置
&&&&&&&&&&&
x = car.transform.position.x * miniMapScaleRatio,
&&&&&&&&&&&
y = car.transform.position.z * miniMapScaleRatio,
&&&&&&&&&&&
基本已经结束了，关于小地图的位置可以自由移动，最后来说一下自适应：将UIRoot的Scaling
Style改成FixedSize，并且调节Manual
Height（为你Game场景中的高，假如是的就设为768就可以了）
路线渐渐移近透明的圆内
已投稿到：
以上网友发言只代表其个人观点，不代表新浪网的观点或立场。Unity3D学习笔记（十八）使用插件NGUI制作小地图(转)
原本只是想用Unity自带的GUI功能实现魔兽世界的小地图效果，结果折腾了一个晚上。
原来的思路如下：
根据玩家坐标，计算出应显示的地图缩略图部分（128&128）；
用GUI遮罩将非白色的部分剔除（这样可以实现任意形状的小地图）；
将地图框叠加到第二步中的纹理上；
将玩家指示物放置在地图中心，并根据当前玩家的Transform.Rotation计算出指示物的旋转角度；
在做到一半的时候发现GUI
Texture只能使用Texture，无法使用Material，这也就意味着不能使用Shader做遮罩的剔除效果。在网上搜索了好久，发现有好多老外也在问相关的问题，但是就是没有很合适的解决方案。经过再三考虑之后，咬咬牙决定舍弃系统自带的GUI功能，使用第三方GUI插件。
其实之前也有了解过相关的插件，比如NGUI、EZGUI和IGUI之类的，只不过感觉如果太依赖第三方插件则会导致“知其然而不知其所以然”，所以也一直没去学习使用。工欲善其事必先利其器，既然已经决定要使用第三方插件了，那么选择一个趁手的当然是首要问题。通过比较最终选择了NGUI，主要参考了这篇。NGUI的全称是Next & Gen
UI（次世代界面），它提供了快速创建常用的2D控件的功能，如按钮、文本框、滚动条等，继承Unity所见即所得的优良传统，并实现了Draw
Call的合并，以优化性能。
在CSDN里找到了2.03版本的共享，。下载解压之后会得到一个NGUI203d.unitypackage的文件，双击就可以像导入自带资源包一样把NGUI导入到当前项目中。如果文件关联失效了，也可以通过主菜单的”Assets→Import
Package→Custom
Package…“手动导入。最终在Unity的工程面板中就可以得到一个NGUI目录，里边包括了所有的资源，还有一些范例场景(在Examples/Scenes下面)。其相关的中文教程也并不少，有很多达人都共享了他们宝贵的经验，我这里就不再赘述基础知识点了，多问问度娘一定会让你收获颇丰。
导入NGUI后会在主菜单中新增NGUI功能选项，方便快速调用它的功能。首先点击主菜单的“NGUI→Create a New
UI”创建一个UI根对象。由于地图这些都是2D的，所以保持默认的设置创建Simple 2D Camera即可。
点击“Create Your UI”完成，在工程面板中就出现了UI
Root(2D)，其下面的所有UI对象都会按照指定的布局渲染到屏幕上，重命名为MiniMapView。Anchor（锚点）是用来定位的，保持默认的Center（居中）。
点击NGUI的“Atlas
Maker”来创建一个图片集，输入名字MiniMap，选中工程面板中的地图缩略图，然后点击Create就可以了。
选中Panel，然后再选择使用NGUI菜单的“Create a Widget”在面板下面创建一个精灵。
到这里准备工作全部做好了：
可以看到NGUI其实只是在一个主相机视野看不到的地方创建需要显示的GUI，然后用另外一个正交投影相机将观察到的内容叠加到主相机上但是做小地图的时候并不希望它直接渲染到屏幕上，而是渲染到一张纹理上，这样才可以使用材质配合遮罩的Shader实现不规则的效果。所以还是先得在工程面板中创建一个Render
Texture，重命名为MiniMap，并拖放到Camera的Target
Texture属性上。这样，所有该摄像机可见的物体都会渲染到MiniMap这张Render Texture中了。
注意还必须把摄像机的清除标志（Clear Flags）改成纯色（Solid
Color），并把Background换成黑色。这样可以让地图超出的部分显示为纯黑色。
然后轮到Mask
Shader出场咯。把度娘全身都搜了个遍，终于在茫茫人海中找到了它。在工程面板里创建一个Shader，重命名为TransparentMast，把以下代码复制进去：
Shader "Transparent/Mask"
Properties
_MainTex ("Base (RGB)", 2D) = "white" {}
_Mask ("Culling Mask", 2D) = "white" {}
_Cutoff ("Alpha cutoff", Range (0,1)) = 0
Tags {"Queue"="Transparent"}
Lighting Off
ZWrite Off
Blend SrcAlpha OneMinusSrcAlpha
AlphaTest GEqual [_Cutoff]
SetTexture [_Mask] {combine texture}
SetTexture [_MainTex] {combine texture, previous}
Shader "Transparent/Mask"
Properties
_MainTex ("Base
(RGB)", 2D) =
"white" {}
Mask", 2D) =
"white" {}
_Cutoff ("Alpha
cutoff", Range (0,1))
Tags {"Queue"="Transparent"}
ZWrite Off
SrcAlpha OneMinusSrcAlpha
AlphaTest GEqual [_Cutoff]
SetTexture
[_Mask] {combine texture}
SetTexture [_MainTex] {combine texture, previous}
再在工程面板中创建一个材质，使用这个Shader，并把前面的Render
Texture拖到Base(RGB)上，把遮罩纹理拖到Culling
Mask上。这样，最难的问题就解决了。此时只要把这个材质附加到任何支持材质的对象上，都能显示小地图了^_^。比如随便创建一个平面，把材质附加到Mesh
Renderer组件的Materials上：
啊，看起来离最终目标还是有点距离……不过已经可以看出圆形以外的纹理都变透明了。
接下来的工作就是慢慢把GUI部分搭建起来。
再创建一个UI
Root，这次是用来真正显示GUI了。由于GUI是默认定位在左上角的，因此可以删掉原来的Anchor。再创建一个Panel，重命名为HudPanel。这个面板用来做整体缩放，因为界面上不一定只有小地图，还有之前做的头像、动作条之类的，如果需要批量缩放，那么只要调整这个面板的Scale就好了。
在HudPanel下面创建一个锚点Anchor &
RightTop，把Side修改为TopRight，让它对齐到右上角。再在其下面创建一个Panel，叫做MiniMap，然后在下面分别创建地图边框（Sprite）、地图指北标志（Sprite）、人物指示标志（Sprite）、地图纹理（UITexture），调整XY轴坐标定位，调整Depth可以更改显示优先级，记得要把前面创建的MiniMap材质赋给地图纹理。我这里还多创建了一个Label，用来显示当前地图位置，但是会遇到一个字体的问题，这个待会再写。
好了，玩家指针已经定位在地图的（0,0）点位置，再写一个脚本附加到MiniMap上，让它能够实时地反映玩家的当前位置和朝向。
void Update()
const float miniMapScaleRatio = 800 / 2000f;
MiniMapArrow.rotation = Quaternion.Euler(0, 0, -mPlayerTransform.rotation.eulerAngles.y);
MiniMapPanel.localPosition = new Vector3()
x = -mPlayerTransform.position.x * miniMapScaleRatio,
y = -mPlayerTransform.position.z * miniMapScaleRatio,
void Update()
const float miniMapScaleRatio = 800 / 2000f;
MiniMapArrow.rotation = Quaternion.Euler(0, 0, -mPlayerTransform.rotation.eulerAngles.y);
MiniMapPanel.localPosition = new Vector3()
x = -mPlayerTransform.position.x *
miniMapScaleRatio,
= -mPlayerTransform.position.z * miniMapScaleRatio,
看起来还不错：）
已投稿到：
以上网友发言只代表其个人观点，不代表新浪网的观点或立场。圆形遮罩 - CSDN博客
无法在NGUI UIPanel 的子对象使用
--------------------
在unity中很多时候会用到遮罩层，如Minnmap、钮等
&这里贴上相关的Shader代码和注释
Shader &ShaderDemo/MaskLayer& {
Properties {
_MainTex (&Base (RGB)&, 2D) = &white& {}//目标图片，即需要被遮罩的图片
_MaskLayer(&Culling Mask&,2D) = &white&{}//混合的图片，设置为白色的图片，任何颜色与白色混合，其颜色不变
_Cutoff(&Alpha cutoff&,Range(0,1)) = 0
SubShader {
Tags { &Queue&=&Transparent& }//渲染队列设置为 &以从后往前的顺序渲染透明物体
Lighting off //关闭光照
ZWrite off //关闭深度缓存
Blend off //关闭混合
AlphaTest GEqual[_Cutoff] //启用alpha测试
SetTexture[_MaskLayer]{combine texture}//混合贴图
//混合贴图，previous为放置在前一序列这样在进行AlphaTest的时候会以这个图片为主来进行混合
SetTexture[_MainTex]{combine texture,previous}
白色背景混合的图片
混合后的结果，这里的将_Cutoff的值设为1后的效果
版权声明：本文为博主原创文章，未经博主允许不得转载。
-------------------------
&那你在看看这个呢，还是假的吗？&&密码:
那个只是示意下，用模型挖个洞。我不会改sharder...
本文已收录于以下专栏：
相关文章推荐
在游戏中，当战斗结束后，对一些获取的宝贝需要进行闪光处理。这篇文章介绍一个进行闪光处理的shader，运行效果如下：
  
下面是shader的实现：
Shader &stalendp/imageS...
Unity3D中对象池的使用
原文地址：点击
翻译：claudio 
The script is really simple but it has h...
Shader &Masked/Mask& {
SubShader {
// Render the mask after regular geometry, but before ...
shader圆形遮罩有四个脚本，其它三个主要用于 Panel下支持裁剪 问题FirstShader &Unlit/Transparent Colored&
Properties
在Unity中有个Mask遮罩逐渐，使用这个组件也可以实现遮罩效果
但是我在使用Unity自带的圆形图片时候效果如下：
可能是由于遮罩图片的像素问题导致的，大家可以尝试更换一张像素大点的遮罩图片，...
在unity中很多时候会用到遮罩层，如Minnmap、钮等
 这里贴上相关的Shader代码和注释
Shader &ShaderDemo/MaskLayer& {
Properties {
版权所有，转载须注明出处！喜欢火影、喜欢Java、喜欢unity3D、喜欢游戏开发的都可以加入木叶村Q群：、随便聊本人真正学习Shader的时间莫过于今年春节在家的两天时间，虽然短...
由于最近比较忙，所以很多我在其它地方发布的博文都没有同步到这里。我会在后面慢慢重新补回来。对各位关注我博客的读者也表示抱歉！
版权所有，转载须注明出处！
喜欢火影、喜欢Java、喜欢unity...
他的最新文章
讲师：吴岸城
您举报文章：
举报原因：
原文地址：
原因补充：
(最多只允许输入30个字)