Video Tutorials

  1. Basic Tutorial (v.2.5.0+)
  2. SD & HD atlas switching (advanced)
  3. Packed Font (advanced)
  4. Catering to variable screen size

Old Tutorials (Earlier than NGUI 2.5.0)

  1. Part 1 – Basics (old)
  2. Part 2 – Advanced (old)
  3. Atlas Maker, Font Maker (old)

Other Videos

Step-by-step Tutorials

For the sake of these tutorials, I will assume that you already have the NGUI package installed in your project (or are in a brand-new one). I will also assume that you don’t just want to learn how to go from point A to point B, but also why you’re going there. I’ll try my best to explain the steps carefully, paying attention to everything that you will see along the way.

Let’s start by creating a brand new scene. The most basic UI is a 2D one, so we’ll start with that and work our way up.

  1. Step 1: Creating Your UI
  2. Step 2: Sprite
  3. Step 3: 9-Sliced Sprite
  4. Step 4: Tiled Sprite
  5. Step 5: Label
  6. Step 6: Button
  7. Step 7: Slider
  8. Step 8: Checkbox
  9. Step 9: Input
  10. Step 10: 3D
  11. Step 11: Popup List

这是中文版教程,感谢Minevr友情翻译:

Provided Examples

  1. UIAnchor(writeup)
  2. Interaction (writeup)
  3. Main Menu
  4. Controller Input
  5. Lights and Refraction (writeup)
  6. Draggable Window (writeup)
  7. Scroll View (clipped panel) (writeup)
  8. Scroll View (secondary camera) (writeup)
  9. Fancy Quest Log
  10. Localization
  11. Drag & Drop
  12. Chat Window (writeup)
  13. Character Inventory (writeup)

Script Documentation

Found here: http://www.tasharen.com/ngui/docs/

List of Core Components

  • Camera– Should be attached to each camera, contains the event system
  • Atlas– Texture atlas defining sprites
  • Font– Font atlas
  • Sprite– Widget that draws a sprite from the texture atlas
  • Label– Widget that draws a text label using the specified font
  • Panel– Manages a group of widgets and is responsible for creating the actual draw calls
  • Anchor– Can be used to anchor widgets to the sides of the screen, stretch them to fill the screen, and make pixel-perfect UIs.
  • Looking for more? Check the script documentation.

NGUI comes with a powerful event system that can be used with or without the rest of the kit, allowing your objects to receive most of the commonly used events such as OnHover, OnClick, OnDrag, etc without having components derive from any specific base class.

Some Other Notable Components and Tools

  • UIButtonPlayAnimation — Event receiver that lets you start a remote animation.
  • UIButtonTween — Event receiver that lets you start one or more remote tween scripts.
  • UICheckbox — Script that can be used to create checkboxes, radio buttons, toggle buttons, and combo boxes.
  • UICheckboxControlled — Very short and to-the-point scripts that let your checkboxes directly control the enabled state of remote scripts and game objects.
  • UIDragObject — This script makes it easy to drag something around — whether it’s a window or a 3D object.
  • UIPanelTool — Alt+Shift+P brings up this dockable window that should help you when working with a scene that has many panels in it.
  • Looking for more? Check the script documentation.

NGUI: Documentation的更多相关文章

  1. unity的坑

    http://dearymz.blog.163.com/blog/static/20565742013341916919/ 编辑器: Hierarchy窗口中是场景中的Game Object列表 Pr ...

  2. NGUI学习笔记(一)UILabel介绍

    来个前言: 作为一个U3D程序员,自然要写一写U3D相关的内容了.想来想去还是从UI开始搞起,可能这也是最直观同时也最重要的部分之一了.U3D自带的UI系统,也许略坑,也没有太多介绍的价值,那么从今天 ...

  3. NGUI裁剪模型和粒子

    效果预览 注:Cube上附着的绿色是我添加的粒子效果. 软件环境 NGUI 3.9.x Unity 5.1 x64 相关知识 RenderTexture RenderTexture是一种特殊的纹理,它 ...

  4. Unity NGUI添加UIRoot

    导入NGUI包后,菜单多出一个选项 "NGUI",选择其子选项 "options" -- "Reset Prefab ToolBar" ,在 ...

  5. NGUI之UIRoot——屏幕的自适应分辨率的计算

    //原来写在其他博客上的东西,搬迁 预备知识: 要明确的三个概念: 设计分辨率:在编辑器上开发UI使用的分辨率.我们所有的UI都是在这个分辨率下设计制作的. 显示区域分辨率:设备上所显示的UI区域在编 ...

  6. Shader实例:NGUI制作网格样式血条

    效果: 思路: 1.算出正确的uv去采样过滤图,上一篇文章说的很明白了.Shader实例:NGUI图集中的UISprite正确使用Shader的方法 2.用当前血量占总血量的百分比来设置shader中 ...

  7. Shader实例:NGUI图集中的UISprite正确使用Shader的方法

    效果: 变灰,过滤,流光 都是UI上常用效果. 比如: 1.按钮禁用时,变灰. 2.一张Icon要应付圆形背景框,又要应付矩形背景框.就要使用过滤的方式来裁剪. 避免了美术提供两张icon的麻烦,又节 ...

  8. OpenCASCADE Documentation System

    OpenCASCADE Documentation System eryar@163.com Abstract. Doxygen is the de facto standard tool for g ...

  9. NGUI 指定视口大小

    由于只是给Uinty开发插件,对Unity没有系统的学习,对Unity的很多功能都不是非常了解,幸得其他Unity同事的耐心教导,才不至于想崩头.记录一下,避免重复犯错. NGUI可以建立指定视口大小 ...

随机推荐

  1. 关于PCA算法的一点学习总结

    本文出处:http://blog.csdn.net/xizhibei ============================= PCA,也就是PrincipalComponents Analysis ...

  2. C# 网络编程 Part.1

    本人也是新手,对网络编程一窍不通,所以从今天开始我将学习网络编程的基础知识,在此一一贴出来,编辑成一个系列! 1.为自己复习巩固用 2.可以找到同时在学习网络编程的同学,一起讨论交流,促进学习效率及其 ...

  3. Centos6.5快速配置可用网卡

    原文链接: Centos6.5快速配置可用网卡 安装完成后,我们启动我们的系统,此时我们的系统,是没有连网的,IP设备,并没有被激活,如果我们使用ifconfig命令查看IP地址,就会发现,此刻的地址 ...

  4. Java--日期的使用

    Date 类: 最基础的日期时间类,返回一个相对日期的毫秒数.精确到毫秒,但不支持日期的国际化和分时区显示. Calender类: 相对于Date更加强大的时间类,是抽象类,提供了常规的日期修改功能和 ...

  5. setitimer()函数使用

    setitimer()为Linux的API,并非C语言的Standard Library,setitimer()有两个功能,一是指定一段时间后,才执行某个function,二是每间格一段时间就执行某个 ...

  6. 一步一步重写 CodeIgniter 框架 (5) —— 实现Controller,并加载Model

    CodeIgniter 框架采用MVC模式,而MVC模式中起纽带作用的就是C(控制器),在控制器的中通过加载模型获得数据,将数据传到视图中进行展示.本课将实现在控制器中加载模型. 1. 控制器的实现 ...

  7. Java NIO与IO

    当学习了Java NIO和IO的API后,一个问题立即涌入脑海: 我应该何时使用IO,何时使用NIO呢?在本文中,我会尽量清晰地解析Java NIO和IO的差异.它们的使用场景,以及它们怎样影响您的代 ...

  8. js中with、this的用法

    with 语句 为一个或一组语句指定默认对象. 用法:with (<对象>) <语句>; with 语句通常用来缩短特定情形下必须写的代码量.在下面的例子中,请注意 Math ...

  9. JQuery遍历json数组的3种方法

    这篇文章主要介绍了JQuery遍历json数组的3种方法,本文分别给出了使用each.for遍历json的方法,其中for又分成两种形式,需要的朋友可以参考下 一.使用each遍历 $(functio ...

  10. Gradle的简介与安装

    Gradle介绍 Gradle是一个基于JVM的构建工具,它提供了: 像Ant一样,通用灵活的构建工具 可以切换的,基于约定的构建框架 强大的多工程构建支持 基于Apache Ivy的强大的依赖管理 ...