彻底学会Unity中UGUI中UI元素自适应问题

news2024/11/24 0:36:29

彻底学会Unity中UGUI中UI元素自适应问题

包会的简单版教程
狂飙模式:

经过自我进化学习,终于参悟。看完这个教程,你也可以!

1.扫盲UGUI的理解:


Unity3d 中的UI都是画在画布上的。就像画一幅画,首先我们需要一张什么也没有的白纸贴在画板上(这个画板就是:Canvas),有了画板以后,我们就可以一层层的铺上画面元素了,这些画面元素就是具体的UI元素(包括:一个图、按钮、滚动条、勾选框、文本框等等)而且,在层级面板的UI名称列表中(大纲列表)排在上面的就会被放在图层下方,后面创建的UI会遮住早先创建的,就像一层层的画画一样,后面刷的颜色肯定是在最前方。

​​

关于画布的介绍,包含三种模式我就不介绍了,可以看这里画布 - Unity 手册

2.单个UI元素的结构、组成扫盲

每个UI被创造在画布上以后,都有两个重要的东西:锚点(或者叫锚框)Anchors、UI元素视觉内容。

锚点(Anchors)主要负责把物体固定在画布上,并且根据锚点合并和分开来决定UI内容是跟随画布固定到画布定点位置,还是位置和缩放都跟随画布。这也就是自适应。默认情况下,锚点是合并的。

A:锚点合并模式

UI内容是跟随画布固定到画布定点位置,不跟随画布缩放

B:锚点分开并且形成锚框模式

此时UI元素内容的位置和缩放都跟随画布Canvas

3.UI元素内容和UI锚点(Anchors)的关系

其实人家两个只不过是简单的一家人,没有什么复杂的关系。

锚点在汉语中是轮船靠岸的时候抛在海底的铁钩,用来固定住轮船不被海水卷走。锚点就是固定的意思。这里每一个UI元素都有自己的Anchors 这个东西就是用来把UI元素内容像钉子一样订在Canvas。

UI元素内容(就是绿色部分)就像是锚点Anchors的子物体一样,它可以自己随便在画布上移动,他的坐标数值全部是相对于自己的锚点的数值。

这只是为了方便设计师看着元素进行调节相对位置,完全不影响自适应。自适应本质上还是和锚点位置+锚点模式还是锚框模式有关系。

还有一种情况,当锚点变成锚框的时候,UI元素内容就不再是显示坐标,而是显示上下左右到锚框边界的距离。

这都无所谓。

4.开始自适应的设置

有了前面的学习我们基本知道了,UI元素创建出来默认都会自适应画布(Canvas)的,只不过需要我们确认两个问题:

  1. 固定放在画布的那个位置
  2. 哪一种适应模式(仅位置、还是位置+缩放)

接下来按照我的步骤设置:

A首先我们需要设置该UI元素锚点的固定在画布的那个位置,很简单直接点击即可!

B然后,设置锚点/锚框模式(合并还是分开)

锚点模式:UI内容将会固定到一个位置不变,尽管画布的尺寸发生变化

锚框模式:UI内容将会跟队画布一起缩放大小,同时保持相对画布位置不变

但是锚框四个点的距离会影响到UI内容元素的缩放“效率”。间距越大缩放的比例程度就越大,间距越小,跟随缩放的比程度就越小。

小伙伴们,Do you understand?

撰稿不易全靠信仰!由你剃!
 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1023013.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

iPhone NFC 设置教程(门禁卡/公交卡/校园卡等等)

苹果手机如何开启NFC功能呢?相信不少小伙伴都对iPhone手机里的NFC用法都不太了解。尽管小米、华为、荣耀、一加、oppo、vivo等安卓手机的NFC使用已经满大街了,不仅功能齐全而且快捷安全,但是这一功能在苹果手机上还很鸡肋,因为它对…

DBSCAN聚类的Python 实现

一、说明 DBSCAN(Density-Based Spatial Clustering of Applications with Noise)聚类是一种基于密度的聚类算法。它能够根据数据点的密度来将数据划分为不同的类别,并可以自动识别离群点。DBSCAN聚类算法的核心思想是将密度高的数据点划分为…

MongoDB——关于NumberLong处理大整数

1、问题 MongoDB根据某个Long类型ID查询数据查不出来 db.getCollection(school_work_section).find({school_work_section_id:577199363866206209}); 2、解决办法 Long类型的需要在NumberLong的对象里加上双引号才能查出来 db.getCollection(school_work_section).find({sc…

初识C语言——详细入门一(系统性学习day4)

目录 前言 一、C语言简单介绍、特点、基本构成 简单介绍: 特点: 基本构成: 二、认识C语言程序 标准格式: 简单C程序: 三、基本构成分类详细介绍 (1)关键字 (2&#xf…

搭建ELK+Filebead+zookeeper+kafka实验

一、ELKFilebeadzookeeperkafka架构 第一层:数据采集层(Filebeat) 数据采集层位于最左边的业务服务集群上,在每个业务服务器上面安装了filebead做日志收集,然后把采集到的原始日志发送到kafkazookeeper集群上。 第二…

文件拷贝【 使用字节流完成文件的复制(支持一切文件类型的复制)】

需求: 把某个视频复制到 E:\\videocopy\\new.mp4 思路: 根据 数据源 创建字节输入流对象根据 目的地 创建字节输出流对象读写数据,复制视频释放资源 可以拷贝 视频 ,图片 ,文本.txt 等文件 package com.csdn.d2_byte_…

Linux grep命令

①grep命令——过滤文件 这是txt.txt的内容 通过grep管道符查找gcc内容在txt.txt文件中 查找gcc所处行位置,加上-n 查找有多个相同内容的数据 ②wc命令——数量统计 统计数据如图: ③管道符——左边结果作为右边输入 如下图所示统计txt.txt文件"-&…

连续性数据进行Meta荟萃分析

Meta荟萃分析(也称Meta分析,元分析,异质性分析等),其是一种综合各种文献结论,进而汇总综合评价的方法,Meta分析常用于医学、心理学、教育学、生态学等专业领域。通俗地看,Meta分析是…

物 理 层

二、物理层 1、物理层的基本概念 物理层的作用:尽可能的屏蔽掉传输媒体和通信手段的差异,使物理层上面的数据链路层感觉不到这些差异,使其只需要考虑如何完成本层的协议和服务 1.1、物理层的主要任务 机械特性:指明接口所用的接线器的形状…

【计算机视觉】1. 计算机视觉基础理论知识和框架(Basic Concepts)

什么是计算机视觉? 一、什么是计算机视觉二、二个研究维度三、研究挑战3.1 像素与语义之间的GAP3.2 视觉变化3.3 光照变化3.4 尺度变化3.5 形态变化3.6 背景复杂3.7 遮挡3.8 内外 四、计算机视觉框架4.1 计算机视觉基础4.2 深度学习算法理论基础4.3 深度学习算法 五、计算机视…

SpringBoot3与IDE中配置JDK17

概述 SpringBoot3需要JDK17的支持,不再支持JDK8。 如果要运行SpringBoot3的项目,根据使用的IDE,需要的配置不同。 配置说明 1. SpringToolSuite4 如果使用的是SpringToolSuite4(STS),比较简单&#xf…

接入网技术

接入网 接入网是指骨干网络到用户或企业之间的所有设备。其长度一般为几百米到几公里,因而形象地被称为“最后一公里”。接入网地接入方式包括铜线(普通电话线)接入、基于双绞线的ADSL技术、基于HFC网(光纤和同轴电缆(有线电视电缆)混合网)的Cable Modem技术、光纤接入…

「聊设计模式」之职责链模式(Chain of Responsibility)

🏆本文收录于《聊设计模式》专栏,专门攻坚指数级提升,助你一臂之力,带你早日登顶🚀,欢迎持续关注&&收藏&&订阅! 前言 设计模式是解决软件开发中常见问题的可复用解决方案。其中…

一篇文章教你Pytest快速入门和基础讲解,一定要看!

前言 目前有两种纯测试的测试框架,pytest和unittestunittest应该是广为人知,而且也是老框架了,很多人都用来做自动化,无论是UI还是接口pytest是基于unittest开发的另一款更高级更好用的单元测试框架出去面试也好,跟别…

爬虫工作者必备:使用爬虫ip轻松获得最强辅助

在进行网络数据爬取时,爬虫ip成为了爬虫工作者们的得力辅助。通过使用爬虫ip,可以实现IP地址的伪装和分布式请求,有效规避访问限制和提高爬取效率。本文将为爬虫工作者们分享关于使用爬虫ip的知识,帮助您轻松获取最强辅助&#xf…

【JavaEE】多线程案例-单例模式

文章目录 1. 前言2. 什么是单例模式3. 如何实现单例模式3.1 饿汉模式3.2 懒汉模式4. 解决单例模式中遇到的线程安全问题4.1 加锁4.2 加上一个判断解决频繁加锁问题4.2 解决因指令重排序造成的线程不安全问题 1. 前言 单例模式是我们面试中最常考到的设计模式。什么是设计模式呢…

Linux 用户注意!GNOME 45 将影响所有扩展!

GNOME 45 是一次重要的升级,但对扩展的影响并不令人满意! 每当 GNOME 升级,总会有一些扩展遭遇问题,这点并不新鲜。但如今,到了 GNOME 45,每个扩展都将面临问题! 那么,究竟是什么原…

Lua学习笔记:探究package

前言 本篇在讲什么 理解Lua的package 本篇需要什么 对Lua语法有简单认知 对C语法有简单认知 依赖Visual Studio工具 本篇的特色 具有全流程的图文教学 重实践,轻理论,快速上手 提供全流程的源码内容 ★提高阅读体验★ 👉 ♠ 一级…

怒刷LeetCode的第8天(Java版)

目录 第一题 题目来源 题目内容 解决方法 方法一:双指针和排序 ​编辑第二题 题目来源 题目内容 解决方法 方法一:双指针 方法二:递归 方法三:快慢指针 方法四:栈 第三题 题目来源 题目内容 解决方法…