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的预设布局组件进行组合来解决,若解决不了再去考虑开发自定义的布局组件。

相关推荐
zhchyun200810 小时前
【Unity UI 进阶】仿 Element UI 打造企业级 Unity UI 组件库(05)
ui·unity·游戏引擎
_ZHOURUI_H_13 小时前
不做完整 ECS,只优化数据布局:Unity EasyECS 到底是什么
unity·性能优化·游戏引擎
郝学胜-神的一滴2 天前
Horse3D 游戏引擎研发笔记(七):Clydesdale——从流式日志到多输出订阅
c++·qt·unity·游戏引擎·图形渲染·unreal engine·opengl
小贺儿开发2 天前
Unity 程序员编曲花絮:汪峰《河流》细节修复
科技·学习·unity·程序员·音乐·demo·写代码
598866753@qq.com2 天前
Unity UniText笔记
unity·unitext
鼎艺创新科技3 天前
不依赖 UE/Unity:我们如何从零搭建一套国产三维 GIS 渲染引擎
人工智能·算法·unity·游戏引擎·三维电子沙盘
huihui3613 天前
校友网管理软件技术选型框架:基于功能核验与系统架构的量化评估
unity·系统架构·游戏引擎
五仁烧饼3 天前
Unity性能优化系列设置篇 - URP 移动端设置基线与分档策略
unity·游戏引擎
新手unity自用笔记3 天前
unity基于Socket的网络学习
网络·网络协议·学习·unity·c#·游戏引擎
心前阳光3 天前
Unity之XR Interaction Toolkit | IPointerDownHandler问题
unity·游戏引擎·xr