以Unity 5.5 的官方文档为例

Canvas

UI元素的前后顺序:SetAsFirstSibling, SetAsLastSibling, and SetSiblingIndex

BasicLayout

文档:https://docs.unity3d.com/Manual/UIBasicLayout.html

使用Anchor时,可以是相对于父节点的,比如Anchor在Left,四个三角形是在左边的

布局元素(LayoutElement)

LayoutElement 不直接修改元素的size,但提供信息供Layout Controller

一个gameobject上绑定了Rect Transform就可以称为LayoutElement

Image和Text 在属性面板提供了Preferred width和 height

可以添加Layout Element组件来重写Min ,Preferred ,Flexible size

布局控制(Layout Controller)

文档:https://docs.unity3d.com/Manual/UIAutoLayout.html

Layout Element 在 Layout group 的size 遵寻以下的原则:

  • 首先 Min Size被分配
  • 如果有足够的空间,Preferred Size(优先尺寸)会被分配
  • 如果有多余的空间,Flexible Size (弹性、灵活尺寸)会被分配

那些是Layout Controller?

Content Size Fitter (内容)

Aspect Ratio Fitter(纵横比,高宽比)

Layout Groups (水平,垂直,Grid)

布局计算

自动布局系统评估和执行布局按照以下顺序:

1. Min 、Preferrd 、Flexible 的宽度计算通过 ILayoutElement. CalculateLayoutInputHorizontal,这是自下而上的顺序执行,Child会比Parent先计算,这样在计算Parent时会考虑Child的信息

2. 影响布局元素的有效宽度通过ILayoutController.SetLayoutHorizontal ,自上而下的顺序执行,Child会比Parent后计算,因为Child的宽度分配在于Parent,然后修改RectTransform的新宽度

3. Min、Preferrd、Flexible的高度通过ILayoutElement.CalculateLayoutInputVertical ,这是自下而上的顺序执行,Child会比Parent先计算,这样在计算Parent时会考虑Child的信息

4. 布局元素的有效高度通过ILayoutController.SetLayoutVertical ,自上而下的顺序执行,Child在Parent后计算,是因为Child的高度分配在于Parent,然后修改RectTransform的新高度

从上面可以看出自动布局系统先评估宽度,然后评估高度,因此 高度可能取决于宽度计算,但计算宽度不能依赖于高度。

思考:先计算宽度,再计算有效宽度?

触发布局重建

当一个组件的属性发生改变可导致当前的布局失效,布局需要重建,通过调用以下触发:

LayoutRebuilder.MarkLayoutForRebuild (transform as RectTransform);

重建不会立即生效,会在当前帧结束,在渲染之前生效。不直接生效的原因是:如果在同一帧有多少重建,会降低性能。

重建应该在以下几种情况下被触发:

  • In setters for properties that can change the layout.

In these callbacks: 在下面这些callback函数

  • OnEnable
  • OnDisable
  • OnRectTransformDimensionsChange
  • OnValidate (only needed in the editor, not at runtime)
  • OnDidApplyAnimationProperties

UGUI Manual的更多相关文章

  1. UGUI batch 规则和性能优化

    UGUI batch 规则和性能优化 (基础) Unity 绘图性能优化 - Draw Call Batching : http://docs.unity3d.com/Manual/DrawCallB ...

  2. 【Unity笔记】UGUI的Text文本框的大小随着文本字数变化

    需求:UGUI的Text文本框的内容会随着文本字数多少/换行而自动改变大小. 给Text加一个Content Size Filter组件(脚本),设置Horizontal Fit和Vertical F ...

  3. 【转】UGUI文本字体颜色和大小等代码修改

    http://blog.csdn.net/alayeshi/article/details/51842195 由于项目需求用UGUI在同个文本中显示出颜色和大小都不同的文字,我上网找个很久并没有见到相 ...

  4. 【转】UGUI VS NGUI

    原文:http://gad.qq.com/college/articledetail/7191053 注[1]:该比较是基于15年-16年期间使用NGUI(3.8.0版本)与UGUI(4.6.9版本) ...

  5. ugui学习资料

    官网文档 http://docs.unity3d.com/Manual/index.html 官网视频教程http://unity3d.com/learn/tutorials/modules/begi ...

  6. 如何快速优化手游性能问题?从UGUI优化说起

    WeTest 导读   本文作者从自身多年的Unity项目UI开发及优化的经验出发,从UGUI,CPU,GPU以及unity特有资源等几个维度,介绍了unity手游性能优化的一些方法.   在之前的文 ...

  7. UGUI Text(Label)

    环境 Unity 5.3.6f1 关于Best Fit 如果勾选了 Best Fit ,当有大量的文本填充在Text上时,那么文字是不会自动换行的. 打字机效果 在github上已有现成的:https ...

  8. [unity]UGUI界面滑动,ScrollRect嵌套滑动

    原因:老板蛋痛,让我去抄皇室战争. 思路:我大概知道ngui(后来改成UGUI的)里面有个ScrollView.于是我就想一个横着的SV加上5个竖的SV不就好了吗. 过程: 于是 但是有个问题就是UI ...

  9. Mongodb 3.2 Manual阅读笔记:CH9 存储

    9. 存储 9. 存储 9.1 存储引擎 9.1.1 WiredTiger存储引擎 9.1.1.1 文档级别并发 9.1.1.2 快照和检查点 9.1.1.3 Journaling 9.1.1.4 压 ...

随机推荐

  1. Linux下使用 github+hexo 搭建个人博客02-hexo部署到Github Pages

    之前的这篇文章<Linux下使用 github+hexo 搭建个人博客01-hexo搭建>,相信大家都知道怎么搭建 hexo ,怎么切换主题,并且完成了一篇博文的创建,以及 MarkDow ...

  2. Java解析XML字符串,取出其中<aaaa><![CDATA[(XXX)]]></aaa>里面的XXX值,也可以使用xml解析的其他方式,这是最简单的字符串解析

    直接贴一段业务代码,这段代码是解析请求返回的xml格式字符串,为了取出其中的值便于下一步的使用. @RequestMapping(value="/search",produces ...

  3. java之逻辑运算符

    &-逻辑与    |-逻辑或    !-逻辑非    &&-短路与    ||-短路或    ^-逻辑异或 a b a&b a|b !a a^b a&& ...

  4. Google工作法

    本文转自:https://www.yuque.com/heqingbao/msfy2c/zg56gm 这几天去上海参加Google开发者大会,利用空闲时间读了一本快餐书,书名叫<Google工作 ...

  5. PHP 7.4.0 发布

    近日,PHP 7.4.0 发布了,此版本标志着 PHP 7 系列的第四次特性更新. PHP 7.4.0 进行了许多改进,并带来了一些新特性,包括: Typed Properties  类型属性 类属性 ...

  6. Vue ---- 组件文件分析 组件生命周期钩子 路由 跳转 传参

    目录 Vue组件文件微微细剖 Vue组件生命周期钩子 Vue路由 1.touter下的index.js 2.路由重定向 3.路由传参数 补充:全局样式导入 路由跳转 1. router-view标签 ...

  7. 安全性测试:OWASP ZAP 2.8 使用指南(一):安全测试基础及ZAP下载、安装

    概览 本文意在对于OWASP's Zed Attack Proxy(ZAP)软件做一个基本使用指南介绍. ZAP是一个用于实施安全性测试的工具,即使没有很强的安全测试背景也可以很好的使用. 为了达到这 ...

  8. Bag of Tricks for Image Classification with Convolutional Neural Networks

    这篇文章来自李沐大神团队,使用各种CNN tricks,将原始的resnet在imagenet上提升了四个点.记录一下,可以用到自己的网络上.如果图片显示不了,点击链接观看 baseline mode ...

  9. vscode 通过ftp发布vue到azure服务器

    参考资料:vs code配置ftp连接远程服务器实现代码文自动上传 1.在vscode应用商店中搜索拓展sftp插件,然后进行安装.2.安装完成后重启窗口,按快捷键Ctrl+shift+p,输入sft ...

  10. MySQL学习——存储引擎

    MySQL学习——存储引擎 摘要:本文主要学习了MySQL数据库的存储引擎. 什么是存储引擎 数据库存储引擎是数据库底层软件组件,数据库管理系统使用数据引擎进行创建.查询.更新和删除数据操作.不同的存 ...