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

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. EJB通过注解方式注入并使用其他EJB或者服务、配置JBoss数据源

    通过注解方式注入并使用其他EJB或者服务 真实项目EJB对象很多,EJB之间也可以互相调用, 在项目HelloWorld下新建接口Other在cn.hqu.ejb3下: public interfac ...

  2. JavaWeb 文件 上传 下载

    文件上传下载对于一个网站来说,重要性不言而喻.今天来分享一个JavaWeb方式实现的文件上传下载的小例子. 项目依赖 项目目录 工作流程 文件上传 表单处的设置 服务器端 上传功能的实现 upload ...

  3. VNC 登录上去灰屏,没有shell脚本,鼠标变成X

    CenterOS 1.安装vncserver yum install tigervnc-server -y 2.vncpasswd 设置pwd 3./etc/sysconfig/vncservers ...

  4. Android水印相机

    本篇文章实现的水印相机,类似于qq空间中的水印相机功能,因之前看过一个demo上实现了一个简陋的水印相机功能,觉得挺有意思,就在此基础上进行了修改,优化和完善,并增加了部分功能,使之更接近于qq水印相 ...

  5. DFS(深度优先)算法编程实践

    DFS定义 DFS(Depth-First-Search)深度优先搜索算法,是搜索算法的一种.是一种在开发爬虫早期使用较多的方法.它的目的是要达到被搜索结构的叶结点 . 特点 每次深度优先搜索的结果必 ...

  6. J2EE进阶(十三)Spring MVC常用的那些注解

    Spring MVC常用的那些注解 前言 Spring从2.5版本开始在编程中引入注解,用户可以使用@RequestMapping, @RequestParam,@ModelAttribute等等这样 ...

  7. 带吸附效果的ViewPager(一)

    什么叫吸附效果?先看一个示例更为直观,借用网上的一个效果图: 类似这种效果的app很多,网上的实现方法也是很多,但各种重写各种监听又令人不胜其烦,今日突发奇想,顺着自己的思路实现了类似的效果,不敢独享 ...

  8. quartz 时间设置(定时任务scheduler)

    quartz用来设置定时任务的作业调度程序.在linux的crontab中用到. 格式为: * * * * * * * 其从左到右顺序代表 :[秒] [分] [小时] [日] [月] [周] [年] ...

  9. Java中类的创建及类与对象的关系

    //import java.util.Scanner; //创建一个类 class Person{ //属性和方法的定义不是必须的 //属性 String name ; int age ; //方法 ...

  10. 【自制插件】MMD4Maya

    这个是之前MMD4MecanimImport的升级版,把pmx2fbx.exe整合了进来,不再需要Unity和MotionBuilder. 测试maya2015, maya2016可以用.maya20 ...