主要内容

  • 布局: Anchors,Pivot,Anchor Presets
  • 属性: anchoredPosition,anchoredPosition3D,offsetMax,offsetMin,sizeDelta,rect
  • 方法: SetSizeWithCurrentAnchors,SetInsetAndSizeFromParentEdge,RectTransformUtility

Anchors

Anchors是在子类锚在父类上的点,因此如果没有父类(RectTransform),那么RectTransform属性面板上的Anchor Presets将不可设置,但Anchors仍可设置。

所谓,锚在父类上,意思就是子类的Pivot(中心点)到(父类上)Anchors(锚点)的相对位置不变,而这个位置就是RectTransform面板上显示的——PosX,PosY,PosZ——对应了anchoredPosition3D(PosX,PosY,PosZ),或anchoredPosition(PosX,PosY)。

需要注意的是,anchoredPosition3D(PosX,PosY,PosZ)并不是localPosition,除非子类的Anchors与父类的Pivot重合,这样子类的Pivot相对于(子类)Anchors的位置,刚好就是localPosition(子类Pivot相对于父类Pivot的位置)。

那么,Anchors的Min代表了在父类左下角的位置,Max代表了在父类右上角的位置,[0, 1]——的范围代表了在父类X轴和Y轴方向的百分比。

虽然,在Scene中Anchors无法超越父类区域,但在属性面板上,或是代码中(anchorMax,anchorMin,注意代码的数值是面板数值的四舍五入),Anchors均可以超过[0, 1]范围,即:代表父类区域之外。

Anchors的重要作用,就是无论父类如何变化,子类相对于父类上Anchors的相对位置都不变。

Pivot

Pivot代表了RectTransform的中心点,即:相对于RectTransform的坐标(如Anchor或Rotation)都会以它为基准点,(0,0)代表自身区域的左下,(1,1)代表自身区域的右上,如果超过了[0, 1]范围,就说明超过了自身区域之外。

注意与Anchors不同的是,Anchors的[0, 1]范围是——父类区域,而Pivot的[0, 1]范围是——自身区域。

Anchor Presets

Anchor Presets是对Anchors的快捷设置选项,提供了最常用的几种Anchors设置模式,如:上中下,左中右,拉伸。如果不使用这里的预设,通过代码(anchorMax,anchorMin),或是面板属性,也是可以自定义设置的。

选择不同Anchor Presets的选项,可以看到,Scene中的Anchor会自动定位到不同位置。

所谓,拉伸(stretch)就是Max的(x,y)和Min的(x,y)不一致:

  • 可以是x不一致,此时可以选择——上中下。
  • 也可以是y不一致,此时可以选择——左中右。
  • 或是x和y都不一致,此时没有选择——手动调节。

相反,如果Max和Min的x和y对应一致,则说明,Max和Min两点重合,此时重合的一点,可以出现在上中下(y)与左中右(x)相搭配的位置,即:非拉伸的9种选项。

下面,是拉伸的三类情况:

上中下:

在这种情况下,面板上的PosX和Width会被,Left和Right取代。这代表着,RectTransform的区域到Anchors在x方向上的左右距离(类似CSS布局中的padding left right)。

左中右:

在这种情况下,面板上的PosY和Height会被,Top和Bottom取代。这代表着,RectTransform的区域到Anchors在y方向上的上下距离(类似CSS布局中的padding top bottom)。

四角:

当然,也可以自定义,四角的位置:

在这种情况下,面板上的PosX,PosY,Width,Height会被Left,Right,Top,Bottom取代。这代表着,RectTransform的区域到Anchors在xy方向上的四周距离(类似CSS布局中的padding)。

anchoredPosition和anchoredPosition3D

在RectTransform面板上,anchoredPosition3D对应了(PosX,PosY,PosZ),anchoredPosition对应了(PosX,PosY)。

当Anchors重合的时候,Anchors与Pivot的相对位置就是anchoredPosition。

当Anchors分开的时候,Pivot在自身区域的比例,映射到Anchors上的点,再与Pivot的相对位置,就是anchoredPosition。

offsetMax和offsetMin

offsetMin是Anchors左下角到RectTransform左下角的距离。

offsetMax是Anchors右上角到RectTransform右上角的距离。

sizeDelta

sizeDelta是offsetMax - offsetMin的值,它的几何意义是,RectTransform的区域与Anchors区域的差值,所以:

  • 如果Anchors重合(区域大小为0),那么差值就是RectTransform的区域本身,此时sizeDelta就是面板上Width和Height的数值。
  • 如果Anchors不重合,那么差值就是两个区域的大小差值,此时sizeDelta就不在是Width和Height的数值,面板上也不再显示Width和Height。
  • 如果RectTransform区域大于Anchors区域,那么sizeDelta就是正值,否则就是负值。

rect

rect是RectTransform的区域信息,其中(x,y)是RectTransform左下角到Pivot(不是Anchors)的相对位置,(width,height)是RectTransform区域的大小。

方法

当Anchors不重合的时候,设置sizeDelta就不能正确控制RectTransform的大小,此时可以使用SetSizeWithCurrentAnchors(axis, size)来设置rect的width和height。

// rect width
rectTransform.SetSizeWithCurrentAnchors(RectTransform.Axis.Horizontal, 200);
// rect height
rectTransform.SetSizeWithCurrentAnchors(RectTransform.Axis.Vertical, 200);

SetInsetAndSizeFromParentEdge(edge, inset, size)可以根据父类的某个边,设置大小和间距(注意此方法会改变Anchors的位置):

  • edge:是父类的边,Left,Right,Top,Bottom
  • inset:子类边到父类边的间距
  • size:在边方向上的大小,如:Left和Right对应Width,Top和Bottom对应Height
// 以下两个方法
// 可以将子类(Top,Left)边,定位到距离父类(Top,Left)边各100像素的地方
// 并且设置子类大小为(400,400)
SetInsetAndSizeFromParentEdge(RectTransform.Edge.Top,  100, 400);
SetInsetAndSizeFromParentEdge(RectTransform.Edge.Left, 100, 400);

另外,RectTransformUtility提供了RectTransform相关的一些辅助方法,来处理——坐标转换、坐标获取、范围测试等,可以简化完成某些功能的实现。


scott.cgi:「专栏目录」​zhuanlan.zhihu.com

相对布局父类属性_Unity3D RectTransform使用详解:布局、属性、方法相关推荐

  1. css三种定位都脱离文档流了吗,CSS布局之脱离文档流详解——浮动、绝对定位脱离文档流的区别...

    1.代码 (1)示例代码1 CSS布局之脱离文档流详解--浮动.绝对定位脱离文档流的区别 .left { width: 300px; height: 500px; background: red; f ...

  2. android平台下OpenGL ES 3.0实例详解顶点属性、顶点数组

    OpenGL ES 3.0学习实践 android平台下OpenGL ES 3.0从零开始 android平台下OpenGL ES 3.0绘制纯色背景 android平台下OpenGL ES 3.0绘 ...

  3. 图文详解placeholder属性的使用方法以及如何修改placeholder的默认样式

    在页面布局时经常会用到input输入框,有时为了提示用户输入正确的信息,需要用placeholder属性加以说明.这篇文章就和大家讲讲placeholder属性怎么用以及如何修改placeholder ...

  4. html跨行使用的属性,HTML表格标记详解4:TD参数中设定跨列跨行属性

    this.p={ m:2, b:2, loftPermalink:'', id:'fks_083074083081084075085087087095083084084067083083082065' ...

  5. html标签的下一级遍历,jquery属性,遍历,HTML操作方法详解

    Jquery属性遍历.HTML操作. Jquery拥有可操作HTML元素和属性的强大方法. 下面是我整理的一些jquery遍历函数: .add() 将元素添加到匹配元素的集合中. .andSelf() ...

  6. Android 系统属性读取和设置详解

    Android 系统属性读取和设置详解 一.在adb中进行属性读取和设置 1.Settings Provider设置和读取 获取 设置 2.SystemProperties属性读取和设置 二.Andr ...

  7. [Python 多线程] 详解daemon属性值None,False,True的区别

    [Python 多线程] 详解daemon属性值None,False,True的区别 记录学习python不懂得和遇到得问题 每个进程至少要有一个线程,并最为程序的入口,这个进程就是主线程. 每个进程 ...

  8. csrf漏洞防御方案_CSRF 漏洞原理详解及防御方法

    跨站请求伪造:攻击者可以劫持其他用户进行的一些请求,利用用户身份进行恶意操作. 例如:请求http://x.com/del.php?id=1是一个删除ID为1的账号,但是只有管理员才可以操作,如果攻击 ...

  9. PHP开发中常见的安全问题详解和解决方法

    PHP开发中常见的安全问题详解和解决方法 参考文章: (1)PHP开发中常见的安全问题详解和解决方法 (2)https://www.cnblogs.com/walblog/articles/83313 ...

最新文章

  1. Linux终端中设置vi编辑命令
  2. 首发:友盟2015年Q2、Q3中国移动互联网趋势报告
  3. 关于 Intel 8253/8254
  4. st庞大股票股吧_黄金变石头!6倍大牛股提前锁定退市,市值蒸发98%,还有这些股票拉响警报(附名单)...
  5. linux 登入用户记录,linux记录所有用户登陆及执行过的命令脚本
  6. c语言程序改错输入5结果为15,《C语言程序设计教学课件》程序改错(自我总结).doc...
  7. Greenplum 行存、列存,堆表、AO表的原理和选择
  8. python画三维图-Python+matplotlib绘制三维图形5个精选案例
  9. 大数据实战之spark安装部署
  10. amd显卡测试帧数显示软件,NVIDIA发布帧数显示及显卡基准测试应用FrameView
  11. HenCoder Android 开发进阶: 自定义 View 1-2 Paint 详解
  12. react 中加载静态word文档(或加载静态的html文件)
  13. uva 473 - Raucous Rockers(dp)
  14. 从飞猪智能酒店到优酷视频,探索阿里智能研发协同流程
  15. autojs之200万logo自己做
  16. 【特征】PSI的计算
  17. vue项目中表格删除数据页码显示注意点
  18. XorPay.com 支付平台介绍【免费开通个人微信支付接口】
  19. 时控开关c语言程序,德力西KG316T时控开关调整和设定时间操作方法说明
  20. 汶川大地震中的SAP成都研究院

热门文章

  1. 113 虚拟机 错误 mysql_Navicat连接虚拟机mysql常见错误问题及解决方法
  2. c语言应如何自学,C语言如何自学
  3. java 交互式 shell_Java9 Shell工具(JShell)
  4. 图片太大_图片太大?手把手教你如何用java实现一个高质量图片压缩程序
  5. python functools模块方法
  6. 双纵坐标的绘图命令_Matplotlib绘图 | 快速定义图表样式的小技巧
  7. 最短路径问题——算法总集(待完善)
  8. Math.random()取随机数一直为0
  9. Java 1.1.5 空串与 Null 串
  10. 文具订购(【CCF】NOI Online能力测试 入门组第一题)