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

相关推荐
tealcwu14 小时前
【Unity小技巧】如何将3D场景转换成2D场景
3d·unity·游戏引擎
鹿野素材屋17 小时前
Unity模型中人形角色的嘴巴一直开着怎么办
unity
世洋Blog21 小时前
Unity面经-List底层原理、如何基于数组、如何扩容、List存储泛型、List有关在内存中的结构
unity·面试·c#·list
jtymyxmz2 天前
《Unity Shader》6.4.3 半兰伯特模型
unity·游戏引擎
我的golang之路果然有问题2 天前
mac配置 unity+vscode的坑
开发语言·笔记·vscode·macos·unity·游戏引擎
于小汐在咯2 天前
【虚拟现实技术】在Unity里创建一个简单的AR项目
unity·ar·vr
HahaGiver6662 天前
Unity Shader Graph 3D 实例 - 一个简单的红外线扫描全身效果
3d·unity·游戏引擎
雪下的新火3 天前
Blender:法线图&黑白图
游戏·unity·游戏引擎·blender·笔记分享
HahaGiver6663 天前
从0到1做一个“字母拼词”Unity小游戏(含源码/GIF)- 实现多单词顺序通关进度逻辑
unity·游戏引擎·游戏程序
Dr.勿忘3 天前
Unity一分钟思路---UI任务条:宝箱位置如何准确卡在百分比位置上
ui·unity·游戏程序·屏幕适配