unity3d 角色头顶信息3D&2D遮挡解决方案(一)

 

先上效果图,只凭文字描述,脑补应该有些困难- -

 如图:有三个角色(我们暂且从左到右叫它们A、B、C),一个2D UI(中间动作选择的框框),一个cube(右边的方块)

cube挡住了角色C的头顶信息

2D UI挡住了角色和cube

共同点是只显示未被遮挡的部分,遮挡的部分不显示

相信大多数人在看我这篇文章之前已经看过雨松momo的《人物头顶名称与血条更新与绘制》

没看过的可以去看看:http://www.xuanyusong.com/archives/1032

如果直接使用雨松momo文章中的代码的话,那么你会发现有一些问题,如图

这里我没有用血条,只绘制了文字,都一样的!

第一:因为是用OnGUI绘制的,所以使用的过程之中角色昵称和血条会挡住NGUI创建的UI。你可以脑补一下当你打开背包时,一排文字和血条挡住了你的背包。。。

第二:当角色被其他物体遮挡时,这里我说的是3D物体,不是UI。怎么说比较好理解呢!!就好比角色走到了墙后面,角色已经被墙遮挡住了,但是角色昵称和血条依旧显示(或许有一些人就要这种效果!好吧,至少在我的项目中这种效果给我的感觉是非常差的)

第三:当同一个场景出现两个角色时,两个角色都有自己的昵称和血条,如果你和另个角色距离太远且旋转了角度时,名称和血条居然奇迹的出现在了天上!没错,就是天上

......以上所述只是指出一些bug,并没有多余的意思,大家勿喷,我也是菜鸟,只是和大家分享下经验!!

雨松momo的写这篇文章的目的也就是给大家一个思路,具体在项目中怎么实现成预想效果得靠自己了

 这个思路挺好,但是由于一些我自身项目的原因就暂且不用这个思路,这个思路大家可以去看看,以后肯定能用到

 

现在用另外一种思路实现,这里我们要学到一个东西:Layer(层)

关于layer的介绍请看圣典:http://game.ceeger.com/Components/Layers.html

其实我自己也没有看过,为了写这篇文章才去搜的,自己没事的时候瞎点点就知道是干嘛的了

 

因为我们要用到NGUI,所以先导入NGUI插件包

进入正题:

1、创建一个空GameObject,改名为NamePanel,设为角色子物体,然后Reset并且调整位置到角色头顶位置

2、将NamePanel的Layer设置和角色同一个层,并且添加一个UIPanel

3、在NamePanel下添加UILabel,方法为:选中NamePanel->NGUI->Create->Label,并且将Label Overflow属性设置为ResizeFreely(自动适应文字大小以及长度的)

4、设置UILabel组件的属性。字体、显示文字、字体颜色。Effect选择OutLine,颜色选择为黑色,这个参数是描边的,让字体更清晰

 

咦,搞毛啊,字体怎么这么大啊?把字体修改小一点,10、5、1,尼玛怎么还是这么大,而且还看不清了

别急别急,不是你操作错误,是还没操作完!

我一开始遇到这个问题的时候我也纳闷了,后来想了想,有可能是没有添加UIRoot的原因

用过NGUI的都知道,UIRoot是NGUI必不可少的一部分,在手机上自适应分辨率就靠它了

那既然知道原因了,我们就添加一个UIRoot试试呗

 

5、选择NamePanel,添加一个UIRoot组件,Scaling Style选择FixedSizeOnMobiles

 哈哈,字体恢复正常了!如果感觉字体比较小,可以在把字体调大一些

运行游戏,你会发现角色移动的时候,头顶信息虽然跟随角色了,但是角色旋转或相机旋转的时候,头顶信息旋转面向摄像机。如果你就想这样,那是大大滴不行的,不能图方便就少了代码

现在我们来写代码,代码很简单

 1     public GameObject targets;
 2     private Camera camera;
 3     
 4     void Start()
 5     {
 6         //获得主摄像机
 7         camera = Camera.main;
 8     }
 9 
10     void Update()
11     {
12         //设置旋转角度
13         targets.transform.rotation = camera.transform.rotation;
14     }

保存代码,将脚本挂到角色上,然后把NamePanel拖到参数targets

最后运行游戏,在看看效果,ok,完美

 

最后总结一下:

代码上是非常简单的,看我代码就知道了,可以说就只有一句代码。。。

主要就是设置层,层一定要分清楚,很重要!

本文地址:http://www.cnblogs.com/shenggege/p/4179012.html

posted on 2014-12-23 00:13  阿升哥哥  阅读(7296)  评论(0编辑  收藏  举报

导航