超详细的基础教程传送门:(持续更新中)

Unity UGUI之Canvas&EventSystem:http://blog.csdn.net/qq992817263/article/details/51753844

Unity UGUI基础之Text:http://blog.csdn.net/qq992817263/article/details/51753864

Unity UGUI基础之Image:http://blog.csdn.net/qq992817263/article/details/51754189

Unity UGUI基础之Button:http://blog.csdn.net/qq992817263/article/details/51754381

Unity UGUI基础之Toggle:http://blog.csdn.net/qq992817263/article/details/51754442

Unity UGUI基础之Slider、Scrollbar:http://blog.csdn.net/qq992817263/article/details/51754463

Unity UGUI基础之InputField:http://blog.csdn.net/qq992817263/article/details/51754493

Unity UGUI的教程好少,幸亏找到一个UGUI的Demo,看了几个例子,以下是一些简单的学习笔记:

1.导入UI图片资源

2.设置参数:

TextureType(纹理类型) 精灵 2D and UI

SpriteMode(精灵模式)  Single(单)

multiple(多)

PackingTag(打包标签)

PixelsPer Unit(像素单位)  100(基本上都是100)

Pivot(枢轴)     Center(中间)

Custom(自定义)

GenerateMip Maps                 产生MIP映射(Mip映射 (Mip-mapping):Mip-mapping的核心特征是当物体的景深方向位置发生变化时,Mip映射根据不同的远近来贴上不同大小的材质贴图,比如近处贴512x512的大材质,而在远端物体贴上较小256*256的贴图。这样不仅可以产生更好的视觉效果,同时也节约了系统资源。)

FilterMode(过滤模式)             Point(点)

Bilinear(双线性)

Trilinear(三线性)

3. Canvas(画布)      创建一个画布

CanvasScaler(Script)      Ui Scale Mode        ScaleWith Screen Size(根据屏幕大小进行缩放)

4.Panel(面板)          创建一个面板/背景

Stretch(拉伸)点击图标有很多方式选择

Image图片需要经过1 2步才能选择图片后面有RawImage可以直接添加纹理

5.Text(文本)

LineSpacing            行间距

HorizontalOverflow        Wrap受限制

Overflow不受限制

VerticalOverflow             Truncate受限制

Overflow不受限制

6. Slider(滑动条)

Background  
背景

FillArea           滑动遮盖的区域

HandleSlide Area
滑块

Transition         (过渡)                Color Tint(颜色色彩)

SpriteSwap(精灵互换)

Animation(动画)

这些都是控制滑块的

WholeNumbers              整数

7. Scrollbar(滚动条)                         参照滑动条

8. Toggle(选择框)

IsOn                 表示是否选择状态

Group               为None表示多选框,不受限制,不为None表示在一个组内为单选框。

9. ToggleGroup(选择框组)

与8选择框结合使用,选择框里的Group赋值这个选择框组的话,就代表他们在同一个组内。

创建一个Panel,改名为ToggleGroup,移除Iamge和CanvasRenderer,添加一个组件Toggle
Group

10. InputField(输入文本框)

11. ScrollView(滚动视图)

创建一个Panel,改名为ScrollView,添加一个ScrollRect组件,再添加一个Mask(遮罩)组件。

在ScrollView下创建一个Panel,改名为Content,移除移除Iamge和CanvasRenderer,将Rect
Transform,改为以下的这个,设置高度。

在Content下,添加RawImage,在RawImage中添加一张图片

创建一个Scrollbar,与ScrollView同级

在ScrollView上,将Content组件拖在ScrollRect的Content中,将Scrollbar拖在Scroll
Rect的Vectical Scrollbar中

12.图片拖拽,从一个方格中拖拽到另外一个方格

需要拖拽的图片,加DragMe组件

被拖拽的区域,加DropMe组件

ContainerImage                       容器的图像    拖拽在上面改变颜色

ReceivingImage                        接收图像        改变拖拽的图像

13.图片拖拽,在一个区域内拖拽图片

Iamge绑定Drag Panel组件,表示可拖拽的物体,Iamge上一层Panel表示可拖拽物体的背景,Iamge上一层Panel再上一层Panel,表示当前可拖拽的区域范围

1表示最上层的panel,表示当前可拖拽的区域,2、3表示可以拖拽的物体,3表示鼠标点击拖拽的区域

14.页面布局

VecticalLayout Group             纵向布局

HorizontalLayout  Group     横向布局

GridLayout  Groud                 网格布局

LayoutElement                          布局元素

这些都是控制加载这些组件下的子物体

15.需要实现类似NGUI的ITween功能,用Animation实现

Unity UGUI的更多相关文章

  1. Unity UGUI —— 无限循环List

    还记得大学毕业刚工作的时候是做flash的开发,那时候看到别人写的各种各样的UI组件就非常佩服,后来自己也慢慢尝试着写,发现其实也就那么回事.UI的开发其实技术的成分相对来说不算多,但是一个好的UI是 ...

  2. Unity UGUI图文混排源码(三) -- 动态表情

    这里是根据图文混排源码(二)进一步修改的,其他链接也不贴了,就贴一个链接就好了,第一次看这文章的同学可以先去看看其他几篇文章 Unity UGUI图文混排源码(二):http://blog.csdn. ...

  3. Unity UGUI图文混排源码(二)

    Unity UGUI图文混排源码(一):http://blog.csdn.net/qq992817263/article/details/51112304 Unity UGUI图文混排源码(二):ht ...

  4. Unity UGUI图文混排源码(一)

    Unity UGUI图文混排源码(一):http://blog.csdn.net/qq992817263/article/details/51112304 Unity UGUI图文混排源码(二):ht ...

  5. Unity UGUI实现图文混排

    目前在unity实现图文混排的好像都是通过自定义字体然后在文本获取字符的位置,用图片替换掉图片标签,这样对于支持英文来说,并没有什么影响.然后对于中文来说就是一个相当麻烦的事了,毕竟图文混排多用于游戏 ...

  6. Unity UGUI Layout自动排版组件用法介绍

    Unity UGUI布局组件 本文提供全流程,中文翻译. Chinar 坚持将简单的生活方式,带给世人!(拥有更好的阅读体验 -- 高分辨率用户请根据需求调整网页缩放比例) Chinar -- 心分享 ...

  7. Curved UI - VR Ready Solution To Bend Warp Your Canvas 1.7,1.8,2.2,2.3 四种版本压缩包(Unity UGUI曲面插件),可以兼容VRTK

    Curved UI - VR Ready Solution To Bend Warp Your Canvas 1.7,1.8,2.2,2.3 四种版本压缩包(Unity UGUI曲面插件) 可以兼容V ...

  8. Unity UGUI鼠标穿透UI问题(Unity官方的解决方法)

    简述 最近在用UGUI的时候遇到了鼠标穿透的问题,就是说在UGUI和3D场景混合的情况下,点击UI区域同时也会 触发3D中物体的鼠标事件.比如下图中 这里给Cube加了一个鼠标点击改变颜色的代码,如下 ...

  9. Unity ugui屏幕适配与世界坐标到ugui屏幕坐标的转换

    我们知道,如今的移动端设备分辨率五花八门,而开发过程中往往只取一种分辨率作为设计参考,例如采用1920*1080分辨率作为参考分辨率. 选定了一种参考分辨率后,美术设计人员就会固定以这样的分辨率来设计 ...

随机推荐

  1. JAVA面向对象-----内部类的概述

    JAVA面向对象-–内部类的概述s 将类定义在另一个类的内部则成为内部类.其实就是类定义的位置发生了变化. 在一个类中,定义在类中的叫成员变量,定义在函数中的叫成员函数,那么根据类定义的位置也可以分为 ...

  2. ORACLE数据库学习之备份与恢复

     oracle数据库的备份与恢复 第一部分:数据库的备份 备份的必要性 因为各种人为或外界的因素可能会造成数据库中灾难性的数据丢失,为了保证数据库中数据的安全,必须采取备份措施保证RDBMS中包含 ...

  3. UE4联机多人游戏基本设置

    UE4自带网络联机功能,但是似乎只有蓝图接口,而真正写功能的时候不能用C++,让人感觉相当诡异 还是作一个简单记录 1.建一个第三人称模板,为什么会用他呢,因为它自带模板的很多组件,直接支持联机功能, ...

  4. FFmpeg源代码简单分析:avformat_find_stream_info()

    ===================================================== FFmpeg的库函数源代码分析文章列表: [架构图] FFmpeg源代码结构图 - 解码 F ...

  5. 【移动开发】SharedPreferences的兼容版本

    public class SharedPreferencesCompat { private static final String TAG = SharedPreferencesCompat.cla ...

  6. Android Studio设置代理更新下载SDK

    代理主机和端口号按下图设置即可,便可以轻松的下载更新SDK啦~~~

  7. ADO.NET之Parameter属性

    在ADO.NET中, public SqlParameterCollection Parameters {get;}会得到一个SqlParameter属性.下面通过一个例子进行详细的认识吧. //例如 ...

  8. iOS中 通知中心Text (实例)

    指定根视图 self.window.rootViewController = [RootViewController new]; 方法实现: #import "RootViewControl ...

  9. UNIX环境高级编程——线程同步之互斥锁、读写锁和条件变量(小结)

    一.使用互斥锁 1.初始化互斥量 pthread_mutex_t mutex =PTHREAD_MUTEX_INITIALIZER;//静态初始化互斥量 int pthread_mutex_init( ...

  10. 认证模式之Spnego模式

    Spnego模式是一种由微软提出的使用GSS-API接口的认证模式,它扩展了Kerberos协议,在了解Spnego协议之前必须先了解Kerberos协议,Kerberos协议主要解决身份认证及通信密 ...