1. AI技术聚合首页
  2. Python

【unity之UI专题】GUI(IMGUI)详解

扎眼的阳光 • • Python • 阅读 82

👨‍💻个人主页：@元宇宙-秩沅

👨‍💻 hallo 欢迎 点赞👍 收藏⭐ 留言📝 加关注✅!

👨‍💻 本文由 秩沅 原创

👨‍💻 收录于专栏：unity实战入门

⭐IMGUI原理⭐

文章目录

    • ⭐IMGUI原理⭐
    • 🎶前言
    • 🎶（A）IMGUI工作原理
    • 🎶（B）IMGUI——基本控件
    • 🎶（C）IMGUI基本控件—文本控件
    • 🎶（D）IMGUI基本控件—按钮控件
      • 练习操作
    • 🎶（E）IMGUI基本控件—多选框和单选框
      • 练习操作
    • 🎶（G）IMGUI基本控件—拖动条
      • 练习操作
    • 🎶（F）IMGUI基本控件—输入框
      • 练习操作
    • 🎶（H）IMGUI基本控件—图片绘制
    • 🎶（III）IMGUI——复合控件
    • 🎶（J）IMGUI复合控件—工具栏（标签）
      • 练习操作
    • 🎶（K）IMGUI复合控件—分组和滚动视图
      • 实践练习
    • 🎶（L）IMGUI复合控件—窗口相关
      • 实践练习
    • 🎶（M）IMGUI综合—GuiSkin
    • 🎶（N）IMGUI综合—GUILayout
    • ⭐相关文章⭐

🎶前言

  • IMGUI不会用作游戏的UI开发
  • 会用到游戏的编辑器开发

🅰️ 题单来自：唐老狮

🎶（A）IMGUI工作原理

🎶（B）IMGUI——基本控件


  • GUIContent —–可以是以下三者的结合

    tooltip–鼠标选中后课得到该信息（作为隐藏信息使用）
  • GUIStyle ———全部综合
    1.Nomal ——正常情况
    2.Hover——鼠标停留后
    3.Active——按下之后

🎶（C）IMGUI基本控件—文本控件

🎶（D）IMGUI基本控件—按钮控件

  • 点击的逻辑情况 ——> GUI.Button == true ;
    （在原地方点击后松开才算一次点击）

练习操作

  • 用GUI制作一个游戏开始界面,上面有开始游戏,退出游戏,设置等等按钮选项，点击开始游戏可以切换到游戏场景
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.SceneManagement;
//-------------------------------------
//—————————————————————————————————————
//___________项目:  标签和按钮组件的应用     
//___________功能： 主面板界面 
//___________创建者：秩沅_______________
//_____________________________________
//-------------------------------------
public class GuiExsi : MonoBehaviour
{
    public Rect RectLabel;
    public Rect RectButton1;
    public Rect RectButton2;
    public Rect RectButton3;
  
    public GUIContent guiContent;
    public GUIStyle guistyle;

    public GUIStyle button1;
    public GUIStyle button2;
    public GUIStyle button3;

    private void OnGUI()
    {
        //------------开始游戏基本画面--------------

        GUI.Label(RectLabel , guiContent ,guistyle);
        if (GUI.Button(RectButton1, "开始游戏", button1))
        {
            SceneManager.LoadScene("simple1");
                
        }
        GUI.Button(RectButton2,"设置", button2);
        GUI.Button(RectButton3, "退出游戏",button3);

        //------------游戏设置面板--------------



    }
}

🎶（E）IMGUI基本控件—多选框和单选框



练习操作

在上一题基础上，弄一个游戏设置面板
有背景音乐的开关和音效的开关
并且点击开始界面的设置可以打开设置面板

  • 设置界面主代码

//-------------------------------------
//—————————————————————————————————————
//___________项目: GUI组件练习 
//___________功能： 设置面板    
//___________创建者：秩沅_______________
//_____________________________________
//-------------------------------------
public class GUISetPlane : MonoBehaviour
{
    static public  GUISetPlane instance;
    public Rect SetLable1, SetLable2;
    public Rect closeButPos;
    public GUIContent closeButton;

    private  bool swtich1 = true ;
    private  bool swtich2 = true ;
    private  bool swtich3 = true;
    public Rect SetLable3;
    //-----------------------------------

    public void Active()      //让自身激活
    {
        Debug.Log("设置面板已经激活");
        GUISetPlane a = instance.gameObject.GetComponent<GUISetPlane>() as GUISetPlane;
        a.enabled = true;
    }

    public void DisActive()   //让自身失活
    {
        Debug.Log("设置面板已经失活");
        GUISetPlane a = instance.gameObject.GetComponent<GUISetPlane>() as GUISetPlane;
        a.enabled = false ;
    }

    //-------------------------------------
    private void OnGUI()
    {
       
        swtich1 = GUI.Toggle(SetLable1, swtich1, "音效开关");

        swtich2 = GUI.Toggle(SetLable2, swtich2, "音乐开关");

        swtich3 = GUI.Toggle(SetLable3, swtich3, "音乐开关");

        if (GUI.Button(closeButPos, closeButton))
        {
            Debug.Log("已点击关闭窗口");
            DisActive();
            GuiExsi.instance.gameObject.GetComponent<GuiExsi>().enabled = true ;
        }
    }
    private void Awake()
    {
        instance = this;
    }
}
  • 开始界面主代码
//-------------------------------------
//—————————————————————————————————————
//___________项目:   GUI组件练习     
//___________功能：  开始界面    
//___________创建者：秩沅
//_____________________________________
//-------------------------------------

public class GuiExsi : MonoBehaviour
{
    static public GuiExsi instance;
    //---------------------------
    public Rect RectLabel;
    public Rect RectButton1;
    public Rect RectButton2;
    public Rect RectButton3;
    public GUIContent guiContent;
    public GUIStyle guistyle;
    public GUIStyle button1;
    public GUIStyle button2;
    public GUIStyle button3;
    //---------------------------
    public void Active()      //让自身激活
    {
        Debug.Log("主面板已经激活");
        GuiExsi a =instance.gameObject.GetComponent<GuiExsi>() as GuiExsi;
        a.enabled = true ;
    }
    public void DisActive()   //让自身失活
    {
        Debug.Log("主面板已经失活");
        GuiExsi a = instance.gameObject.GetComponent<GuiExsi>() as GuiExsi;
        a.enabled = false;
    }
    private void OnGUI()
    {
        //------------开始游戏基本画面--------------

        GUI.Label(RectLabel , guiContent ,guistyle);
        if (GUI.Button(RectButton1, "开始游戏", button1))
        {
            SceneManager.LoadScene("simple1");               
        }

        GUI.Button(RectButton3, "退出游戏",button3);

       if(GUI.Button(RectButton2, "设置", button2))
        {
            Debug.Log("已点击设置");
            DisActive();
              GUISetPlane.instance.gameObject.GetComponent<GUISetPlane>().enabled = true ;
     
        }   
    }
    private void Awake()
    {
         instance = this;
    }
}

🎶（G）IMGUI基本控件—拖动条

练习操作

  • 在原有的基础上加入拖动条
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
//-------------------------------------
//—————————————————————————————————————
//___________项目: 单选框和拖动条的应用 
//___________功能： 音效设置面板    
//___________创建者：秩沅_______________
//_____________________________________
//-------------------------------------
public class GUISetPlane : MonoBehaviour
{
    //-----------------------------------
    static public  GUISetPlane instance;
    public Rect SetLable1, SetLable2;
    
    public Rect closeButPos;
    public GUIContent closeButton;
    private  bool swtich1 = true ;
    private  bool swtich2 = true ;

    //-----------------------------------

    float ling1 = 1f;
    float ling2 = 1f;
    public Rect roelPso1;
    public Rect roelPso2;
    public Rect texturePos;
    public Texture texture;

    //-----------------------------------

    public void Active()      //让自身激活
    {
        Debug.Log("设置面板已经激活");
        GUISetPlane a = instance.gameObject.GetComponent<GUISetPlane>() as GUISetPlane;
        a.enabled = true;
    }

    public void DisActive()   //让自身失活
    {
        Debug.Log("设置面板已经失活");
        GUISetPlane a = instance.gameObject.GetComponent<GUISetPlane>() as GUISetPlane;
        a.enabled = false ;
    }
    //-------------------------------------
    private void OnGUI()
    {
        GUI.DrawTexture(texturePos, texture);
        swtich1 = GUI.Toggle(SetLable1, swtich1, "音效开关");
        swtich2 = GUI.Toggle(SetLable2, swtich2, "音乐开关");

          ling1 = GUI.HorizontalSlider(roelPso1 , ling1, 1, 0);
          ling2 = GUI.HorizontalSlider(roelPso2 , ling2, 1, 0);

        if (GUI.Button(closeButPos, closeButton))
        {
            Debug.Log("已点击关闭窗口");
            DisActive();
            GuiExsi.instance.gameObject.GetComponent<GuiExsi>().enabled = true ;
        }
    }
    private void Awake()
    {
        instance = this;
    }
}

🎶（F）IMGUI基本控件—输入框

练习操作

  • 在之前的基础上
    弄一个登陆面板
    有用户名输入和密码输入
    有进入游戏和返回上一级按钮
    点击开始界面中的开始游戏后 进入登陆面板
    输入的 用户名为 admin 密码为8888才能切换场景
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.SceneManagement;
//-------------------------------------
//—————————————————————————————————————
//___________项目:   输入框的和图片绘制组件的应用
//___________功能：  登录界面面板
//___________创建者：秩沅_______________
//_____________________________________
//-------------------------------------
public class RegisterIn : MonoBehaviour
{
    public   Rect fieldPos1;
    public   Rect fieldPos2;
    public   Rect texturePos;
    public   Rect buttonPos,buttonPos2;
    public   Rect lable1, lable2;
    public   Texture backGrounp;
    public   GUIContent content,content2;
    public   GUIStyle buttonStyle, buttonStyle2;
    string acount = "";
    string secret = "";
    static public RegisterIn instance;
    //-------------------------------------
    public void Active()      //让自身激活
    { 
        RegisterIn a = instance.gameObject.GetComponent<RegisterIn>() as RegisterIn;
        a.enabled = true;
    }
    public void DisActive()   //让自身失活
    {      
        RegisterIn a = instance.gameObject.GetComponent<RegisterIn>() as RegisterIn;
        a.enabled = false;
    }
    //-------------------------------------
    private void OnGUI()
    {
        GUI.DrawTexture(texturePos, backGrounp);
        acount = GUI.TextField(fieldPos1 , acount);
        secret = GUI.PasswordField(fieldPos2, secret, '*');
        GUI.Label (lable1  ,"用户名");
        GUI.Label (lable2  , "密码");
        //信息正确载入场景
        if ( GUI.Button(buttonPos, content, buttonStyle))
        {
            if( acount == "admin" && secret == "88888")
            {
                SceneManager.LoadScene("simple1");
                Debug.Log("登录成功");
            }          
        }
        //返回到主界面
        if (GUI.Button(buttonPos2, content2, buttonStyle2))
        {
            DisActive();
            GuiExsi.instance.gameObject.GetComponent<GuiExsi>().enabled = true;
        }

    }
    private void Awake()
    {
        instance = this;
    }
}

🎶（H）IMGUI基本控件—图片绘制


🎶（III）IMGUI——复合控件

🎶（J）IMGUI复合控件—工具栏（标签）


练习操作

  • 在登录进去的界面后，创建三个信息标签
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
//-------------------------------------
//—————————————————————————————————————
//___________项目:  复合控件工具栏的应用    
//___________功能： 信息显示面板
//___________创建者：秩沅_______________
//_____________________________________
//-------------------------------------
public class Maincontent : MonoBehaviour
{
    //默认选择第一个表格
    int num = 0;    
    public Rect toolPos2 ;
    public GUIStyle messStyle;
    string[] mess = { "人物信息","装备信息","宠物信息"};
    private void OnGUI()
    {      
          //num =  GUI.Toolbar(toolPos1,num,mess);
          num = GUI.SelectionGrid(toolPos2, num, mess,1, messStyle);

    }

}

🎶（K）IMGUI复合控件—分组和滚动视图


实践练习

  • 动态变化滚动视图的内容框长度
using System.Collections;
using System.Collections.Generic;
using System.Text;
using UnityEngine;
//-------------------------------------
//—————————————————————————————————————
//___________项目:  复合控件工具栏的应用    
//___________功能： 信息显示面板
//___________创建者：秩沅_______________
//_____________________________________
//-------------------------------------
public class Maincontent : MonoBehaviour
{
    
    int num = 0; //默认选择第一个表格
    public int viewNumber;
    public Rect toolPos2 ,showPos,contenPos ;
    public Vector2 scorllPos;
    public GUIStyle messStyle;
    string[] mess = { "人物信息","装备信息","宠物信息"};
    string[] messView = {"装备1", "装备2", "装备3", "装备4", "装备5" };
    
    private void OnGUI()
    {      
          //num =  GUI.Toolbar(toolPos1,num,mess);
        num = GUI.SelectionGrid(toolPos2, num, mess,1, messStyle);


        //动态变化内容框的长度——随着内容的数量而改变
        contenPos.height = viewNumber * 30;

        scorllPos = GUI.BeginScrollView(showPos, scorllPos, contenPos);
        
        for (int i = 0; i < viewNumber ; i++)
        {
            GUI.Button(new Rect(0,i * 30, 50, 30),messView[i]);
        }
       
        GUI.EndScrollView();
    }

}

🎶（L）IMGUI复合控件—窗口相关

  • ID相当于窗口唯一识别码

实践练习

  • 将游戏退出


//-------------------------------------
//—————————————————————————————————————
//___________项目:       ______________
//___________功能： 退出确定窗口
//___________创建者：秩沅_______________
//_____________________________________
//-------------------------------------
public class ExitWindows : MonoBehaviour
{
    static public ExitWindows instance;
    public Rect windowPos;
    //---------------------------
    public void Active()      //让自身激活
    {
        Debug.Log("主面板已经激活");
        ExitWindows a = instance.gameObject.GetComponent<ExitWindows>() as ExitWindows;
        a.enabled = true;
    }
    public void DisActive()   //让自身失活
    {
        Debug.Log("主面板已经失活");
        ExitWindows a = instance.gameObject.GetComponent<ExitWindows>() as ExitWindows;
        a.enabled = false;
    }
    private void OnGUI()
    {
        GUI.ModalWindow(1, windowPos, (int id)=> WinFuction(1) , "提示");
        
    }
    public Rect pos1, pos2, pos3;
    public void WinFuction( int id)
    {
        
        GUI.Label(pos1, "请再次确认");
        if(GUI.Button(pos2, "退出"))
        {
            Application.Quit();
        }
        else if (GUI.Button(pos3, "取消"))
        {
            DisActive();
        }
    }
    
    private void Awake()
    {
        instance = this;
    }
}

🎶（M）IMGUI综合—GuiSkin

  • 图片中备注来自唐老狮

🎶（N）IMGUI综合—GUILayout

⭐相关文章⭐

⭐【2023unity游戏制作-mango的冒险】-6.关卡设计

⭐【2023unity游戏制作-mango的冒险】-5.攻击系统的简单实现

⭐【2023unity游戏制作-mango的冒险】-4.场景二的镜头和法球特效跟随

⭐【2023unity游戏制作-mango的冒险】-3.基础动作和动画API实现

⭐【2023unity游戏制作-mango的冒险】-2.始画面API制作

⭐【2023unity游戏制作-mango的冒险】-1.场景搭建

⭐“狂飙”游戏制作—游戏分类图鉴（网易游学）

⭐本站最全-unity常用API大全（万字详解），不信你不收藏

你们的点赞👍 收藏⭐ 留言📝 关注✅是我持续创作，输出优质内容的最大动力！

文章出处登录后可见！

已经登录？立即刷新

共计人评分，平均分

到目前为止还没有投票！成为第一位评论此文章。

赞 (0)
扎眼的阳光的头像扎眼的阳光普通用户
0
上一篇 2023年9月6日
下一篇 2023年9月6日

相关推荐