uGUI练习(一) Anchor

简介:



一、练习步骤

如果用过NGUI的Anchor,我们知道在2.x的版本有UIAnchor组件(下图左),3.x版本中,每个UIWidget有自带的Anchors(下图右)

imageimage

而uGUI的Anchor用起来也一样很直观,简单易使用。

1、创建一个新场景,我们创建一个UI/Button

image——>image——>image

2、创建完成后,观察Scene中的情况

image

3、Inspector截图,注意图中框选的部分,对于Anchor很有用。

image

4、在Scene里拖动Button(注意:拖动浅白色圆圈image,而不是image)

image

image

通过上面的拖动观察,我们可以得到,它是先Anchor在中心(0,0,0),然后根据你的拖动而做偏移。

5、在Inspect属性面板中,点击Rect Transform的图标image,弹出如下选项

image

下面我们解释一下这些图形的意思(按住 Alt 显示Position)

image

6、有了上面的概念之后,我们就可以轻松的完成Anchor了,比如我想Anchor在左下角,那我只需要选择 bottom – left

image

7、选择完之后,在场景中可以看到,Button已经Anchor在左下角了,同进看到Anchors下的值也发生了改变。

imageimage

8、查看Game视图,拉伸窗口不管在什么分辨率下,Button都始终固定在左下角

image

二、完成练习

image

三、Anchor效果

imageimage



本文转自赵青青博客园博客,原文链接:http://www.cnblogs.com/zhaoqingqing/p/3972656.html,如需转载请自行联系原作者

相关文章
SwiftUI—如何给图像视图添加遮罩以突出主题
SwiftUI—如何给图像视图添加遮罩以突出主题
694 0
SwiftUI—如何给图像视图添加遮罩以突出主题
|
7月前
|
图形学
【unity小技巧】实现FPS武器的瞄准放大效果(UGUI实现反向遮罩,全屏遮挡,局部镂空效果)
【unity小技巧】实现FPS武器的瞄准放大效果(UGUI实现反向遮罩,全屏遮挡,局部镂空效果)
126 1
|
6月前
|
前端开发
Canvas绘画之图像合成,图像层叠效果
Canvas绘画之图像合成,图像层叠效果
|
8月前
|
计算机视觉
【YOLOv8改进】Shape-IoU:考虑边框形状与尺度的指标(论文笔记+引入代码)
YOLO目标检测专栏探讨了边框回归损失的创新方法,强调了目标形状和尺度对结果的影响。提出的新方法Shape-IoU关注边框自身属性,通过聚焦形状和尺度提高回归精度。实验显示,该方法提升了检测效果,超越现有技术,在多个任务中达到SOTA。论文和代码已公开。
SVG 夜晚的灯塔案例(use、mask、clipPath ...)
SVG 夜晚的灯塔案例(use、mask、clipPath ...)
89 0
|
8月前
|
机器学习/深度学习 编解码 自然语言处理
SCLIP?与CLIP是什么关系?比CLIP高40点,这么离谱吗?
SCLIP?与CLIP是什么关系?比CLIP高40点,这么离谱吗?
136 0
项目实战(三):banner加载网络图片,不变形,可缩放可完全显示
项目实战(三):banner加载网络图片,不变形,可缩放可完全显示
|
定位技术
Cesium系列:加载不规则形状出图
Cesium加载不规则形状出图
505 0
|
存储 计算机视觉 索引
目标检测的Tricks | 【Trick11】label的缩放与显示
目标检测的Tricks | 【Trick11】label的缩放与显示
175 0
目标检测的Tricks | 【Trick11】label的缩放与显示
|
图形学 开发者
Unity【Dynamic Bone】- 关于人物模型头发、衣物等细节的处理
Unity【Dynamic Bone】- 关于人物模型头发、衣物等细节的处理
422 0