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

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. 适配器模式(adapter)

    适配器模式的定义: 将一个类的接口转换成客户希望的另外一个接口,适配器模式使得原本由于接口不兼容而不能在一起的那些类可以一起工作. 主要分为三类:类的适配器模式.对象的适配器模式.接口的适配器模式. ...

  2. Apache DbUtils 探秘

    听说Apache的DbUtils很好用,而且是对jdbc的简单的封装,所以可以和jdbc一起混搭,多以今天就来尝试一下,关于DbUtils 是如何使用的. 准备 数据库: MySQL 依赖: mysq ...

  3. VIM编辑器操作命令积累

    开始学习VIM编辑器了,计划着每周学习几个新命令,记录在本篇博客中. 1.第一次接触 vi demo.txt 进入Normal模式查看文本 i 进入Insert模式插入内容,编辑文本 nG n代表行号 ...

  4. Dynamics CRM2016 新功能之Solution enhancements

    CRM2016中对解决方案的功能有了一定的加强,CRM自2011版本开始引入了solution的概念,但大家的共识是solution的导出导入以及发布都非常的慢,常常会出现发布超时的情况很是头疼. 以 ...

  5. AndroidVerifyBoot

    253        Utils.write(image_with_metadata, outPath);254    }227行得到boot.img的size 238行new一个BootSignat ...

  6. awk:快速入门(简单实用19例+鸟哥书内容)

    awk 用法:awk ' pattern {action} '  变量名 含义  ARGC 命令行变元个数  ARGV 命令行变元数组  FILENAME 当前输入文件名  FNR 当前文件中的记录号 ...

  7. Win7/Win8/Win10下安装Ubuntu14.04双系统 以及常见问题

    整理自网络. 1. 制作镜像 将ubantu镜像刻录到优盘(我使用UltraISO刻录,镜像下载地址:链接: http://pan.baidu.com/s/1bndbcGv 密码: qsmb) 2. ...

  8. java同步synchronized

    java同步synchronized volatile仅仅用来保证该变量对所有线程的可见性,但不保证原子性. 看下面的这段代码: /** * * @author InJavaWeTrust * */ ...

  9. linux下JAVA开发的环境配置

    1.去http: //java.sun.com/j2se/1.4.2/download.html 下载一个Linux Platform的JDK,建议下载RPM自解压格式的(RPM in self-ex ...

  10. (NO.00003)iOS游戏简单的机器人投射游戏成形记(十七)

    现在玩家选择机器人后,可以在屏幕上或手臂上点击来移动robot's arm了. 但是玩家选择一个机器人后没有视觉效果来表明哪个机器人被选中.玩家做了一个操作后没有视觉反馈会惹恼强迫症用户滴 ;) 这篇 ...