美文网首页
unity ugui基础(一)

unity ugui基础(一)

作者: qiaoqiao123 | 来源:发表于2019-04-18 23:02 被阅读0次

    尽可能的让UI元素合批

    首先创建一个新的场景,摄像camera为Solod Color

    然后创建两个Button 去掉对应的Text,运行unity发现产生的Batches变为2

    在进行UI设计额时候尽量少使用来自不同Atlas的材质,也尽量避免这种倾轧的情况(Scene视图调节为Writeframe模式可以更容易查看),尽可能把所有的文字放到图片之上,使用同种字体,更容易进行合批

    在拼UI的过程中会添加很多图片文字,但是很容易会忽略其中一点就是把无用的RaycastTarget去掉,因为开启此选项,虽然此组建虽然不需要接受射线,但是它而然工作且消耗性能

    特性是一个直接/间接继承自Attribute的类,约定俗成用attribute结尾,然后声明的时候可以省略

    UGUI基础

    • 画布Canvas
    • 设置自适应
    • UI控件的绘制顺序

    UI元素绘制顺序和在Hierarchy(层级视图)中的顺序。后面的将在更早的上面绘制。改变元素的层级关系(绘制顺序,上下关系),可以通过拖拽,进行简单的排序。也可以通过脚本:使用使用Transform组件上的方法:SetAsFirstSibing,SetAsLastSibing和SetSiblingIndex。

    • 绘制模式

    1.在screen空间中渲染
    2.在world空间中渲染

    Screen Space-Overlay
    Screen Space-Camera
    World Space

    • UI控件的布局

    RectTransform,让 UI 控件有了“自适应”的本事!

    • Rect Tool小工具

    Rect Transform 组件除了拥有 Transform 组件的位置(Position)、朝向(Rotation)和缩放(Scale)属性外,还纳入了更多的属性: Width、 Height、 Anchors、 Pivot 和 Anchor Presets。
    Width 和 Height 用于表示 UI 控件的长和宽
    Pivot 用于表示 UI 控件的轴心点,在 Scene 视图中用蓝色的空心小圆圈表示;当开发者对 UI 控件做旋转处理的时候, UI 控件旋转时所围绕的点就是轴心点。

    • RectTransform组件 (重点

    Rect Transform 组件除了拥有 Transform 组件的位置(Position)、朝向(Rotation)和缩放(Scale)属性外,还纳入了更多的属性: Width、 Height、 Anchors、 Pivot 和 Anchor Presets。

    Width 和 Height 用于表示 UI 控件的长和宽 ;

    Pivot 用于表示 UI 控件的轴心点,在 Scene 视图中用蓝色的空心小圆圈表示;当开发者对 UI 控件做旋转处理的时候, UI 控件旋转时所围绕的点就是轴心点。

    • Anchors属性

    用于指定自身相对父级的布局。锚点一共有四个,分别对应自身矩形的四个顶点。在父级元素形状发生变化时,四个锚点到四个顶点的偏移offset不变。

    从锚点的位置所导致 UI 控件自适应的效果上来看,应该发现一个不变的真理,就是表示锚点的 4 个三角形,始终与 UI 控件边框 4 个角的距离是固定的。

    Min 记录的是 Anchors 左下角小三角的位置, Max 记录的是 Anchors右上角小三角的位置。

    使用 Anchor Presets 属性也可以一并设置 UI 控件的 Pivot 和 Position 属性,只需要按下 Shift 和 Alt 键盘即可

    可视功能的UI组件

    • Text控件

    Material:用于设置文字的材质。注意:游戏场景中的文字控件本身就是一个游戏对象,当前就可以设置它的材质属性了。
    Character 表示接下来的属性负责设置字符的格式:
    Line Spacing:用于设置文字的行间距
    Rich Text:决定文本中的标记元素是否可用
    Paragraph 表示接下来的属性负责设置字符构成的段落的格式:
    Alignment:用于设置段落的对齐方式
    Horizontal Overflow:当段落内容的宽度大于 Text(Script)组件本身的宽度时,处理段落内容有两种可选的方式,分别为 Wrap(换行)和 Overflow(溢出)。
    Best Fit:是否应该忽略对文字大小的设置,让字体的大小自动改变到能让段落的内容全部显示出来的状态

    • Image控件

    用于向玩家显示不可交互的图片信息,常作为游戏场景的装饰。

    Source Image:指定 Image(Script)组件要显示的图片;

    Image(Script)组件显示的图片必须是 Sprite 类型的。这就要求开发者在将这个图片导入到 Unity 中的时候,设置此图片的 Texture Type 属性为 Sprite(2D and UI)。

    Image Type 用于设置图片的显示类型,可选的属性值有 Simple、 Sliced、 Tiled 和 Filled。不同的图片显示类型,导致了 Sprite“填充”图片控件的不同方式。

    Simple: Sprite 将直接显示在图片控件中。默认情况下,如果图片控件的大小与 Sprite不一致时,后者将经过拉伸处理来符合前者的大小;但如果此时复选了Preserve Aspect属性,那么图片在经过缩放处理时,长宽的比例将保持恒定。

    Sliced:Sprite 将被看作是由 9 个切片组成的;若此时选中了 Fill Center 属性,那么将显示完整的中间切片.

    Tiled:此种类型的 Sprite 一般尺寸较小;为使此 Sprite 填满整个图片控件,就会在保持 Sprite 尺寸不变的前提下不断重复,就像是在铺地板砖一样.

    Filled:此种类型的 Sprite 与 Simple 相似,但是它可以表现出一种“从无到有”的呈现过程;“呈现方式”也叫“填充方式”,由 Fill Method 属性决定,可选项有 Horizontal、Vertical、Radial 90、Radial 180 和 Radial 360, Fill Origin 决定了填充操作的起点,Fill Amount 决定了填充的进度。

    Set Native Size:单击此按钮,将使得图片控件的大小主动调节到与 Sprite 原始大小 一致

    • RawImage控件
    • Mask组件

    拥有Mask(Script)组件的 UI 控件,可以限制其子对象的显示范围,即当子对象的显示范围明显大于父对象的显示范围时,游戏视图就只显示父对象范围内的子对象,其它部分自动隐藏。父对象是 Panel,子对象是 Image,为前者添加 Mask(Script)组件

    image

    Show Mask Graphic:此属性决定是否显示父对象上的图片

    参考文献:

    https://www.jianshu.com/p/2b5e8c11c4ea

    https://blog.csdn.net/bobo553443/article/details/79484144

    相关文章

      网友评论

          本文标题:unity ugui基础(一)

          本文链接:https://www.haomeiwen.com/subject/jhnxgqtx.html