实用热门插件—NGUI官方视频教程 - 蛮牛教育 - 国内最大的Unity在线学习平台|Unity培训|Unity3d培训|Unity视频学习|Unity教程 Unreal 虚幻 AR VR - Powered By EduSoho
暂无课程简介
学完了课时
学完了课时
开始学习课时
学完了课时
开始学习课时Unity3D插件之NGUI核心 UI 组件和功能详细使用步骤 - 简书
Unity3D插件之NGUI核心 UI 组件和功能详细使用步骤
一、NGUI 介绍
1.NGUI 插件安装
首先创建一个新的 Unity 工程项目，导入 NGUI 插件资源包。
导入 NGUI 后，Unity 的菜单栏会出现一个“NGUI”菜单，这个菜单包含了
NGUI 所有的操作功能。
2.NGUI 插件目录结构
Editor：编辑器扩展
Examples：示例工程
Resources：资源文件
Scripts：脚本组件
[Unity 是基于组件形式的引擎，任何功能都是一个独立的组件；
组件其实就是一个类，一个对象，一个脚本文件；
NGUI 中所有的 UI 也都是通过组件的形式体现的。]
二、NGUI 基本使用方法
1.NGUI Bug 修复
Bug 出现的环境：Unity5.4.1 + NGUI3.10.0
Bug 信息：Ignoring menu item NGUI because it is in no submenu!
修复步骤：
①找到并打开 NGUI 插件中的“NGUIMenu.cs”脚本文件；
②将 715,716 两行代码注释或者删掉;
③保存修改后的脚本，并重启 Unity 开发环境。
2.使用 NGUI 显示文字
1.简单思考
之前我们想显示一个简单的 3D 模型，我们可以创建一个 Cube 物体。
那么我们想显示文字，那么需要创建什么哪？而且我们使用的是 NGUI？
和文字沾边的单词有 Text 和 Lable。
操作步骤：
NGUI--&Create--&Label
创建一个用于显示文字的“游戏物体”。
切换到 Game 面板，我们就可以看到“New Label”。
2.NGUI 层次结构
UI Root（所有的 NGUI 元素都是这个的子物体）
|---Camera（用于渲染 NGUI 的摄像机）
|---Lable（Lable 游戏物体）
|---More UI（更多的 UI 游戏物体）
3.NGUI 操作细节
①在 Scene 视图“紫色”的矩形，就是我们 NGUI 的操作范围，其实也就是
UI Root 的范围（鼠标选中 UI Root，这个矩形区域会高亮显示）。
②我们可以点击 Scene 视图上方的“2D”按钮，切换到 2D 编辑模式。
③在 2D 模式下，鼠标选中 UI Root，紫色矩形也会高亮，现在将鼠标放到矩
形上，点击鼠标右键，会出现 NGUI 的操作菜单，这个菜单我们后期会大量且
频繁的使用。
④摄像机的图标会影响到我们的操作，可以将这个图标调小。
点击 Scene 面板右上角 Gizmos，3D Icons 选项，调小即可。
3.Prefab Toolbar
1.打开 Prefab Toolbar
NGUI--&Open--&Prefab Toolbar
2.Prefab Toolbar 简介
Prefab Toolbar ：(NGUI)预制体工具栏，其实就是 NGUI 提供的一些现成
的 UI 功能元素的预制体文件，我们可以直接鼠标单击选中，然后往 Scene 面板拖拽。
三、基本组件之 UILabel 面板控制
1.字体文件
1.字体图集
将所用到的文字处理成一张图片进行使用，这种比较适合英语国家。
2.TTF 字体
直接使用 TTF 格式的字体进行文字显示。
2.UILabel 面板属性
1.Font Size（字体大小）
控制文字显示的大小，以及基本样式[正常，粗体，倾斜，粗体+倾斜]
2.Text（文字）
UILable 要显示的文字，可以输入多行
3.Modifier（调节器）
控制英文显示状态，正常状态，大写状态，小写状态
4.Overflow（溢出）
当文字大小超出了 Widget 中 Size 属性的大小时，如何处理显示。
ShrinkContent：收缩内容 [再大也无效]
ClampContent：夹持内容 [能显示几个字就显示几个字]
Use Ellipsis：是否使用省略符
ResizeFreely：调整自由 [Widget 中的 Size 自动同步 Font Size]
ResizeHeight：调整高度 [宽度固定，高度自动调整]
5.Alignment（对齐方式）
设置文字的对齐方式
6.Gradient（渐变颜色）
设置文字从上到下的颜色渐变
7.Effect（特效）
设置文字特效，比如：颜色描边，投影
8.Spacing（间距）
设置文字与文字之间的间距大小
9.Color Tint（色彩化）
设置文字显示的颜色
四、基本组件之 UILabel 代码控制
1.文字展示案例
1.元宝与钱币数显示
重点设置 UILabel 的中心点，以及 Overflow 样式。
中心点水平轴向为左侧或者右侧；
Overflow 一般设置为 ResizeFreely。
2.物品描述信息
文字在一个固定区域内显示。
重点设置 UILabel 的中心点，以及对齐方式还有 Overflow 样式。
中心点设置为垂直轴向的顶部；
对齐方式为左对齐；
Overflow 为 ResizeHeight。
2.代码控制 UILabel
1.代码控制金币数
代码查找到对应的游戏对象，修改游戏对象身上的 UILabel 组件的 Text 属性。
2.代码控制物品描述
方法步骤同上
NGUI 代码中换行“\n”
五、NGUI 图片管理工具 AtlasMaker
1.AtlasMaker 制作图集
1.什么是 Atlas？
Atlas：图集，图片的一个集合，或者说打包格式。NGUI 中的 UISprite 组件
显示图片，需要用到图集，就和 UILabel 显示需要用到字体是一样的道理。
2.什么是 AtlasMaker？
AtlasMaker：图集制作器，NGUI 提供的打包 Atlas 的工具。
3.AtlasMaker 制作图集步骤
①打开 AtlasMaker 工具，点击“new”按钮；
②将需要打包成 Atlas 的图片选中；
②点击“Create”按钮，给新图集命名保存。
4.Atlas 结构分析
每一个 Atlas 都是由三个文件组成：
xxx.png：贴图文件，小图片拼接成的一张大图片
xxx.mat：材质球文件，使用 xxx.png 为素材制作的材质球
xxx.prefab：图集文件，使用 xxx.mat 为素材制作的图集文件
依赖关系：png--&mat--&prefab
2.图集常用修改操作
1.往图集中增加新图片
①打开 AtlasMarker，选中需要修改的图集；
②选中需要增加的图片，然后点击“Add/Update”按钮。
2.从图集中删除图片
①打开 AtlasMarker，选中需要修改的图集；
②点击图集中图片后面的“X”按钮，然后 Delete。
六、基本组件之 UISprite 面板控制
1.UISprite 显示图片
①创建 UISprite 组件，步骤：NGUI--&Create--&Sprite；
②选择图集，选择要显示的图片；
③Widget 中点击“Snap”按钮，让图片原始大小显示；
④Widget 中“Aspect”选中“Based On Width”，便于等比例调整图片
2.UISprite 面板属性
1.Type（类型/模式）
Simple：简单模式 默认展示效果
Sliced：九宫模式 适合于按钮背景图处理 [演示九宫处理]
Tiled：平铺模式 使用该图片平铺 Widget 中 Size 的区域
Flip：进度模式 最复杂的一种图片模式
|---Fill Dir 填充方向
|---Fill Amount 填充量
|---Invert Fill 翻转填充
七、基本组件之 UISprite 代码控制
1.图片案例展示
1.金币元宝界面制作
导入相关的素材图片，更新图集，使用 UISprite 和 UILabel 制作界面。2.代码控制 UISprite
1.动态创建 UISprite
分析手动添加 UISprite 时的步骤，然后使用代码还原整个步骤。
2.动态控制 UISprite 的属性
获取到当前的 UISprite 对象，以“.”的形式调出属性进行赋值，属性的名称
和 Inspecctor 面板上组件属性名基本保持一致。
八、基本组件之 UIButton 面板控制
1.UIButton 制作按钮
1.基础说明
在 UI 界面制作过程中，UILabel 用于显示文字，UISprite 用于显示图片，无
论多复杂的 UI 界面，都是由最基础的文字+图片的形式展示（制作）的。
UI 界面的主要功能有两个：1&展示数据；2&人机交互。
而最核心的交互就是点击，使用鼠标或者手指点击 UI，而能接收点击的 UI 组件
叫做 UIButton。我们可以在 UILable 和 UISprite 的基础上附加 UIButton
组件制作出我们的 UI 按钮。
2.按钮制作步骤
①首先展现一张图片或者一段文字；
②Attach--&BoxCollider，确定可以点击的区域，其实点击按钮就是这个这
个 Collider 区域进行交互的；
③Attach--&ButtonScript，附加按钮组件，按钮制作到此完成。
2.UIButton 面板属性
1.Colors 数组
使用颜色来描述按钮的四种状态。
如果不想让颜色影响图片的效果，可以将四种颜色全部选择为白色。
2.Sprites 数组
组使用图片来描述按钮的四种状态。
3.按钮四种状态
①Normal(*)：默认原始状态;
②Hover：经过停留状态;
③Pressed(*)：按下状态;
④Disabled：不可用状态；
九、基本组件之 UIButton 代码控制
1.按钮点击事件绑定
1.面板属性栏绑定
①创建一个代码文件，定义一个公开的方法，挂载到一个游戏物体上；
②将该脚本拖拽到 UIButton 的 OnClick 事件上（注意看我的操作演示）。
2.代码绑定
①创建一个代码文件，挂载到按钮游戏物体上；
②定义一个叫做 OnClick（）的方法。
2.按钮交互声音
1.UIPlaySound 组件
当我们和按钮进行交互（比如：点击）的时候，可以播放一个点击声音，起到一
个辅助反馈的作用。
2.操作步骤
①Attach--&Play Sound Script 添加组件；
②Audio Clip 指定一个声音文件；
③指定 Trigger 触发该声音播放的事件，常用的是 OnClick。
十、UI 动态加载
1.原理介绍
在实际项目开发过程中，UI 界面制作好以后会拖拽成为一个 Prefab 资源，和
Scene 场景分离，在实际加载到该场景的时候，动态的加载显示 UI 界面。
这样可以使得 UI 和 Scene 进行分离，好处是很大的，分离后我就可以让不同
的人编辑制作不同的部分，否则的话，UI 和 Scene 在一起，多人编辑的时候，
项目是没法合并（SVN，Git）的。
2.操作演示
①将制作好的 UI 面板拖拽成为一个 Prefab 资源，放到 Resources 文件夹下；
②使用 Resources.Load()将该资源加载到内存中；
③实例化该 UI 资源对象，放到 UIRoot 下完成显示；
3.相关 API
NGUITools.AddChild(父对象, 子对象); NGUI 提供的一个实例化物体，设置子物体的一个内置函数，操作 UI 尽量使用
该 NGUI 封装的函数。
CreateUISprite
using UnityE
using System.C
/// &summary&
/// 使用代码控制UISprite 组件
/// &/summary&
public class CreateUISprite : MonoBehaviour {
private Transform m_T
void Start () {
//获取游戏物体的transform物体组件
m_Transform=gameObject.GetComponent&Transform&();
//实例化对象
GameObject uiSprite = new GameObject("TonyWan");
//设置父物体；
uiSprite.GetComponent&Transform&().SetParent ( m_Transform);
//重置Scale；
uiSprite.GetComponent&Transform&().localScale = Vector3.
//动态添加图集
UISprite sprite=uiSprite.AddComponent&UISprite&();
//读取图集 资源加载
UIAtlas atlas=Resources.Load&UIAtlas&("GameAtlas");//参数1：表示自定义的图集名称；
//给组件指定图集
sprite.atlas=
//给组件指定图片
sprite.spriteName="";
public class MyButton : MonoBehaviour {
//第一种点击事件方法
//定义一个公开button点击事件
public void ButtonClick() {
Debug.Log("我是Button按钮被点击了");
//第二种点击事件方法
//代码绑定点击事件 OnCLick内置点击事件 写这个就会点击
public void OnClick(){
Debug.Log("我是代码绑定点击事件");
UILabelTest
public class UILabelTest : MonoBehaviour {
//声明一个持有引用
private UILabel goldN
private UILabel item_L
void Start()
//查找值物体
goldNumber = GameObject.Find("goldNumber").GetComponent&UILabel&();
//对文本进行赋值
goldNumber.text = "";
//对字体颜色改变
goldNumber.color = Color.
void Update () {
//按下空格键 进行描述切换
if (Input.GetKeyDown(KeyCode.Space))
item_Label=GameObject.Find("item_Label").GetComponent&UILabel&();
item_Label.text = "TonyWanTonyWanTonyWanTonyWanTonyWan\n我要换行了！TonyWanTonyWanTonyWanTonyWanTonyWanTonyWanTonyWan";
public class UIManager : MonoBehaviour
//声明一个持有引用，用来存贮加载后的预制体
private GameObject prefab_I
void Start () {
//存贮预制体
prefab_Info=Resources.Load&GameObject&("Info");//泛型 GameObject 参数1：预制体的名称
//NGUI自带API 把预制体加载到场景中去 有重载
NGUITools.AddChild(gameObject, prefab_Info);//参数1：父物体 参数2：子物体
一个无聊的人，经常做些无聊的事儿，撸代码，喂马，劈柴，周游世界......更喜欢看妹子~哈哈哈...AR/VR技术交流群：NGUI插件从入门到高级
无法运行，请执行js权限
22.动态加载UI元素
下载APP离线观看
C#是微软公司在2000年7月发布的一种全新且简单、安全、面向对象的程序设计语言，是专门为.NET的应用而开发的语言，并且做为Unity3d的脚本语言之一，。它吸收了C++、Visual Basic、Delphi、Java等语言的优点，体现了当今最新的程序设计技术的功能和精华。C#继承了C语言的语法风格，同时又继承了C++的面向对象特性。课程全面讲述了C#基础知识，带您进入C#的精彩世界， 了解C#的基础知识及如何快速学习C#，课程内容主要分为以下几部分。
1. C#基础语法，流程控制语句。（变量的定义，数据的类型，字符串处理，集合的处理）
2. C#的面向对象编程（类的定义，方法的应用，四种传参方法，字段的封装，方法的重构，类的继承，静态类，抽象类，接口等）
3. C#的IO处理，事件委托，多线程开发，异常处理等
4. C#对于XML的处理（游戏有可能有Xml的配置文件，需要读取操作）
个人介绍：
钟勇：多年一线.net开发经验以及软件培训经验，成都微软技术中心技术专家之一，国家信息安全产业基地（西部）技术顾问。精通c#技术，php技术，参与项目涉及电子政务系统、网上银行、ERP、CRM、OA等。
从零开始一步一步讲解Unity3D，介绍引擎的方方面面，在学习完本课程后，同学们能熟悉合和了解整个Unity3D的操作流程和方法，能正式开始游戏项目的研发了。
从零开始一步一步讲解Unity3D，介绍引擎的方方面面，在学习完本课程后，同学们能熟悉合和了解整个Unity3D的操作流程和方法，能正式开始游戏项目的研发了.
Unity3D是当前最流行的次世代3D游戏引擎之一，它强大高效跨平台，是当前全球多款3D游戏(PC或移动端)采用的引擎。本套课程基于学员已经对U3D有了最基本的了解和使用知识，并期望能充分运用U3D提供的基本组件开发一个完整的游戏客户端。
本课程将全面的讲解U3D各种基本组件的使用方法，更重要的是其背后的实现原理，性能以及在实际项目中的应用经验，并逐步串联出一个基本的游戏demo。
只看我参与的
加载更多↓
素材和源代码
素材和源代码
选择反馈类型
请选择分类
请选择反馈类型
你还可以输入200字
请留下你的宝贵意见！～
请留下正确的电话号码，以便我们能帮助你！
滑动完成验证
请滑动进行验证
感谢你的反馈，你的支持永远是我们前进的动力！
亲爱的学员
该课程还有更完整的职业课程大纲哦~
体系化学习，会有更好的学习效果！
直通班课程
抱歉，该课程视频仅限该直通班学员观看哦~
立即报名，您可享有
免费观看所有课程视频
智能在线学习系统
名师小班指导
全国就业服务
还没有账号？
其他方式登录
滑动完成验证
重发验证码
手机短信验证码已发送，请查收！
有一位课程导师想与你聊聊
客服热线 400-862-8862Particle 2D For NGUI 【UI特效必备】
查看: 4038|回复: 74
欢迎来到CG模型王伐木累！
才可以下载或查看，没有帐号？
亲测没问题完全可用。
不过必须用比较新的NGUI和unity3d。
测试UNITY3D4.53以下不能使用。
1.jpg (110.87 KB, 下载次数: 11)
09:41 上传
2.jpg (47.74 KB, 下载次数: 9)
09:41 上传
3.jpg (61.7 KB, 下载次数: 4)
09:40 上传
4.jpg (16.61 KB, 下载次数: 6)
09:40 上传
游客，如果您要查看本帖隐藏内容请
上一篇：下一篇：
看起来很牛呗的样子啊
楼主发贴辛苦了，谢谢楼主分享！
正好需要！！！！！！！！！！！！！
CG模型王，很给力呀！
找了好久，終於找到這個資源
帥喔帥喔帥喔帥喔帥喔帥喔帥喔帥喔帥喔帥喔帥喔帥喔帥喔帥喔
啥也不说了，楼主就是威武！
真的很漂亮~我喜欢！
很不错的资源
一个专注CG模型的网站
赶快加入我们吧 !
反馈建议：hi_
工作时间：周一到周六 09:00-20:00
Copyright &&&&&&&Powered by&&&技术支持：&&&&在许多类型游戏中我们经常会使用到背包，利用背包来设置相应角色属性，多了背包也会让游戏增色拓展不少。
那在Unity3D游戏开发中该如何编写背包系统呢？因为有高人开发了NGUI插件，因此我们进行简单编写代码设置即可实现一个简单的背包功能了。
新建一个工程PackageDemo
导入NGUI包（最新版3.9.8版的正版89刀）
准备好图片素材，使用NGUI将其打包成图集
简单背包功能实现
第一步，添加NGUI控件，使用素材
项目目录以及场景列表如下：
要注意的是：
Package、Cell和Obj都是NGUI的Sprite控件
Cell01-Cell09都设置了名为&Cell&的tag
UI Root设置了名为&UIRoot&的tag
Package、Cell和Obj都添加了Box Collider组件
第二步，给Package添加NGUI脚本UI Drag Object
添加在脚本使Package可以被拖拽移动。
第三步，给Obj添加自定义脚本MyDragAndDrop
直接在Obj的属性面板add component添加脚本 MyDragAndDrop.cs
打开并编辑脚本：
令MyDragAndDrop继承UIDragDropItem
重写OnDragDropRelease方法
更改后的MyDragAndDrop脚本代码如下：
using UnityE
public class MyDragAndDrop : UIDragDropItem {
protected override void OnDragDropRelease(GameObject surface)
base.OnDragDropRelease(surface);
if (surface.tag == "Cell")
transform.parent = surface.
transform.localPosition = Vector3.
transform.parent = GameObject.FindGameObjectWithTag("UIRoot").
第三步，测试
到这里简单例子也就完成了。
可以看到，到我拖拽Obj在每个Cell的边缘时，Obj都会自动移至碰撞的Cell内，类似吸附功能。
上面的简单例子实现了物体被背包吸附装入的功能，通过检测Cell的子物体增加相应逻辑就可以实现背包和角色属性关联。
1.背包内物品栏的物品交换相互位置
给所有物品设置tag为 &Obj& ，如果物品拖拽释放时碰撞获取的对象tag为&Obj&，就设置交换物品的父级对象。
2.捡取物品到背包中
一般捡取得物品到背包其排序都是从左到右，从上到下填入空的物品栏中。
实现方式是将所有物品栏对象装载到GameObject的数组中。
通过循环判断物品栏是否有子对象，也就是判断物品栏的子列表数值是否大于0
若小于或等于0，就将物品的父对象设置为该物品栏，然后设置其相对父对象坐标为0
还有很多实现大家自由发挥吧
链接： 密码：zamk
阅读(...) 评论()