Unity 3D 游戏引擎吧
共有回帖数
【交流】NGUI点击按钮弹出窗口
十万个为什么
弹出的窗口从画面中央出现，从小变大。窗口上自带按钮关闭按钮，点击这个按钮可以让窗口从大变小消失。刚接触NGUI，请大神指教
共有回帖数 0 个
欢迎来到本吧,您可以在此发帖和众多大咖交流学习.
登录直线网账号
【交流】Unity 脚本入门 个人经验及常用方法块
/tieba/content_4292.html
大家可以看一下
Copyright (C)
直线网 版权所有,All Rights Reserved.沪ICP备号NGUI制作游戏弹出框是怎样实现对界面覆盖？--QQ群:
NGUI制作游戏弹出框是如何实现对后面内容的遮罩的?
这是魔灵召唤的弹出框：
问：弹出框背后的内容是无法点击的，请问使用NGUI是如何实现的?
答：主要有2个方法，分别是：
第一种、在每个弹出框下面放一个巨大的boxColider把后面的东西统统挡住!
第二种、将这个弹出框设定在一个alertLayer层，将UICamera的even mask改为alertLayer来只接受这一层的事件
如果这2种方法还没解决你的问题，可以点击《》，让专业老师来帮您解答！
首发地址: NGUI制作游戏弹出框是怎样实现对界面覆盖？_NGUI_丝路游戏美术
资源地址: （分享请保留)
相关教程列表：示例：为游戏界面添加昵称输入框NGUI从入门到实战大学霸
NGUI从入门到实战
示例：为游戏界面添加昵称输入框NGUI从入门到实战大学霸
示例：为游戏界面添加昵称输入框示例：为游戏界面添加昵称输入框NGUI从入门到实战大学霸
在首次玩游戏前，很多游戏都需要玩家自定义昵称，那么本小节就使用学到的知识，创建一个昵称输入框作为示例，如图2-63所示。
昵称输入框示例示例：为游戏界面添加昵称输入框NGUI从入门到实战大学霸
具体的操作步骤如下：
（1）在Hierarchy视图里，为Panel对象添加一个子对象，并命名为Nickname。
（2）在Hierarchy视图里，选中Panel对象下的Window子对象，然后按下快捷键Ctrl+D，来获得此对象的一个拷贝，将它命名为Background，并拖动到Nickname对象下。在Inspector视图里设置下列属性，效果如图2-64所示。
Depth：2；
Dimensions：440×120；
添加背景效果
（3）在Hierarchy视图里，为Nickname对象添加一个文本输入框Input，向导各属性的设置与上一小节相同。并在Inspector视图里，设置下列属性：
Box Collider组件下，Center属性：(0,0,0)；
Auto-save Key：Nickname；
Max Characters：25；
（4）为Input对象添加UIAnchor(Script)组件，并设置下列属性：
Container：Background；
提示：此Background是Nickname的子对象。
Pixel Offset：X：0，Y：-17；
完成以上设置以后，在Scene视图中看到的效果如图2-65所示。
Scene视图中的效果图示例：为游戏界面添加昵称输入框NGUI从入门到实战大学霸
提示：目前效果还显得十分乱，因为还没有设置Input的子对象：Label和Background。此处只是将Input对象定位到了背景中下方的位置，也就是Input对象绿色框线的位置。
（5）获取Title子对象Label的拷贝，然后将其拖动到Nickname对象下，在Inspectors视图里，完成下列设置：
设置Label文本框中的内容：[AAFFFF]Nickname；
Depth：3；
Container：Backgound；
提示：此Backgound是Nickname的子对象。
Side：Top；
Pixel Offset：X：0，Y：-32；
在完成以上设置以后，在Game视图中看到的效果如图2-66所示。
Game视图中看到的效果
（6）在Hierarchy视图里，选中Input的子对象Background，然后在Inspector视图里设置下列属性：
Pivot：中点；
Transform组件下P：(0,0,0)；
Depth：3；
Dimensions：400×26；
在完成以上设置以后，在Game视图中看到的效果如图2-67所示。
Game视图中看到的效果
（7）在Hierarchy视图里，选中Input的子对象Label，然后在Inspector视图里设置下列属性：
Pivot：中点；
Transform组件下P：(0,0,0)；
Depth：4；
Label中的文本为：Enter your name here；
在完成以上设置以后，在Game视图中看到的效果如图2-68所示。
Game视图中看到的效果
（8）输入框已经设置好了，接下来就是输入框在整个游戏背景中的位置了，目前它位于游戏背景的正中央，接下来就要将它置于游戏背景中央靠上方的位置。首先为Nickname对象添加UIAnchor(Script)组件，然后设置下列属性：
Container：Window；
Side：Top；
Pixel Offset：X：0，Y：-220；
在完成以上设置以后，在Game视图中看到的游戏背景，效果如图2-69所示。
目前游戏背景的效果图示例：为游戏界面添加昵称输入框NGUI从入门到实战大学霸扫一扫，访问微社区
后使用快捷导航没有帐号？
签到成功!您今天第{todayrank}个签到，签到排名竞争激烈，记得每天都来签到哦！已连续签到:{constant}天，累计签到:{days}天
当前位置： &
_____________________________________________________________________________________________________________
问答求助版块规则：
　　1、问题尽量描述清楚
& && &2、代码要放在代码块里
& && &3、附件最好放到云盘，然后把链接放到TXT文档里，上传TXT文档。【最好没有附件，你懂得】
& && &4、本版块回复不得无意义，如：顶、呵呵、不错......以及擦边！【真的会扣分的哦】严重者，封IP！
& && &5、问题得到解决，请选择最佳答案。
& && &6、若问题是你自己解决了，可以联系管理员，返还蛮牛币，写下你的答案，另有蛮牛币奖赏。
_____________________________________________________________________________________________________________
查看: 973|回复: 14
NGUI制作游戏弹出框是如何实现对后面内容的遮罩的？
本帖为抢楼帖，欢迎抢楼!&
5840/1000排名<font color="#FF昨日变化主题帖子积分
熟悉之中, 积分 840, 距离下一级还需 160 积分
熟悉之中, 积分 840, 距离下一级还需 160 积分
蛮牛币1766
在线时间227 小时
本帖最后由 woaitmac1314 于
14:40 编辑
这是魔灵召唤的弹出框：
S.jpg (248.75 KB, 下载次数: 48)
14:39 上传
弹出框背后的内容是无法点击的，请问使用NGUI是如何实现的？
题主自己想到两种方式：
<font color="#、在每个弹出框下面放一个巨大的boxColider把后面的东西统统挡住！
<font color="#、将这个弹出框设定在一个alertLayer层，将UICamera的even mask改为alertLayer来只接受这一层的事件？
QQ截图48.png (23.57 KB, 下载次数: 33)
14:40 上传
请问各位在游戏中是怎么处理的？谢谢！
每日推荐：
7排名<font color="#FF昨日变化2主题帖子积分
在线时间7 小时
最简单的方法就是用collider直接挡住呗
每日推荐：
9排名<font color="#FF昨日变化主题帖子积分
蛮牛币3003
在线时间603 小时
单独的一个Panel，调高depth，在面板中添加一个简单的背景Sprite加上collier就行了
2104/150排名<font color="#FF昨日变化2主题帖子积分
初来乍到, 积分 104, 距离下一级还需 46 积分
初来乍到, 积分 104, 距离下一级还需 46 积分
在线时间17 小时
我采用的方法与你的方法1一样。
3237/300排名<font color="#FF昨日变化主题帖子积分
偶尔光临, 积分 237, 距离下一级还需 63 积分
偶尔光临, 积分 237, 距离下一级还需 63 积分
在线时间13 小时
方案1、在每个弹出框下面放一个巨大的boxColider把后面的东西统统挡住！
这个最好了. 简单易用
4312/500排名<font color="#FF昨日变化5主题帖子积分
四处流浪, 积分 312, 距离下一级还需 188 积分
四处流浪, 积分 312, 距离下一级还需 188 积分
在线时间103 小时
我是直接用的不同的panel
61300/1500排名<font color="#FF昨日变化主题帖子积分
蛮牛粉丝, 积分 1300, 距离下一级还需 200 积分
蛮牛粉丝, 积分 1300, 距离下一级还需 200 积分
蛮牛币2752
在线时间302 小时
加个collider是最简单的
7排名<font color="#FF昨日变化主题帖子积分
蛮牛币11812
在线时间799 小时
第一种思路较佳，一般做法是 你创建一个新的panel就自动在之前加一个遮罩层！
116/50排名<font color="#FF昨日变化7主题帖子积分
注册看看, 积分 16, 距离下一级还需 34 积分
注册看看, 积分 16, 距离下一级还需 34 积分
在线时间3 小时
方案1，在ui基类里弄个不同层的枚举就好
12排名<font color="#FF昨日变化主题帖子积分
蛮牛币5168
在线时间336 小时
一般情况下，加一个sprite作为此弹出框背景，再在此背景上加一个boxcollider就可以了
5833/1000排名<font color="#FF昨日变化主题帖子积分
熟悉之中, 积分 833, 距离下一级还需 167 积分
熟悉之中, 积分 833, 距离下一级还需 167 积分
蛮牛币1294
在线时间186 小时
创建个空对象，加上uisprite和collider，再将空对象作为你这个弹出界面的子物体就行了
61031/1500排名<font color="#FF昨日变化1主题帖子积分
蛮牛粉丝, 积分 1031, 距离下一级还需 469 积分
蛮牛粉丝, 积分 1031, 距离下一级还需 469 积分
蛮牛币3468
在线时间187 小时
方案1，在ui基类里弄个sprite作为弹窗的背景，在此背景加boxcollider, 就ok
5706/1000排名<font color="#FF昨日变化1主题帖子积分
熟悉之中, 积分 706, 距离下一级还需 294 积分
熟悉之中, 积分 706, 距离下一级还需 294 积分
在线时间146 小时
也是方案１。最簡單又實用的方法。
299/150排名<font color="#FF昨日变化10主题帖子积分
初来乍到, 积分 99, 距离下一级还需 51 积分
初来乍到, 积分 99, 距离下一级还需 51 积分
在线时间6 小时
看来加个碰撞器是众望所归啊
73091/5000排名<font color="#FF昨日变化主题帖子积分
日久生情, 积分 3091, 距离下一级还需 1909 积分
日久生情, 积分 3091, 距离下一级还需 1909 积分
蛮牛币8581
在线时间410 小时
来自Mobile---
加个碰撞把后面区域的事件屏蔽，再弄个半透明背景，达到模糊效果
购买游戏蛮牛书籍
游戏蛮牛给予质量较高、影响力较大的unity相关技术开发者的荣誉称号
社区QQ达人
使用QQ帐号登录论坛的用户
连续签到30天示例原型下载：
实现目标：
点击按钮弹出带遮罩层的对话框；
页面上下左右滚动时，弹出的对话框水平和垂直始终居中。
实现步骤如下：
1、 拖入编辑区2个矩形，并点右键—转换—转换为动态面板；
2、 双击其中一个动态面板设置标签为“遮罩层”（看个人喜好随便命名），并双击状态1进入编辑；
3、 点击状态1里面的矩形，设置大小与网站页面大小相同，以便完全遮盖；然后，设置矩形边框为“无”；最后设置填充色的透明度为50%（看个人喜好），并选择填充色为灰色（看个人喜好）；
4、 关闭状态1编辑页面，选择另外一个动态面板，按照第2步命名并进入编辑；
5、 设置里面的矩形为合适大小，并拖入一个按钮（或者矩形/文本面板）作为关闭按钮；设置按钮onclick事件为隐藏遮罩层和当前编辑的这个动态面板；
6、 关闭当前的编辑页面，再次选择作为对话框的这个面板—右键—编辑选项—固定到浏览器…；
7、勾选固定到浏览器窗口，水平和垂直都选择居中，并勾选“保持在前面”；
8、 拖入一个按钮（或者矩形/文本面板）到编辑区，双击输入文字“登录”；然后点右键—顺序—置于底层；设置按钮onclick事件为显示遮罩层和对话框这两个动态面板；
9、 按着ctrl选择两个动态面板（或者挨个设置），点右键—编辑选项—设为隐藏。
10、 好了，生成原型就能看到效果了。
扩展：固定到浏览器选项可以让动态面板无论页面怎么滚动，总是停留在一个位置，那么网站两侧的对联广告，或者浮在页面上的一些按钮、图片等，都能用这种方式来实现。
~~~~~~~~~~~~
~~~~~~~~~~~~
小楼老师再出新作，倾力打造Axure RP 8精品课程系列，全新的套路，经典的姿势，更舒爽，更润滑，更紧致，更销魂，想体验这种欲罢不能的学习感觉？快从下面进入！
《AxureRP 8 入门与实战 - 入门篇》------从零入门的最佳课程------
《AxureRP 8 入门与实战 - 案例篇》------实战手册的同步视频------
转载请注明： &
or分享 (0)