大小和位置的确定方法

控制节点

它们是一类对输入事件管理比常规节点更方便的节点。具有布局选项。通过边框,锚点,边距来确定大小和位置。下面介绍锚点和边距的知识。

锚点(Anchor)

锚点和布局是直接相关的,设置了相应的布局,就有相应的锚点,而具体运行时实际的锚点是根据屏幕分辨率确定的位置。四个设置项:

  • Left 左边线相对于当前屏幕在x轴的比例
  • Top 上边线相对于当前屏幕在y轴的比例
  • Right 右边线相对于当前屏幕在x轴的比例
  • Bottom 下边线相对于当前屏幕在y轴的比例
    四条边线决定了四个锚点的位置,反之四个锚点决定了四条边线的位置。

边距(Margin)

边距指的是,外框距离边线的距离,四个设置项:

  • Left 左边框距离边线的位置,若是负数则在锚点左边,若是正数则在锚点右边
  • Top 上边框距离上边线的位置,若是负数则在锚点的上边,若是正数则在锚点下边
  • Right 右边框距离右边线的位置
  • Bottom 下边框距离下边线的位置

子节点的锚点实际位置是根据父节点的边框再通过设定值计算得来。锚点位置得到后再通过边距确定最终的边框。若父节点是常规节点,只具有中心原点,则子节点四个锚点均为父节点的位置。
即得到大小和位置。下面通过举例说明:
示意图

常规节点(例如精灵)

通过中心原点,位移(transform)和比例(scale)。计算大小和位置。其中子节点的中心原点会通过继承父节点的位置和自己的位移信息得到新的位置,再通过比例确定大小。若父节点是控制节点,则子节点继承的位置是父节点边框的左上角。

没有大小和位置信息的节点

还有的节点什么位置信息也没有,例如CanvasLayers。这种节点不会继承父节点的任何位置信息。他们就相当于一个新的层,和所有的东西,都没有相互位置关系。

最后修改:2020 年 05 月 16 日
如果觉得我的文章对你有用,请随意赞赏