UGUI

最新推荐文章于 2024-07-15 23:28:18 发布

SJY_ZY

最新推荐文章于 2024-07-15 23:28:18 发布

阅读量221

点赞数

分类专栏： unity

本文链接：https://blog.youkuaiyun.com/weixin_43899645/article/details/112478938

版权

unity 专栏收录该内容

14 篇文章

订阅专栏

Canvas(画布)

render mode（渲染模式）

在这里插入图片描述

Overlay:UI在摄像机的前面，不需要摄像机，灯光等，永远显示在屏幕上.
sort order为选择层次
在这里插入图片描述
Camera:UI通过摄像机显示（注意需要为渲染摄像机赋值），赋值之后画布将跟随摄像机移动，这种方式支持在ui前方显示3D模型和粒子系统。
plane distance是摄像机和ui的距离

在这里插入图片描述

wouldspace：UI和摄像机没有任何关系，表示这个UI自由处于3D空间中。

canvas scaler

在这里插入图片描述
constant pixel size为固定像素模式
scale with screen size 为可以自己设定屏幕像素

constant physical size 是固定物理大小

panel（面板）

主要用于整体管理控件，在面板上可以整体的移动和处理控件

eventsystem（事件系统）

事件系统是整个UI的控制系统，如果关闭了事件系统，整个ui都会停止使用
在这里插入图片描述

text

在这里插入图片描述
字体的文件后缀为.ttf字体文件可以直接拖入到font里面，直接更改字体
font style里面是粗体和斜体

line spacing 是行间距
rich text 是富文本
可以通过富文本来控制text内容
在这里插入图片描述

Tag	用途	写法
-b-	-加粗-	`<b>Hello</b>`
-i-	-斜体-	`<i>Hello</i>`
-size-	-设置字体大小-	`<size=50>Hello</size>`
-color-	-设置字体颜色-	`<color=#ff000000>指定RGB的16进制值</color> <color=red>指定颜色名称</color>`
-material-	-指定材质（仅对网格文本有用）-	`<material=2>指定的数字是材质在网格的材质数组中的下标</material>`
quad	指定网格文本的一些属性	`<quad material=1 size=20 x=0.1 y=0.1 width=0.5 height=0.5 />`

在这里插入图片描述
horizontai overflow
是否选择横向溢出文本框

wrap表示不溢出

overflow表示溢出

vertical overflow
表示是否纵向溢出

truncate表示不溢出

overflow表示溢出

best fit
表示字体自适应文本框
文本框小字体就小，文本框大字体就打大，min和max是分别设置最小和最大字体
在这里插入图片描述

image

在这里插入图片描述

source image

不能直接拖拽我们平时用的图片
因为source image装的是sprite（精灵），这是一种针对2d图片特殊的文件格式
需要在图片里面修改类型
把texture type 选择为sprite 默认是defaulf
之后图片就会出现一个播放按钮
在这里插入图片描述
左图是精灵类型，右图是默认

这样就可以直接拖拽到source image里面了

preserve aspect

是长宽等比例
set native size
是选择原本像素的大小
在这里插入图片描述

image type(图片类型)

在这里插入图片描述

simple

：简单模式，就是跟随image边框大小变化
在这里插入图片描述

tiled

:是自动填充整个image框
在这里插入图片描述

filled

可以做出一些基础特效
在这里插入图片描述
fill method 里面有
horizontal
vertical
radial 90
radial 180
radial 360

拖动下面的fill amount就可以根据fill method里面的选项来消失方式比如 radial 360 ，旋转消失

fill origin 可以设置动画源头

Sliced

表示切片，一般图片是不能设置sliced的
需要在图片里面设置九宫格
点击图片选择 sprite editor

在这里插入图片描述
如果没有下载精灵编辑包需要下载

在WIINDOW下选择 package manager

在这里插入图片描述
选择 2d sprite 然后安装就可以了

点开sprite editor看到图片边框有绿色的点

拖拽绿色的点可以设置slice

这个时候图片在放大的时候就只会放大绿点范围内的图片外面的不会放大

button

interactable

使能键，可以通过代码的方式让button失效，一般在登录界面输入非法字符的时候可以通过interactable让button失效

在这里插入图片描述

transition

在这里插入图片描述
none是没有转变

color tint

是通过颜色来区分点击，触碰等
normal color 是不触碰的颜色
highlighted color是触碰的颜色
pressed color 是点击的颜色
selected color 是点击一次之后的颜色
disabled color 使能失效之后的颜色

在这里插入图片描述

sprite swap

精灵过度
在这里插入图片描述

动画过度

在这里插入图片描述
点击aoto Generate Animation,保存文件在resources里面
在button的属性栏下面会生成一个动画状态机

双击controller button
进入animator界面

需要先做动画
点击button控件选择窗口点击动画

进入动画制作窗口，可以选择不同状态时的动态效果，失能，触碰，常规，点击，选择
在这里插入图片描述
点击录制按钮，将帧数改为1，这个时候可以对button做出改变，都会在第一帧的时候被执行，比如这个时候更改button的大小（scale框会变红）

不同的帧数可以控制不同效果，然后结束录制