Unity【GUI】基础知识

关注

VIP免费原创 2024-06-26 01:32:22 835 阅读 AI 写同款· GEO 优化 ›

Unity中的UI系统之GUI 全局颜色//全局的着色颜色，影响背景和文本颜色//文本着色颜色//背景元素着色，和全局颜色相乘整体皮肤样式。阅读详情

什么是UI系统

Ul是UserInterface(用户界面)的简称

系统的主要学习内容

1.UI控件的使用
2.U控件的事件响应 
3.U的分辨率自适应

文章目录

基础知识
实践小项目

基础知识

1、工作原理和主要作用

1、GUI概念

即时模式游戏用户交互界面（IMGUI）
在Unity简称GUI
它是一个代码驱动的UI系统

2、GUI作用

1，作为程员的调试，创建游戏内调试身
2.为脚本组件创建自定义检视面板
3.创建新的编辑器窗口和工具以拓展Unity本身（一般用作内置游戏工具）

3、GUI的工作原理

在继承MonoBehaviour的脚本中的特殊函数里
调用GUI提供的方法，类似生命周期函数
    private void OnGUI()
    {
   
   
        //在其中书写GUI相关代码即可显示GUI内容
    }
注意：
	1.它每顿热行相当于是用于专门绘制GUI界面的函数
    2：一般只在其中执行GUI相关界面绘制和操作逻辑
	3.该函数在【OnDisable】之前【LateUpdate】之后执行
    4.只要是继承Mono的脚本都可以在OnGUI中绘制GUI

2、基本控件

在这里插入图片描述

1、文本和按钮控件

1、GUI控件绘制的共同点

1.他们都是GUI公共类中提供的静态函数，直接调用即可
2.他们的参数都大同小异
    位置参数：Rect参数 x y位置 w h尺寸
    显示文本：string参数
    图片信息：Texture参数
    综合信息：GUIContent参数
    自定义样式：GUIStyle参数
3.每一种控件都有多种重载，都是各个参数的排列组合
	必备的参数内容是【位置信息】和【显示信息】

2、文本控件

public Rect rect; //位置
public Texture text; //图片
public GUIContent content; //综合使用
public GUIStyle style; //自定义样式

private void OnGUI()
{
   
   
    1、基本使用
        GUI.Label(new Rect(0, 0, 100, 20), "文本控件");
        GUI.Label(rect, text);
    2、综合使用 (左图，右文字)
        GUI.Label(rect, content);
    3、获取GUI控件对应的信息
        Debug.Log(GUI.tooltip);
    4、自定义样式
        GUI.Label(new Rect(0, 0, 100, 20), "文本控件", style);
    	字体路径 C:\Windows\Fonts
}

3、按钮控件

public Rect btnRect;
public GUIContent btnContent;
public GUIStyle btnStyle;

private void OnGUI()
{
   
   
    if(GUI.Button(btnRect, btnContent, btnStyle))
    //Button 按下抬起算一次点击
    //RepeatButton 长按，一直返回true
    {
   
   
        Debug.Log("按钮被点击");
    }
}

2、多选框和单选框

1、多选框

普通样式
     private bool isSel;

     private void OnGUI()
     {
   
   
         isSel = GUI.Toggle(new Rect(0, 0, 100, 30), isSel, "效果开关");
     }

自定义样式
    修改固定宽高 fixedWidth 和 fixedHeight
    修改从GUIStyle边缘到内容起始处的空间 padding

2、单选框

private int nowSelIndex = 1;

private void OnGUI()
{
   
   
    //Toggle点击后返回true
    if(GUI.Toggle(new Rect(0, 100, 100, 20), nowSelIndex == 1, "选项一"))
        nowSelIndex = 1;
    if (GUI.Toggle(new Rect(0, 140, 100, 20), nowSelIndex == 2, "选项二"))
        nowSelIndex = 2;
    if (GUI.Toggle(new Rect(0, 180, 100, 20), nowSelIndex == 3, "选项三"))
        nowSelIndex = 3;
}

3、输入框和拖动条

1、输入框

普通输入
    private string inputStr;
    private void OnGUI()
    {
   
   
        //5为最大输入长度
        inputStr = GUI.TextField(new Rect(0, 0, 100, 30), inputStr,5);
    }
密码输入
    private string inputPW;
    private void OnGUI()
    {
   
   
        inputPW = GUI.PasswordField(new Rect(0, 0, 100, 30), inputPW, '*');
    }

2、拖动条

水平拖动条
    private float nowValue = 0.5f;
    private void OnGUI()
    {
   
   
        nowValue = GUI.HorizontalSlider(new Rect(0, 100, 100, 50), nowValue, 0, 1);
    }
竖直拖动条
    nowValue = GUI.VerticalSlider(new Rect(0, 150, 50, 100), nowValue, 0, 1);

4、图片绘制和框

1、图片绘制

public Rect texPos;
public Texture tex;
public ScaleMode mode; //显示模式
	//ScaleAndCrop: 通过宽高裁剪
	//ScaleToFit: 缩放不会变形
	//ScaleToFill: 填充满宽高（默认）
public bool alpha; //背景是否透明
private void OnGUI()
{
   
   
    GUi.DrawTexture(texPos, tex, mode, alpha);
}

2、框绘制

GUI.Box(texPos, "");

3、复合控件

在这里插入图片描述

1、工具栏和选择网格

1、工具栏

private int toolbarIndex = 0;
private string[] toolbarInfos = new string[] {
   
    "选项一", "选项二", "选项三" };

private void OnGUI()
{
   
   
    toolbarIndex = GUI.Toolbar(new Rect(0, 0,