在UNITY中创建出一个简单的UI界面

来源:互联网 发布:为什么要学linux 编辑:程序博客网 时间:2024/05/22 08:16

在每一个软件的应用中,用户界面(UI)都是必不可缺少的一部分,是核心的特征。游戏也没有抛弃这一规则。

大部分的游戏都使用 UI 界面来方便快捷地显示一些信息,如在“音之国度”的游戏中,需要借助UI界面来显示技能,召唤兽的信息等。 Unity 3D 提供了许多 UI 组件,你都可以在你的游戏中使用它们。

今天我将要制作的,是一个简单的暂停菜单。这个暂停菜单将显示一个内容为『Paused』的 text 组件和三个按钮组件:分别是复位按钮『Resume』,重新开始按钮『Restart』,退出按钮『Quit』,并且还是显示游戏从场景加载到现在的时间。

首先需要在UNITY中创建一个空项目。

在层级视图上点击右键,并且选择UI->Canvas。


正如我在之前文章中所提到的那样,Canvas是所有UI组件的容器,是你存放这些UI组件的地方。任何您创建的UI组件都将会成为Canvas的一个子对象。当你创建Canvas的时候,你会主要到一个叫做"EventSystem"的东西也同时出现在你的层级视图中。这个东西是用来确定鼠标输入的,对于UI元素来说至关重要。


如何恰当地设置Canvas

  • 在层级视图中选择 Canvas。

  • 在检视视图中,找到『Render Mode』然后选择『Screen Space – Camera』。

  • 从层级视图中拖拽主摄像机到检视视图中 Canvas 的『Render Mode』上。



这样做可以确保我们的UI一直显示在摄像机的视图上

接下来我们需要创建一个自己的面板

同样是右键层级视图中的Canvas,然后选择UI->Panel

你会发现你的游戏画面上好像有一层半透明的白色覆盖。自己观察Panel的面板可以发现,每个Panel组件里,都连接着一个Image组件,这个组件的初始设置是白色和半透明的。

接下去添加一个内容为“暂停”的text组件。

在层级视图的Canvas上右键然后选择UI->Text。

在script界面中可以设置许多关于Text的参数,类似于颜色,字体,大小等。也可以使用类似HTML的方法来定义。比如:


使用后发现界面中显示的字体变成了粗体。


设置完Text的属性后,你可以在界面中自由地移动Text的位置,选择放置在任何你想要放置的位置。




之后我们继续进行按钮的设置操作。

我们将在这个界面上设置三个按钮,分别为“复位”“重新开始”“退出”。


首先需要在层级视图中右键Panel

选择UI->Button

重复两次该操作之后,就可以获得三个按钮

调整位置以后获得这样的一个效果:


然后选择Button里的text选项,进行文字内容的编辑:


还可以在Image界面中对按钮的颜色和材质进行修改,达到不同的效果。


还需要添加一个暂停计时的效果,一样是在Panel中创建一个Text的UI组件。修改文字内容后,调整位置。


现在我们需要为我们的UI创建一些功能。所以首先要做的是,创建一个空的游戏对象。在层级视图中选择这个对象,并且点击“Add Component”的按钮。下滑选择“New Script”,并且确定这是一个C# Script,用vs打开这个Script,在里面添加上你需要实现的功能的代码。

using UnityEngine;using System.Collections;using UnityEngine.UI; //Need this for calling UI scriptspublic class Manager : MonoBehaviour {[SerializeField]Transform UIPanel; //Will assign our panel to this variable so we can enable/disable it[SerializeField]Text timeText; //Will assign our Time Text to this variable so we can modify the text it displays.bool isPaused; //Used to determine paused statevoid Start (){UIPanel.gameObject.SetActive(false); //make sure our pause menu is disabled when scene startsisPaused = false; //make sure isPaused is always false when our scene opens}void Update (){timeText.text = "Time Since Startup: " + Time.timeSinceLevelLoad; //Tells us the time since the scene loaded//If player presses escape and game is not paused. Pause game. If game is paused and player presses escape, unpause.if(Input.GetKeyDown(KeyCode.Escape) && !isPaused)Pause();else if(Input.GetKeyDown(KeyCode.Escape) && isPaused)UnPause();}public void Pause(){isPaused = true;UIPanel.gameObject.SetActive(true); //turn on the pause menuTime.timeScale = 0f; //pause the game}public void UnPause(){isPaused = false;UIPanel.gameObject.SetActive(false); //turn off pause menuTime.timeScale = 1f; //resume game}public void QuitGame(){Application.Quit();}public void Restart(){Application.LoadLevel(0);}}
编辑结束以后,保存并关掉VS,返回到Unity的编辑器中。

在层级视图上对于刚刚创建的游戏项目左键点击,并把Panel拖拽到该游戏项目脚本的合适位置。

然后我们继续为按钮添加事件。

在层级视图中选中『Resume』按钮,然后在检视视图中找到『Button (Script)』组件,你会注意到有一个『On Click()』。这就是我们要给按钮添加功能的地方。在右侧菜单底部点击『+』图标,将会出现一个列表,拖拽『_GM』对象到这个位置。 
点击『No Function』下拉菜单,然后选择『Manager  UnPause()』

你刚刚所做的操作就是给按钮添加了一些功能。现在,当点击按钮的时候,UnPause()函数就会在运行的时候从『Manager』脚本连接到『_GM』游戏对象。为了让你通过一个按钮来调用一个函数,那么这个函数需要声明为 public,这就是为什么我在『Manager』脚本中把所有函数设置为public。

如果你现在运行游戏,按下『esc』键,就会出现暂停菜单,然后点击『Resume』按钮。菜单将会消失,游戏将恢复。这就意味着按钮的功能起作用了。

那么,让我们其他的按钮也变得起作用吧:

在层级视图中选中重试按钮并且找到『OnClick()
点击『+』图标,添加一个新的项
拖拽『_GM』对象到游戏物体区域
点击显示『No Function』的下拉菜单
选择 Manager > Restart()
最后,在层级视图中点击退出按钮也在检视视图中找到『OnClick()』
点击『+』图标,添加一个新的项
拖拽『_GM』对象到游戏物体区域
点击显示『No Function』的下拉菜单
选择 Manager > QuitGame()
在我们完成最后一件事前。为了让『Restart』功能能够起作用,我们需要添加我们的场景到场景的索引列表中。

File > Build Settings… > 点击 “Add Open Scenes” 按钮.

这就把当前场景分配到了场景列表里了。因为这是名单中唯一的一个,它的索引就是 0,所以『Restart()』函数才会调用『Application.LoadLevel(0)』。现在,如果你运行游戏并且按下『esc』键,你可以使用所有的按钮。除非你建立程序并运行它,否则退出按钮不会被注意到。Unity 编辑器无法退出应用程序,所以『Application.Quit()』函数不会做太多。但是如果点击 File > Build & Run 然后选择你想做的设置,这个项目将会运行到一个独立的窗口,然后点击退出就会看到程序退出了。

0 0
原创粉丝点击