Unity3D笔记 GUI 一

偏执的太偏执、 2021-11-09 10:48 369阅读 0赞

要实现的功能：

1、个性化Windows界面  
　　2、减少个性化的背景图片尺寸  
　　3、个性化样式ExitButton和TabButton  
　　4、实现三个选项卡窗口

## 一、个性化Windows界面 ##

1.1、创建一个空的GameObject、在Project中新建GUI Skin 用于绘制Windows图片

![221752423926670.jpg][]

1.2 GUI Skin设置

![221756174366701.jpg][]

1.3效果 按M键盘 弹出Windows窗口

![221800467144802.gif][]

## 二、减少个性化的背景图片尺寸 ##

因GUISkin中图片我们用的是大图片这个在游戏中不但占资源对性能也有影响，和WebForm中相似的是都可以通过样式来使用小图片来完成大图片的功能。Unity3D也不例外：

![221806050625124.jpg][]

效果很不好，设置下即可，按下面图片的尺寸

![221806543428346.jpg][]

![221809209223126.jpg][]

## 三、个性化样式ExitButton和TabButton ##

3.1

![221820064939520.jpg][]

3.2、效果

![221824051838341.gif][]

3.3、TabButton

![221828272278464.jpg][]

## 四、实现三个选项卡窗口   ##

4.1、效果出来了 不过不美观（代码见下有具体注释）

![221838221091636.jpg][]

4.2、设置

![221843458044862.jpg][]

4.3、再看看效果

![221845026778375.gif][]

## 五、最终效果 ##

![221906139564993.gif][]

代码：

using UnityEngine;
    using System.Collections;
    
    public class myTest : MonoBehaviour
    {
        /// <summary>
        /// 是否打开窗口
        /// </summary>
        bool isOpenMenu = false;
        /// <summary>
        /// 窗体的大小和位置【矩形】
        /// </summary>
        Rect myWindow = new Rect(10, 10, 640, 480);
        /// <summary>
        /// GUI　Ｓｋｉｎ
        /// </summary>
        public GUISkin customSkin;
        /// <summary>
        /// 关闭按钮
        /// </summary>
        Rect closeButton = new Rect(598, 8, 26, 22);
    
        /// <summary>
        /// 用于工具栏在屏幕上的矩形位置
        /// </summary>
        Rect tabButton = new Rect(35, 15, 490, 40);
        /// <summary>
        /// 选项卡索引号
        /// </summary>
        int toolsCount = 0;
        /// <summary>
        /// 显示在工具栏按钮上的字符串数组
        /// </summary>
        string[] toolsName = { "选项卡1", "选项卡2", "选项卡3" };
    
        /// <summary>
        /// 选项卡中的图片
        /// </summary>
        public Texture img;
    
        Rect imgRect = new Rect(19, 35, 225, 441);
        // Use this for initialization
        void Start()
        {
    
        }
    
        // Update is called once per frame
        void Update()
        {
            if (Input.GetKey(KeyCode.M))//当通过名称指定的按键被用户按住时返回true
            {
                isOpenMenu = true;
            }
        }
    
        void OnGUI()
        {
            GUI.skin = customSkin;
            if (isOpenMenu)
            {
                int windowId = 0;
                myWindow = GUI.Window(windowId, myWindow, WindowFunction, "Hello Window");
                #region Mathf.Clamp 限制
                // 限制value的值在min和max之间， 如果value小于min，返回min。 如果value大于max，返回max，否则返回value
                myWindow.x = Mathf.Clamp(myWindow.x, 0, Screen.width - myWindow.width);// [klæmp] vt.& vi. 夹紧，夹住；锁住；把（砖等）堆高
                myWindow.y = Mathf.Clamp(myWindow.y, 0, Screen.height - myWindow.height);
                #endregion
            }
        }
    
        void WindowFunction(int windowId)
        {
            //begin 关闭按钮
            if (GUI.Button(closeButton, "", GUI.skin.GetStyle("closeButton")))
            {
                isOpenMenu = false;//单击关闭按钮：窗口菜单关闭
            }
            //end
    
            //beign 选项卡
            //返回int类型，被选择按钮的索引号
            toolsCount = GUI.Toolbar(tabButton, toolsCount, toolsName, GUI.skin.GetStyle("tabButton"));//工具栏
            //end
    
            //begin 选项卡图片
            GUI.DrawTexture(imgRect, img);
            //end
            GUI.DragWindow();//拖动窗口 
        }
    
    }

转载于:https://www.cnblogs.com/PEPE/p/3561139.html

[221752423926670.jpg]: /images/20211109/99a8260e839c4ed3a5e47be065b560b0.png
[221756174366701.jpg]: /images/20211109/46fe2ecd4cdc4a66941df38540baba27.png
[221800467144802.gif]: /images/20211109/70a5bc44aaa74da78981931cc414d71c.png
[221806050625124.jpg]: /images/20211109/6b280140925b4072ba026847f7d9619b.png
[221806543428346.jpg]: /images/20211109/73a281f437b84e0b90e464b0aae6d312.png
[221809209223126.jpg]: /images/20211109/1203237357a0486c9e350e93192fbe4b.png
[221820064939520.jpg]: /images/20211109/e7c119f41037488c9917e9b522f0fc61.png
[221824051838341.gif]: /images/20211109/131b5136b9574b29a4f534e23b2d77fe.png
[221828272278464.jpg]: /images/20211109/7002aa0bda714624b42726ba2f33d92e.png
[221838221091636.jpg]: /images/20211109/3b6765fc789b4f9dbfd768a86b54d3c3.png
[221843458044862.jpg]: /images/20211109/b008c665675a4fccad63821382e8f50d.png
[221845026778375.gif]: /images/20211109/4c1a879a62df4167b2f2bee3a85d3c58.png
[221906139564993.gif]: /images/20211109/5a031f4596cc41d095baeb2006b52db0.png