UGUI父对象自适应子元素布局解决方案

问题描述

        在UI开发中，难免会遇到需要父对象自适应子元素尺寸的问题，这通常是为了解决不同屏幕分辨率的UI自适应问题。实际上我们去仔细了解UGUI的布局组件的原理就能够合理配置组件来解决这个问题。

        案例问题：例如我现在有一个背景面板，背景面板中包含一张图片和一段文字，要求图片和文字进行向左水平居中布局，图片对象根据Sprite自适应大小，文本框根据文字内容自适应大小，且背景面板始终根据二者的总尺寸进行自适应。

解决方案

        根据上述案例问题，首先肯定能想到需要一个Horizontal Layout Group组件，那么这就解决了图片和文字向左水平居中的问题，其次背景面板需要自适应总尺寸，那么就需要一个Content Size Fitter组件。

        接下来是图片和文本框，二者都属于布局元素，所以就各自加上Layout Element组件。图片则勾选Image组件的Preserve Aspect选项，LayoutElement组件保持默认；文本框的LayoutElement组件需要勾选Flexible Width和Flexible Height，二者的值可以都设置为1。

总结

        如果对UGUI布局感兴趣，还可以去看看预设的布局组件的源代码，在Packages/Unity UI下，对于其它布局情况建议先看看能否通过UGUI的预设布局组件进行组合来解决，若解决不了再去考虑开发自定义的布局组件。