UGUI基础篇 第(3)课: RectTransform组件常用小技巧与困惑知识点讲解

置顶 已于 2023-11-14 11:03:32 修改
阅读量2.7k 收藏 13
点赞数
分类专栏： Unity客户端 文章标签： Unity UGUI 游戏开发 RectTransform
于 2019-09-06 12:12:45 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/chongzi_daima/article/details/100560799
版权

RectTransform组件常用小技巧与困惑知识点讲解

一. Debug调试模式以及RectTransform两种位置属性的关系

1.Debug调试模式介绍

Debug模式用于查阅隐藏在组件内部，不在编辑器公开显示的属性。如AchorsPosition ，LocalPosition这些处于
RectTransform的并不在编辑器显示的属性。

开启方式：如图所示，点击红色箭头的尾部 （哈哈，没想到把，在尾巴处，不在箭头指向处）

在这里插入图片描述

之后：选择Debug模式，就会显示RectTransform的属性面板，这样我们测试开发起来会更加方便。

在这里插入图片描述

2.RectTransform两种Position属性的讲解(Anchored Position与Local Position)

在Debug模式下，我们有许多RectTransform的隐藏属性参数可以查阅。
下面我主要讲解一下容易造成误解的两个属性参数：(Anchored Position与Local Position)
从本质区别上Local Position是Vector3类型，继承自Transform，Anchored Position是Vector2类型，继承自RectTransform
但是我们往往在使用时发现他们的X，Y的数值是一样的，（请看演示1）其实他们也会有不同的时候，我将用案例给大家讲解一下他们在UGUI
中使用的区别之处。

演示1：在一个UI的Pivot与锚点重合的情况下（蓝色圆环与4个锚钉围成的锚点位置相同，或者查看Anchor 的x，y的min，max是否是相同的，且都对应与Pivot x，y的数值），Anchored Position与Local Position的X，Y 数值相同。请看图 1-2-1；

                                                                                   图1-2-1

演示2：在一个UI的锚点不在父物体的几何rect(矩形区域)中心情况下（图1-2-2），或者说4个锚钉之间只要有分开的情况下（图1-2-3），两个值都不会相同。

在这里插入图片描述
在这里插入图片描述

                                                                     上面两图为1-2-2

最低0.47元/天 解锁文章
【Unity3D小技巧】Unity3D中使用EventTrigger对3D物体的响应
CSDN博客专家，Unity3D高级软件工程师，《Unity 3D从入门到实战》作者。
09-18 1522
是Unity中用于处理UI事件的一个组件。它允许我们为UI元素（如按钮、图像等）添加事件监听器，从而响应各种交互事件，如鼠标点击、悬停、拖拽等。使用可以避免手动编写复杂的事件处理代码，使UI事件的响应更加简洁和易于管理。比手写UI的Event快很多,方便很多。这篇文章不探究组件与UI事件的交互，主要对焦与与3D物体的响应。
【Unity3D小功能】Unity3D中UGUI的Text、Dropdown输入特殊符号
CSDN博客专家，Unity3D高级软件工程师，《Unity 3D从入门到实战》作者。
01-25 3960
在开发中会遇到需要显示特殊符号的情况，比如上标、下标、平方等。这篇文章就来演示一下如何将特殊符号复制到里面，并且显示出来。那么，有同学就会问，为啥不带InputField。
UGUI中RectTransform的使用
weixin_39247181的博客
04-03 2165
Canvas子节点中的GameObject的Transform组件会被被RectTransform（下文简称rectT）组件所代替。可以看到，除了position，rotation，scale“三巨头”之外，还有anchors，pivot以及左上角的框框。 他们代表队是对齐方式。 首先是默认的对齐方式：我们可以看到，左上角的图标上写着middle，center。 anchors和pivot都是0.5。这个情况最贴近中学所学的平面直角坐标系： 1.已父节点的中心点为原点 2.坐标为x，y 3.宽高为widt
Unity3D–RectTransfrom 记录笔记
weixin_30684743的博客
03-07 340
一、基本要点 部分来源:http://www.2fz1.com/post/unity-ugui-recttransform/ RectTransform继承于Trasnfrom , 在Trasnform基础上,RectTransform增加了轴心(pivot),锚点(anchors),和尺寸变化量(sizeDelta). 其中anchors和pivot都是坐标原点在左下角的0-1向量空间,0-1代...
UGUI RectTransform的SizeDelta属性
最新发布
Morris-w的专栏
02-18 399
根据已知内容，
Unity UGUI 之 RectTransform详解
咩咩的博客
07-20 1172
2024/11/9重置,这下应该是非常清晰了
Unity RectTransform 组件
明明明的博客
11-24 6059
Unity RectTransform 锚点 中心点 自适应布局
UGUI 之 RectTransform
Mir_Cu的博客
03-08 276
RectTransform1.在项目中使用动态生成UI项目时要手动设置RectTransform，否则可能出现位置偏移的情况。 //设置Top的值为0GetComponent<RectTransform> ().offsetMax = new Vector2 (GetComponent<RectTransform> ().offsetMax.x, 0);  //设置Bott...
【Unity3D小功能】Unity3D中UGUI-Text实现打字机效果
CSDN博客专家，Unity3D高级软件工程师，《Unity 3D从入门到实战》作者。
06-07 1399
需求要实现Text的打字机效果，一看居然还没这类型的教程，遂补上。
【Unity3D小功能】Unity3D中实现箭头指向目标点的效果
CSDN博客专家，Unity3D高级软件工程师，《Unity 3D从入门到实战》作者。
03-29 1万+
推荐阅读 CSDN主页 GitHub开源地址 Unity3D插件分享 简书地址 我的个人博客 QQ群：1040082875 大家好，我是佛系工程师☆恬静的小魔龙☆，不定时更新Unity开发技巧，觉得有用记得一键三连哦。 一、前言 最近开发的时候遇到了箭头指向的需求，本来想用我这篇文章中的代码来着： 【Unity3D日常开发】Unity中实现箭头指向效果实现 但是想到这个代码是在Update里面运行，对效率影响比较大，正好看到这个同学给我留言： 我看了一下他这个是通过Shader和MeshRende.
UGUI学习-RectTransform组件
qq_41958491的博客
11-29 636
RectTransform基础概念 Anchors 锚点：当前UI对于它的中心点的对其方式 Pos X和Pos Y就是中心点相对于锚点的位置 Width和Height就是UI的宽和高 Pivot 中心点 点击可以切换自定义中心点或将中心点居中 当把锚点的四瓣拉开，并且分别设定为一定的位置时 Pos X会变成Left，表示此时左锚点与这个UI左边的距离（左锚点在其左边为正） Width会变成Right，表示此时右锚点与这个UI右边的距离（右锚点在其右边为正） P.
UGUI——RectTransform详解
热门推荐
SerenaHaven的博客
12-18 4万+
什么是RectTransform 创建一个UGUI控件时，查看其Inspector面板，原先熟悉的Transform已经被替换成RectTransform，面板也与原先的Transform的面板相去甚远。 先看看Unity官方对RectTransform的描述： Position, size, anchor and pivot information for a rectangle...
UGUI RectTransform组件
qq_28411953的博客
07-07 276
UGUI RectTransform组件
unity 之UGUI Recttransform
qq_37672438的博客
12-04 808
Rect Transform Transform 表示一个点, Rect Transform 表示一个矩形， UI可以放里面 Properties Property: Function: Pos (X, Y, Z) pivot point相对于 anchors的位置. Width/Height Width and height of the rectangle...
UGUI六大组件之RectTransform
holens01的博客
05-13 78
影响分辨率自适应时锚点边（点）到轴心点对应的点，还影响元素变大变小的方向。例：要让一个UI元素一直在左上角显示，则四个值都放在左上角。RectTransform 矩形变化。点击图标可以快捷设置锚点位置。1、Anchors锚点。2、Pivot轴心点。
UGUI-- RectTransform UI位置锚点组件
Go_Accepted的博客
04-18 640
1、RectTransform组件干什么的？ 继承于Transform，专门用于处理UI元素位置大小相关的组件 Transform组件只处理位置、角度、缩放 RectTransform在此基础上加入了矩形相关，将UI元素当作一个矩形来处理，加入了中心点、锚点、长宽等属性，其目的时更加方便地控制其大小以及分辨率自适应中的位置适应 2、RectTransform组件参数 （1）Pivot：轴心（中心）点，取值范围0~1 轴心即UI中的蓝色圆圈相对的位置，左下角为（0，0），右上角为（1，1），.
RectTransform
wwknan的博客
06-24 506
【UGUI进阶】RectTransform剖析
qq826364410的专栏
07-19 802
RectTransform 本文转载自uGUI知识点剖析之RectTransform 一、基本要点 RectTransform继承于Transform，在 Transform 基础上，RectTransform 增加了 轴心（pivot）、锚点（anchors）、和 尺寸变化量（sizeDelta）。 其中anchors和pivot都是坐标原点在左下角的0-1向量空间，0-
具体分析UGUI中RectTransform
weixin_30618985的博客
03-29 136
一:RectTransform 组件 1.Transform 组件是所有的游戏物体必备的一个组件，且不可删除，不可隐藏。就算是一个空物体，也是具备 Transform 组件的。 Unity3D4.6 版本开始，Unity 引擎内出现了一个自己的完整 UI 系统。在此之前，国内 90%以上的 Unity 项目，项目 UI 界面都是使用 NGUI 插件制作的。Unity 官方在推出 UGUI 系统...
unityUGUI自动适配
01-18
### Unity UGUI 自动适配屏幕分辨率和不同设备的最佳实践 #### 1. 使用 Canvas Scaler 组件优化 UI 布局 为了使UI能够适应不同的屏幕尺寸，在Canvas组件上添加`Canvas Scaler`是非常重要的。该组件提供了三种缩放模式来处理不同情况下的UI布局： - **Constant Pixel Size**: 此模式保持所有UI元素的像素大小不变，适用于不需要考虑分辨率差异的情况。 - **Scale With Screen Size**: 这种方式依据参考分辨率的比例调整UI对象的实际渲染尺寸，从而保证在各种屏幕上都能获得一致的效果[^1]。 ```csharp // 设置Canvas Scaler参数 canvasScaler.matchWidthOrHeight = 0; // 完全匹配宽度或高度 canvasScaler.referenceResolution = new Vector2(1920, 1080); // 设定参考分辨率为1920x1080 ``` #### 2. 调整锚点与矩形变换属性 通过合理设置UI控件的Anchor Points（锚点），可以确保它们相对于父级容器的位置关系不会因为窗口大小的变化而错乱。对于需要固定位置或者跟随边缘变动的对象来说尤其有用。同时利用RectTransform中的Pivot Point（轴心点）、Anchored Position（定位偏移量）以及Size Delta（尺寸增量）等特性进一步微调各个部件之间的间距和比例[^2]。 #### 3. 实现自定义脚本控制动态变化 当遇到更复杂的场景需求时，则可以通过编写C#脚本来实现更加灵活的功能逻辑。比如根据不同类型的终端加载特定资源文件；或是基于当前显示区域计算出最佳的文字字号、图片质量等级等参数并应用到对应的视觉元素之上[^4]。 ```csharp using UnityEngine; using UnityEngine.UI; public class ResolutionAdapter : MonoBehaviour { private void Start() { AdjustBackgroundImage(); } /// <summary> /// 根据屏幕纵横比调整背景图像填充策略 /// </summary> public void AdjustBackgroundImage(){ float aspectRatio = (float)Screen.width / Screen.height; Image backgroundImage = GetComponent<Image>(); if(aspectRatio >= 16f/9f){ // 对于宽屏采用裁剪拉伸的方式展示完整画面 backgroundImage.preserveAspect = false; backgroundImage.rectTransform.localScale = new Vector3(1, 1, 1); }else{ // 非标准比例则按照原始比例缩小至合适范围 backgroundImage.preserveAspect = true; backgroundImage.rectTransform.sizeDelta *= Mathf.Min(Screen.width/1920f , Screen.height/1080f ); } } } ```
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值