Unity UGUI 解决多级布局混乱问题

问题描述

界面开发中,常常会有需要多级连续使用布局三剑客(HorizontalLayoutGroup、VerticalLayoutGroup 和GridLayoutGroup)的需求。同时,最底层的布局往往需要它可以是动态改变的,所以一般不使用LayoutElement 控件去控制叶子级的大小。

当尝试多级连续使用布局三剑客时,会发现当叶子级布局变化(如大小发生变化或者数量发生变化)时,祖级的布局排布会发生错乱,常常表现为叠加覆盖和不合理的间隔。

问题原因

*理解原因前建议先看这篇详解

解决方案

1.最子级布局控件上的ControlChildSize 不要勾选,因为通常叶子级需要使用自身大小(也就是通过RectTransform)来控制大小和布局,有时候甚至是动态改变的。

2.其他层级布局控件上的ControlChildSize 需要勾选,这样可以确保每一级将自身的Min 布局属性正确地向上传递。

3.所有层级的布局控件上添加ContentSizeFitter,然后将对应轴向上的xxxFit 设置为MinSize 或者PreferredSize,这样每层的ContentSizeFitter 会先于三剑客控件而自适应好大小,接着三剑客就可以以刚刚好的长度去排布子级。

4.当然你也可以自己写一个xxxSizeFitterLayoutGroup,只需确保在排布子级之前完成自身大小的调整,注意继承ILayoutSelfController 以确保先于其他布局组件完成自身大小调整的任务。

5.以上方案适用于紧凑型布局的需求。对于需要在某一层级上附加冗余空间的需求(例如一组变长列表),在保留上述操作的同时,在需要附加冗余空间的层级上,使用LayoutElement 替换掉ContentSizeFitter,然后设置好相应轴向上Min 属性设置和Preferred 属性设置,注意将LayoutPriority 设置为大于1的数值,这样可以覆盖掉该层级上三剑客计算的数值,然后从该层级向上,每个层级上的ContentSizeFitter 的xxFit 改成Preferred Size 即可。

源码

可以查看这里找到你需要的控件

你可能感兴趣的:(Unity UGUI 解决多级布局混乱问题)