Unity(2022.3.41LTS) - UI简介,了解

目录

零.简介

一、主要组件

二、布局组件

四、创建和编辑 UI

五、代码控制 UI

六、优化和注意事项

---

零.简介

Unity UI（用户界面）是 Unity 引擎中用于创建游戏界面和交互元素的强大工具集。

一、主要组件

1. Canvas（画布）：

   • 是 UI 元素的容器，所有的 UI 元素都必须是 Canvas 的子对象。
   • 有不同的渲染模式，如 Screen Space - Overlay（覆盖在屏幕上）、Screen Space - Camera（通过相机渲染）和 World Space（在 3D 世界中作为一个普通游戏对象）。
   • 

2. Text（文本）：

   • 用于显示文本信息，可以设置字体、大小、颜色等属性。
   • 

3. Image（图像）：

   • 可以显示静态图片或 Sprite（精灵图）。
   • 支持多种图像格式，并且可以通过代码动态更改显示的图像。
   • 

4. Button（按钮）：

   • 提供用户交互的主要方式之一，当用户点击按钮时，可以触发特定的事件。
   • 可以设置按钮的外观、文本和交互效果。
   • 

5. Slider（滑动条）：

   • 允许用户通过拖动滑块来选择一个数值范围内的值。
   • 常用于音量控制、进度条等场景。
   • 

6. Toggle（开关）：

   • 类似于一个复选框，用于表示一个布尔值的状态。
   • 可以设置开关的外观和文本。
   • 
7. 滚动条 
8. 滚动视图 
9. 下拉
10. 输入框

二、布局组件

1. Rect Transform（矩形变换）：

   • 每个 UI 元素都有一个 Rect Transform，用于控制元素的位置、大小和旋转。
   • 可以通过设置锚点和偏移量来实现自适应布局。
   • 

2. Horizontal Layout Group（水平布局组）和Vertical Layout Group（垂直布局组）：

   • 用于自动排列子元素，使其在水平或垂直方向上对齐。
   • 可以设置间距、对齐方式等属性。
   • 
   • 

3. Grid Layout Group（网格布局组）：

   • 将子元素排列在一个网格中，可以设置行数、列数、间距等属性。
   • 

三、事件系统

1. Event System（事件系统）：

   • 负责处理用户输入事件，如鼠标点击、触摸等。
   • 可以将事件绑定到特定的 UI 元素上，当用户与该元素交互时，触发相应的事件处理函数。
   • 

2. Event Trigger（事件触发器）：

   • 可以添加到 UI 元素上，用于定义各种交互事件，如点击、悬停、按下等。
   • 通过脚本可以为这些事件添加自定义的处理逻辑。

四、创建和编辑 UI

1. 在 Unity 编辑器中，可以通过 GameObject -> UI 菜单创建各种 UI 元素。
2. 使用 Inspector 窗口可以调整 UI 元素的属性，如位置、大小、颜色等。
3. 可以使用布局组件来自动排列 UI 元素，以实现良好的界面布局。
4. 

五、代码控制 UI

1. 通过脚本可以动态地创建、修改和删除 UI 元素。
2. 可以获取 UI 元素的引用，并通过代码修改它们的属性，如文本内容、图像显示等。
3. 可以为 UI 元素的事件添加处理函数，以实现交互逻辑。

using TMPro;
using UnityEngine;
using UnityEngine.UI;

public class UIController : MonoBehaviour
{
    public TextMeshProUGUI myText;
    public Button myButton;

    void Start()
    {
        myButton.onClick.AddListener(OnButtonClick);
    }

    void OnButtonClick()
    {
        myText.text = "Button clicked!";
    }
}

在这个示例中，通过代码获取了一个文本和一个按钮的引用，并为按钮的点击事件添加了一个处理函数，当按钮被点击时，修改文本的内容。

六、优化和注意事项

1. 优化 UI 性能：避免在每一帧都更新大量的 UI 元素，尽量减少不必要的重绘。可以使用合批技术来减少绘制调用次数。
2. 适配不同屏幕尺寸：使用锚点和布局组件可以使 UI 适应不同的屏幕尺寸和分辨率。
3. 注意 UI 层级：确保 UI 元素的层级正确，避免被其他元素遮挡或出现显示问题。
4. 测试和调试：在不同的设备上进行充分的测试，确保 UI 在各种情况下都能正常显示和交互。