序言:这是张三疯第一次开始NGUI插件的学习,刚开始学习,肯定有很多漏洞,后期会及时的补上的。希望大家可以见谅,希望大佬多多指教。

扩充:为提供和我一样的小白找不到免费的NGUI插件,这里分享百度网盘的分享链接,注意只能用作学习使用,如需用在开发项目还是建议去unity的官网花几十美刀吧。

链接:http://pan.baidu.com/s/1kVDvvKV 密码:2jqt     这是3.11.4版本的,相对而言还是比较新的。

好啦,不说废话了,开始今天的正文吧,介绍第一个NGUI的控件:

一、UI Sprites 控件:

Sprites控件是NGUI的基础控件,几乎可以这么说所有的控件都可以基于Sprites控件添加 Box Collider然后进行附加相关的脚本组件来达到想要的插件效果。

1、首先为项目附加NGUI插件,导入NGUI的插件即可,开始已经给出了下载地址了,下载下来即可,添加完会在unity 的Project面板中出现如下几个文件夹:

Examples:这是实例文件夹,里面有相关的资源教学,是用来学习的。

ReadMe -3.6.8 :这是NGUI的版本号,我的是3.6.8的。

Resources:这是打包的资源文件夹,项目打包时会无条件的打包该文件夹中的资源。

Scripts;这是最主要的文件将爱,是NGUI的核心。

2、那么开始建立第一个Sprites精灵图片:

方法很多,我这里选择最简单的一种,打开菜单栏中的NGUI,然后打开Open-Prefabs Toolbar,然后在Prefabs Toolbarr窗口中,拖入背景的Prefabs到Hierarchy面板中.

(1)、

(2)、

3、选中 UI Root,然后将上面的拖拽工具设为移动工具,一定要是移动工具,不然无法在Sceen场景中添加相关的控件:

4、加下来在Screen场景视图中,右键单击,选择Create--Sprite,即可在场景中创建了一个 UI Sprite

5、在Inspector面板中会出现UI Sprite的控件:

6、这里介绍下相关的属性的意思,有些控件相同的属性在以后的就不加介绍了:

(1)、 Atlas:这是图集的选择,可以通过左下角的三角形进行项目所需图集的选择。(图集的制作在后面会介绍到的)

(2)、Sprite:这是在上面选择的图集中选择图集中的图片作为Sprite的背景。

(3)、Type:这是图片的类型,有5种,默认为Simple的,每种不同的图片类型又有不同的属性,这里一一介绍,也算是对自己的一次巩固了,不要强记,多操作:

3.1、Simple:普通类型,图片正常显示,当拉伸锚点的时候,图片也会被整体的拉伸。当为Simple则Filp(翻转选项)有5种选择;

3.1.1、Noting:不翻转

3.1.2、Horizontally:水平翻转

3.1.3、Vertically:竖直翻转

3.1.4、Both:既水平翻转又垂直翻转

3.2、Sliced:切片类型,在拉伸图片的时候,可以通过九宫格进行设置,使图片的边缘不会出现钝化,后面作为一个重点讲,这里先忽略了。

3.3、Tiled:平铺类型,精灵的尺寸保持导入时的大小不变,当把精灵进行拉伸时会以精灵进行填充。

3.4、Filled:填满模式,可以设置图片填充一块区域的方式,当选择该选项的时候会有以下三个选项;

3.4.1、Fill Dir :填充的方式

3.4.2、Fill Amount :设置填充的比例

3.4.3、Invert Fill ;设置填充的方向,不勾选为正方向,反之为反方向。

4、Color Tint:这是对图片进行颜色的渲染,可以自由设置。

5、Widget模块;  这是NGUI的控件组件都具有的一个模块,

5.1、Color:可以整理改变控件的颜色和透明度。

5.2、Privot:锚点设置,默认为中心点,有左上,顶中,右上,中兴,中右,左下,底中,右下一共是9个点。

5.3、Depth:深度设置

5.4、Dimensions:尺寸,指的是控件的像素尺寸。

5.4、 AspectTation:宽高比

6、Anchors:控件位置适配的锚点设置,后面会详细解释。

NGUI_01的更多相关文章

随机推荐

  1. 2D特效和3D特效

    2D居中效果 div{ width: height: backgroundcolor: position:absolute; left:50%; top:50%; transform:translat ...

  2. PyCharm 2017 免费 破解 注册 激活 教程(附 License Server 地址)(Python 编辑器 IDE 推荐)

    许多朋友都在问如何破解 PyCharm 2017 Professional 专业版,咪博士对此是坚决反对的! 不到万不得已,请不要这样做.破解之前,请拖到文章末尾,思考几个问题,想明白你确实需要这样做 ...

  3. WSGI框架及Paste+Pastedeploy+route+webob开发

    一.前言 WSGI服务器 一个Web服务器网关接口 (WSGI)服务器实现了WSGI接口的Web服务器端运行的Python的Web应用程序. 为什么需要WSGI? 传统的Web服务器不理解或有任何方式 ...

  4. C++内联函数(03)

    在C++中我们通常定义以下函数来求两个整数的最大值: 代码如下: int max(int a, int b){ return a > b ? a : b;} 为这么一个小的操作定义一个函数的好处 ...

  5. LeetCode 162. Find Peak Element (找到峰值)

    A peak element is an element that is greater than its neighbors. Given an input array where num[i] ≠ ...

  6. LeetCode 100. Same Tree (相同的树)

    Given two binary trees, write a function to check if they are equal or not. Two binary trees are con ...

  7. 理解typename的两个含义

    理解typename的两个含义 问题:在下面的 template declarations(模板声明)中 class 和 typename 有什么不同? template<class T> ...

  8. Django开发小型站之前期准备(一)

    语言:python3.5 工具:JetBrains PyCharm virtualenvwrapper优点: 1.使不同的应用开发环境独立 2.环境升级不影响其他应用,也不会影响全局的python环境 ...

  9. BZOJ-1968

    1968: [Ahoi2005]COMMON 约数研究 Time Limit: 1 Sec  Memory Limit: 64 MBSubmit: 2308  Solved: 1768[Submit] ...

  10. Game of Connections

    Game of Connections Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) ...