继续学习unity4.6,unity的LayoutGroup分为三种, Horizontal Layout Group(水平布局)Vertical Layout Group(垂直布局)Grid Layout Group (网格布局) 以前NGUI没有这东西都是自己写工具实现的。为什么我们要布局?我举个例子,布局的时候可以两个cell 和三个cell都居中显示。如下图所示。。

尤其在奖励窗口,因为获取道具的数量是不固定的,所以需要根据不同数量的道具来居中对齐。如下图所示,Padding 就是偏移,因为我的cell 是 95X95,为了居中所以这里设置成 right = -95 top = -95。

Spacing 表示 cell之间的距离。

Child Alignment 表示对齐方式。

Child Force Expand 表示 自适应 宽 和高

在看看cell,注意Layout Group节点下面的所有cell节点都是不能修改Rect Transform的。因为cell可能下面会放很多图片,这样我们会用个空的gameObject来当父节点。但是这个gameObject的width 和 height 是最小单位,那么Layout Group就不知道怎么来算居中了。如下图所示 这个时候就轮到LayoutElement登场了, 用它来设置一个cell的最大或者最小宽度。

如果运行时实例化后的gameObject 直接放在 Layout Group下面即可。Layout Group会自动计算布局,真的是非常方便。

for(int i =0 ;i <10;i++){
GameObject go = (GameObject)Instantiate(Resources.Load<GameObject>(“item”));
go.transform.parent = transform;
go.transform.localScale = Vector3.one;
}

还有个问题就是隐藏,比如把其中的一个cell setActive = false ,为了不计算隐藏的cell 所以要先把 IngonreLaytout = true 再 setActivity = false  这一切都可以在代码里面来设置。

代码这样即可。

gameObject.GetComponent<LayoutElement>().ignoreLayout = true;
gameObject.SetActive(false);

UGUI技术之LayoutGroup布局实现详解的更多相关文章

  1. 弹性布局学习-详解align-content(六)

    弹性布局学习-详解align-content(六)

  2. 弹性布局学习-详解 justify-content(三)

    弹性布局学习-详解 justify-content(三)

  3. 弹性布局学习-详解 flex-direction【决定主轴的方向】(二)

    弹性布局学习-详解 flex-direction[决定主轴的方向](二)

  4. CSS3之多列布局columns详解

    CSS3之多列布局columns详解 CSS3提供了个新属性columns用于多列布局.基本属性如下: 1. columns: <'column-width'> || <'colum ...

  5. ExtJs常用布局--layout详解(含实例)

    序言: 笔者用的ExtJs版本:ext-3.2.0 ExtJs常见的布局方式有:border.form.absolute.column.accordion.table.fit.card.anchor ...

  6. 弹性布局学习-详解flex-wrap(五)

    目录 弹性布局学习-介绍(一)  弹性布局学习-详解 flex-direction[决定主轴的方向](二) 弹性布局学习-详解 justify-content(三) 弹性布局学习-详解 align-i ...

  7. 弹性布局学习-详解 align-items(四)

    目录 弹性布局学习-介绍(一)  弹性布局学习-详解 flex-direction[决定主轴的方向](二) 弹性布局学习-详解 justify-content(三) 弹性布局学习-详解 align-i ...

  8. 约束布局ConstraintLayout详解

    约束布局ConstraintLayout详解 转 https://www.jianshu.com/p/17ec9bd6ca8a 目录 1.介绍 2.为什么要用ConstraintLayout 3.如何 ...

  9. css 13-CSS3属性:Flex布局图文详解

    13-CSS3属性:Flex布局图文详解 #前言 CSS3中的 flex 属性,在布局方面做了非常大的改进,使得我们对多个元素之间的布局排列变得十分灵活,适应性非常强.其强大的伸缩性和自适应性,在网页 ...

随机推荐

  1. extend选项和delimiters选项 vue 数据绑定 html form 对比 id重复

    {{define "chkUrl"}}<!DOCTYPE html><html lang="zh-cmn-Hans"><head& ...

  2. 简单老式Java对象 横切关注点 最小侵入性编程 声明式编程 避免强迫类继承和接口实现

    Spring In Action data injection aspect-oriented programming Plain Old Java Object 依赖注入能让相互协作的软件组件保持松 ...

  3. mount available

    Mount (computing), the process of making a file system accessible mount (Unix), the utility in Unix- ...

  4. git文章列表

    关于gitlab默认clone协议 Git实现从本地加入项目到远程仓库 翻翻git之---一个简单的标签控件 LabelView (随手发了两张小宝宝的玩耍照) id=1125" targe ...

  5. Learning Scrapy 中文版翻译 第二章

    为了从网页中提取信息,你有必要对网页的结构做一些了解.我们将快速学习HMTL,HTML数状结构以及用XPath在网页上提取信息 HTML, DOM树结构以及XPath 让我们花一点时间来了解当用户在浏 ...

  6. tomcat服务器配置java堆内存大小

    我用的是绿色免安装的tomcat,找到tomcat下的bin文件夹下的catalina.bat文件: 编辑该文件,编辑参数,没有的话手动加上: set JAVA_OPTS=-server -Xms51 ...

  7. 2 Maven使用入门

    一.编写pom.xml文件     Maven项目的核心是pom.xml.POM(Project Object Model,项目对象模型)定义了项目的基本信息,用于描述项目如何构建,声明项目依赖等等. ...

  8. 我所认为的KVC和KVO

    引子:    ​   为什么要写这个,只是突然一个念头闪现,说一下本人目前理解.KVC:    ​   Key-value coding,它是一种使用字符串标识符,间接访问对象属性的机制.但是关就这一 ...

  9. 使用webpack4搭建一个基于Vue的组件库

    组内负责的几个项目都有一些一样的公共组件,所以就着手搭建了个公共组件开发脚手架,第一次开发 library,所以是参考着 iview 的配置来搭建的.记录如何使用webpack4搭建一个library ...

  10. vim编辑makefile时临时不展开tab为空格

    可以先敲ctrl-v组合键,再敲tab键,这样就不会被转换成空格了. 给自己的备忘!