Unity图形用户界面!*★,°*:.☆( ̄▽ ̄)/$:*.°★* 。(万字解析)

Unity 3D GUI 简介

游戏开发过程中,开发人员往往会通过制作大量的图形用户界面( Graphical User Interface,GUI )来增强游戏与玩家的交互性。

Unity 3D 中的图形系统分为 OnGUINGUIUGUI等,这些类型的图形系统内容十分丰富,包含游戏中通常使用到的按钮、图片、文本等控件。

概念

图形用户界面是指采用图形方式显示的计算机用户操作界面。

与早期计算机使用的命令行界面相比,图形界面相对来说在视觉上更具有吸引力,信息传达能力更生动、交互性更强。

《植物大战僵尸》中的 GUI

发展

在游戏开发的整个过程中,游戏界面占据了非常重要的地位。

玩家在启动游戏的时候,首先看到的是游戏的GUI,其中包括贴图、按钮、高级控件等。

早期的 Unity 3D 使用的是 OnGUI 系统,后来升级到 NGUI 系统。

在 Unity 4.6 之后,官方推出了新的 UGUI 系统,采用全新的独立坐标系,为游戏开发者提供了更高的运转效率。

各个时期的 Unity GUI :

Unity 3D OnGUI 常用控件 

OnGUI Button 控件

在 Unity 3D 开发中 Button 控件是游戏开发中最常使用的控件之一,用户常常通过 Button 控件来确定其选择行为,当用户单击 Button 控件时,Button 控件会显示按下的效果,并触发与该控件关联的游戏功能。

在游戏中通常用作游戏界面、游戏功能、游戏设置的开关。

一般来说,按钮分两种:

  • 普通按钮。

  • 图片按钮。

普通按钮

普通按钮是系统默认显示的按钮,Unity 3D 的普通按钮背景呈半透明状态,显示白色文字。

普通按钮的使用方法如下:

 
  1. public static function Button(position:Rect, text:string):bool;
  2. public static function Button(position:Rect, image:Texture):bool;
  3. public static function Button(position:Rect, content:GUIContent):bool;
  4. public static function Button(position:Rect, text:string, style:GUIStyle):bool;
  5. public static function Button(position:Rect, image:Texture, style:GUIStyle):bool;
  6. public static function Button(position:Rect, content:GUIContent, style:GUIStyle):bool;

注:

  • position 指按钮在屏幕上的位置以及长宽值。

  • text 指按钮上显示的文本。

Button 控件的参数如下表所示。

参数描述
position设置控件在屏幕上的位置及大小。
image设置控件上显示的纹理图片。
style设置控件使用的样式。
text设置控件上显示的文本。
content设置控件的文本、图片和提示。

使用案例

  1. 启动 Unity 3D 创建新项目。

  1. 执行 File → Save Scene 命令,并保存场景。

  1. 创建 JavaScript 脚本。

  1. 打开脚本编辑器,输入脚本语句,然后保存。

 
  1. function OnGUI(){
  2. if(GUI.Button(Rect(0, 0, 100, 50), "click here")){
  3. print("you have click here!");
  4. }
  5. }

  1. 将脚本与主摄像机相连。

将脚本拖到 Hierarchy 视图中的 Main Camera 对象中产生关联。

  1. 测试脚本。

单击 Unity 3D 工具栏上的运行按钮对脚本进行测试,如下图所示,在 Game 视图中出现了一个按钮,按钮上显示 "click here",单击该按钮,在 Unity 3D 主界面底部的状态栏上输出 "You have click here"。

图片按钮

Button 控件除了可以显示文字以外,还可以显示贴图。

贴图是一种美化按钮的方法,开发者可以设定按钮的背景图片,比如水晶按钮、卡通按钮等。

在 Unity 3D 中实现 Button 贴图十分容易,只要将图片作为一个参数传递到 Button 函数中即可。

Button 贴图方法如下:

 
  1. public static function Button(position:Rect, image:Texture):bool;
  2. public static function Button(position:Rect, image:Texture, style:GUIStyle):bool;

其中 Position 定义了按钮在屏幕上的位置及长宽值,image 为按钮上显示的图片。

使用案例

  1. 启动 Unity 3D 创建新项目,将其命名为 Button

  1. 在菜单中执行 File → Save Scene 命令,保存当前场景,命名为 scene,即在 Unity 3D 中创建了一个游戏场景。

  1. 单击 Project 视图中 create 右侧的下拉三角形,选择 JavaScript ,创建 JavaScript 脚本。

  1. 在 Project 视图中双击该脚本文件,打开脚本编辑器,输入下列脚本语句:

 
  1. var btnTexture:Texture;
  2. var atnTexture:Texture;
  3. function OnGUI(){
  4. if(!btnTexture){
  5. Debug.LogError("Please assign a texture on the inspector");
  6. return;
  7. }
  8. if(!atnTexture){
  9. Debug.LogError("Please assign a texture on the inspector");
  10. return;
  11. }
  12. if(GUI.Button(Rect(Screen.width/2-50, Screen.height/2+130, 70, 70),atnTexture)){
  13. Application.LoadLevel("play");
  14. }
  15. if(GUI.Button(Rect(Screen.width/2+30, Screen.height/2+130, 70, 70),btnTexture)){
  16. Application.LoadLevel("exit");
  17. }
  18. }

  1. 保存脚本(Ctrl+S 键)。

  1. 将脚本与主摄像机相连。

  1. 单击主摄像机,在 Inspector 属性面板中添加纹理图片。

  1. 单击 play 按钮测试效果,可以看见按钮已经换成了二维卡通图片的形式,如下图所示。

OnGUI Box 控件 

Unity 3D Box 控件用于在屏幕上绘制一个图形化的盒子。

Box 控件中既可以显示文本内容,也可以绘制图片,或两者同时存在。

GUIContent 和 GUIStyle 对于 Box 控件同样适用,既可以用来修饰 Box 控件的文本颜色,也可以用来修饰文本大小、图片资源等。

具体使用方法如下:

 
  1. public static function Box(position:Rect, text:string):void;
  2. public static function Box(position:Rect, image:Texture):void;
  3. public static function Box(position:Rect, content:GUIContent):void;
  4. public static function Box(position:Rect, text:string, style:GUIStyle):void;
  5. public static function Box(position:Rect, image:Texture, style:GUIStyle):void;
  6. public static function Box(position:Rect, content:GUIContent, style:GUIStyle):void;

注:

  • position 为矩形区域的位置。

  • text 为显示的文本信息。

  • texture 为纹理(即图片)显示。

Box 控件的具体属性参数如下表所示。

选项描述
position设置控件在屏幕上的位置及大小。
image设置控件上显示的纹理图片。
style设置控件使用的样式。
text设置控件上显示的文本。
content设置控件的文本、图片和提示。

使用案例

  1. 创建项目,将其命名为 box,保存场景。

  1. 在 Unity 3D 菜单栏中执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中双击该脚本文件,打开脚本编辑器,输入下列语句:

 
  1. function OnGUI(){
  2. GUI.Box(Rect(0, 0, 100, 50), "Top-Left");
  3. GUI.Box(Rect(Screen.width-100, 0, 100, 50), "Top-Right");
  4. GUI.Box(Rect(0, Screen.height-50, 100, 50), "Buttom-Left");
  5. GUI.Box(Rect(Screen.width-100, Screen.height-50, 100, 50), "Buttom-Right");
  6. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,将其连接到 Main Camera 上。

  1. 单击 Play 按钮进行测试,Game 视图的 4 个角出现了 4 个标题分别为 Top-LeftTop-RightBottom-LeftBottom-Right 的按钮组件,如下图所示。

 OnGUI label 控件

Unity 3D Label 控件用于在设备的屏幕上创建文本标签和纹理标签,和Box 控件类似,可以显示文本内容或图片。

Label 控件一般用于显示提示性的信息,如当前窗口的名称、游戏中游戏对象的名字、游戏对玩家的任务提示和功能介绍等。

具体使用方法如下:

 
  1. public static function Label(position:Rect, text:string):void;
  2. public static function Label(position:Rect, image:Texture):void;
  3. public static function Label(position:Rect, content:GUIContent):void;
  4. public static function Label(position:Rect, text:string, style:GUIStyle):void;
  5. public static function Label(position:Rect, image:Texture, style:GUIStyle):void;
  6. public static function Label(position:Rect, content:GUIContent, style:GUIStyle):void;

其中,position 为 Label 显示的位置,text 为 Label 上显示的文本,image 为 Label 上显示的纹理图片。

参数列表:

参数描述
position设置控件在屏幕上的位置及大小。
image设置控件上显示的纹理图片。
style设置控件使用的样式。
text设置控件上显示的文本。
content设置控件的文本、图片和提示。

使用案例

  1. 创建项目,将其命名为 Label,保存场景。

  1. 在 Unity 3D 菜单栏中执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中双击该脚本文件,打开脚本编辑器,输入下列语句:

 
  1. var textureToDisplay:Texture2D;
  2. function OnGUI(){
  3. GUI.Label(Rect(10, 10, 100, 20), "Hello World!");
  4. GUI.Label(Rect(10, 40, textureToDisplay.width, textureToDisplay.height),textureToDisplay);
  5. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,将其连接到 Main Camera

  1. 单击主摄像机,在 Inspector 属性面板中添加纹理图片。

  1. 单击 Play 按钮进行测试,如下图所示,界面上出现一串文字以及贴图。

OnGUI Background Color 控件 

Unity 3D Background Color 控件主要用于渲染 GUI 的背景。

例如,要绘制一个按钮,希望按钮的背景呈现出红色,可以使用 BackgroundColor 来实现。

使用时要对其作如下定义:

 
  1. public static var backgroundColor:Color;

  • Color 为 GUI 背景的渲染颜色。

使用案例

下面是 GUI.Background Color 控件的使用案例。

  1. 创建项目,将其命名为 backgroundcolor,保存场景。

  1. 在 Unity 3D 菜单栏中执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中双击该脚本文件,打开脚本编辑器,输入下列语句:

 
  1. function OnGUI(){
  2. GUI.backgroundColor=Color.red;
  3. GUI.Button(Rect(10, 110, 70, 30), "A button");
  4. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,将其连接到 Main Camera 上。

  1. 单击运行按钮进行测试,绘制的按钮由于背景颜色的设定将会呈现红色。

OnGUI Color 控件

Unity 3D Color 控件与 Background Color 控件类似,都是渲染 GUI 颜色的,但是两者不同的是 Color 不但会渲染 GUI 的背景颜色,同时还会影响 GUI.Text 的颜色。

具体使用时,要作如下定义:

 
  1. public static var color:Color;

Color 为渲染颜色。

使用案例

  1. 创建项目,将其命名为 GUI.Color,保存场景。

  1. 在 Unity 3D 菜单栏中执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中双击该脚本文件,打开脚本编辑器,输入下列语句:

 
  1. function OnGUI(){
  2. GUI.Color=Color.yellow;
  3. GUI.Label(Rect(10, 10, 100, 20), "Hello World!");
  4. GUI.Box(Rect(10, 50, 50, 50), "A BOX");
  5. GUI.Button(Rect(10, 110, 70, 30), "A button");
  6. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,将其连接到 Main Camera 上。

  1. 单击 Play 按钮进行测试,效果如下图所示,绘制的按钮背景和字体由于 GUI.Color 的设定而呈现黄色。

OnGUI TextField 控件 

Unity 3D TextField 控件用于绘制一个单行文本编辑框,用户可以在该单行文本编辑框中输入信息。

每当用户修改文本编辑框中的文本内容时,TextField 控件就会将当前文本编辑框中的文本信息以字符串形式返回。

开发人员可以通过创建 String 变量来接收返回值并实现相关功能。

因此 TextField 控件常常用于监听用户输入信息,比如玩家在游戏登录界面输入用户名和密码后,TextField 控件可以判断其输入是否正确。

其使用方法如下:

 
  1. public static function TextField(position:Rect, text:string):string;
  2. public static function TextField(position:Rect, text:string, maxLength:int):string;
  3. public static function TextField(position:Rect, text:string, style:GUIStyle):string;
  4. public static function TextField(position:Rect, text:string, maxLength:int,style:GUIStyle):string;

注:

  • position 为显示区域。

  • text 为字符串。

参数列表

参数描述
position设置控件在屏幕上的位置及大小。
maxLength设置输入的字符串的最大长度。
text设置控件上默认显示的文本。
style设置控件使用的样式。

使用案例

  1. 创建项目,将其命名为 GUI.TextField,保存场景。

  1. 执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中打开脚本编辑器,输入下列语句:

 
  1. var stringToEdit:String="Hello World";
  2. function OnGUI(){
  3. stringToEdit=GUI.TextField(Rect(10, 10, 200, 20), stringToEdit, 25);
  4. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,将其连接到 Main Camera 上。

  1. 进行测试,运行效果如下图所示,界面中出现了一个文本框,可以进行文本的输入。

OnGUI TextArea 控件 

Unity 3D TextArea 控件用于创建一个多行的文本编辑区。用户可以在多行文本编辑区编辑文本内容。

该控件可以对超出控件宽度的文本内容实现换行操作。

TextArea 控件同样会将当前文本编辑区中的文本内容以字符串形式返回。

开发人员可以通过创建 String 变量来接收返回值并实现相关功能。

具体使用方法如下:

 
  1. public static function TextArea(position:Rect, text:string):string;
  2. public static function TextArea(position:Rect, text:string, maxLength:int):string;
  3. public static function TextArea(position:Rect, text:string, style:GUIStyle):string;
  4. public static function TextArea(position:Rect, text:string, maxLength:int,style:GUIStyle):string;

注:

  • 其中,position 为显示位置。

  • text 为字符。

参数列表

参数描述
position设置控件在屏幕上的位置及大小。
maxLength设置输入的字符串的最大长度。
text设置控件上默认显示的文本。
style设置控件使用的样式。

使用案例

  1. 创建项目,将其命名为 GUI.TextArea,保存场景。

  1. 执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中打开脚本编辑器,输入下列语句:

 
  1. var stringToEdit:String="Hello World\nI've got 2 lines...";
  2. function OnGUI(){
  3. stringToEdit=GUI.TextArea(Rect(10, 10, 200, 100), stringToEdit, 200);
  4. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,并将其拖曳到 Hierarchy 视图中的 Main Camera 上,使脚本和摄像机产生关联。

  1. 进行脚本测试,如下图所示。

OnGUI ScrollView 控件 

当游戏界面中的内容特别多,超出了屏幕的显示范围时,就可以使用 Unity 3D ScrollView 控件滚动显示界面内的全部内容。

ScrollView 控件用于在屏幕上创建滚动视图,通过一片小区域查看较大区域的内容。当内容区域大于查看区域时,该控件就会自动生成垂直(水平)滚动条,用户可以通过拖曳滚动条来查看所有内容。

一般情况下,滚动条由两部分组成:

  • GUI.BeginScrollView,用于开始滚动视图。

  • GUI.EndScrollView,用于结束滚动视图。

需要滚动显示的内容就夹在其间。

使用方法:

 
  1. public static function BeginScrollView(position:Rect, scrollPosition:Vector2,viewRect:Rect):Vector2;
  2. public static function BeginScrollView(position:Rect, scrollPosition:Vector2,viewRect:Rect, alwaysShowHorizontal:bool, alwaysShowVertical:bool,horizontalScrollbar:GUIStyle, verticalScrollbar:GUIStyle):Vector2;
  3. public static function EndScrollView():void;

参数列表

参数描述
position设置控件在屏幕上的位置及大小。
viewRect设置滚动整体显示范围。
HorizontalScrollbar设置用于水平滚动条的可选 GUI 样式。
VerticalScrollbar设置用于垂直滚动条的可选 GUI 样式。
ScrollPosition用来显示滚动位置。
alwaysShowHorizontal 可选参数,总是显示水平 滚动条。
alwaysShow Vertical可选参数,总是显示垂直 滚动条。

使用案例

  1. 创建项目,将其命名为 BeginScrollView,保存场景。

  1. 执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中打开脚本编辑器,输入下列语句:

 
  1. var scrollPosition:Vector2=Vector2.zero;
  2. function OnGUI(){
  3. scrollPosition=GUI.BeginScrollView(Rect(10, 300, 100, 100),
  4. scrollPosition, Rect(0, 0, 220, 200));
  5. GUI.Button(Rect(0, 0, 100, 20), "Top-left");
  6. GUI.Button(Rect(120, 0, 100, 20), "Top-right");
  7. GUI.Button(Rect(0, 180, 100, 20), "Bottom-left");
  8. GUI.Button(Rect(120, 180, 100, 20), "Bottom-right");
  9. GUI.EndScrollView();
  10. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,将其连接到 Main Camera 上。

  1. 进行测试,效果如下图所示。

OnGUI Slider 控件 

Unity 3D Slider 控件包括两种:

  • 水平滚动条 GUI.HorizontalSlider

  • 垂直滚动条 GUI.VerticalSlider

可以根据界面布局的需要选择使用,具体使用方法如下:

 
  1. public static function HorizontalSlider(position:Rect, value:float, leftValue:float, rightValue:float):float;
  2. public static function HorizontalSlider(position:Rect, value:float, leftValue:float, rightValue:float, slider:GUIStyle, thumb:GUIStyle):float;

注:

  • position 为滚动条的位置。

  • value 为可拖动滑块的显示位置。

  • topValue 为滑块上端所处的位置。

  • bottomValue 为滑块下端所处位置。

参数列表

参数描述
position设置控件在屏幕上的位置及大小。
leftValue设置滑块左端的值。
slider设置用于显示拖曳区域的 GUI 样式。
value设置滑动条显示的值。这决定了可 拖动的滑块的位置。
rightValue设置滑块右端的值。
thumb设置用于显示可拖动的滑块的 GUI 样式。

使用案例

  1. 创建项目,将其命名为 horizontalSlider,保存场景。

  1. 执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中打开脚本编辑器,输入下列语句:

 
  1. var hSliderValue:float=0.0;
  2. var vSliderValue:float=0.0;
  3. function OnGUI(){
  4. hSliderValue=GUI.HorizontalSlider(Rect(2 5, 2 5, 1 0 0, 3 0), hSliderValue, 0.0, 1 0.0);
  5. vSliderValue=GUI.VerticalSlider(Rect(5 0, 5 0, 1 0 0, 3 0), vSliderValue, 1 0.0, 0.0);
  6. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,将其连接到 Main Camera 上。

  1. 进行测试,效果如下图所示。

OnGUI ToolBar 控件 

Unity 3D ToolBar 控件主要用于创建工具栏。

具体使用方法如下:

 
  1. public static function Toolbar(position:Rect, selected:int, texts:string[]):int;
  2. public static function Toolbar(position:Rect, selected:int, images:Texture[]):int;
  3. public static function Toolbar(position:Rect, selected:int, content:GUIContent[]):int;
  4. public static function Toolbar(position:Rect, selected:int, texts:string[],style:GUIStyle):int;
  5. public static function Toolbar(position:Rect, selected:int, images:Texture[],style:GUIStyle):int;
  6. public static function Toolbar(position:Rect, selected:int, contents:GUIContent[], style:GUIStyle):int;

注:

  • position 为 ToolBar 的显示区域。

  • selected 为选中菜单的索引号。

  • texts 为菜单显示内容。

参数列表

参数描述
position设置控件在屏幕上的位置及大小。
texts设置在工具栏按钮上显示的一组 字符串。
contents 在工具栏按钮上显示的一组文本、 图像和工具提示。
selected选择按钮的索引。
images在工具栏按钮上显示的一组纹理。
style要使用的样式。如果省略,则使用当前 GUISkin 的按钮样式。

使用案例

  1. 创建项目,将其命名为 GUI.Toolbar,保存场景。

  1. 执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中打开脚本编辑器,输入下列语句:

 
  1. var toolbarInt:int=0;
  2. var toolbarStrings:String[]=["Toolbar1", "Toolbar2", "Toolbar3"];
  3. function OnGUI(){
  4. toolbarInt=GUI.Toolbar(Rect(25, 25, 250, 30), toolbarInt, toolbarStrings);
  5. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,将其连接到 Main Camera 上。

  1. 进行测试,效果如下图所示。

OnGUI ToolTip 控件 

Unity 3D ToolTip 控件主要用于显示提示信息。

当鼠标移至指定位置时,会显示相应的提示信息,在使用时需要和 GUI.Content 配合。

具体使用方法如下:

 
  1. public static var tooltip:string

使用案例

  1. 创建项目,将其命名为 GUI.Tooltip,保存场景。

  1. 执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中打开脚本编辑器,输入下列语句:

 
  1. function OnGUI(){
  2. GUI.Box(Rect(5, 35, 210, 175), GUIContent("Box", "this box has a tooltip"));
  3. GUI.Button(Rect(30, 85, 100, 20), "No tooltip here");
  4. GUI.Button(Rect(30, 120, 100, 20),
  5. GUIContent("I have a tooltip", "The button overrides the box"));
  6. GUI.Label(Rect(10, 40, 100, 40), GUI.tooltip);
  7. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,将其连接到 Main Camera 上。

  1. 进行测试,效果如下图所示。

OnGUI Drag Window 控件 

Unity 3D Drag Window 控件用于实现屏幕内可拖曳窗口的功能。

具体使用方法如下:

 
  1. public static function DragWindow(position:Rect):void;

参数列表

参数描述
position设置可以拖动的窗口的一部分,这部分将被剪切到实际的窗口中。

使用案例

  1. 创建项目,将其命名为 GUI.Dragwindow,保存场景。

  1. 执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中打开脚本编辑器,输入下列语句:

 
  1. var windowRect:Rect=Rect(20, 20, 120, 50);
  2. function OnGUI(){
  3. windowRect=GUI.Window(0, windowRect, DoMyWindow, "My Window");
  4. }
  5. function DoMyWindow(windowID:int){
  6. GUI.DragWindow(Rect(0, 0, 10000, 20));
  7. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,并将其拖曳到 Hierarchy 视图中的 Main Camera 上,使脚本和摄像机产生关联。

  1. 进行测试,效果如下图所示,当用鼠标拖动窗口时,窗口会随鼠标在屏幕内移动。

OnGUI Window控件 

通常情况下,一个游戏界面可以由很多窗口组成,在每个窗口中可以添加不同的、任意的功能组件,这让窗口的使用丰富了游戏界面和内容。

使用 Window 控件为当前界面添加窗口,具体方法如下:

 
  1. public static function Window(id:int, clientRect:Rect, func:GUI.WindowFunction,text:string):Rect;
  2. public static function Window(id:int, clientRect:Rect, func:GUI.WindowFunction,image:Texture):Rect;
  3. public static function Window(id:int, clientRect:Rect, func:GUI.WindowFunction,content:GUIContent):Rect;
  4. public static function Window(id:int, clientRect:Rect, func:GUI.WindowFunction,text:string, style:GUIStyle):Rect;
  5. public static function Window(id:int, clientRect:Rect, func:GUI.WindowFunction,image:Texture, style:GUIStyle):Rect;
  6. public static function Window(id:int, clientRect:Rect, func:GUI.WindowFunction,title:GUIContent, style:GUIStyle):Rect;

注:

  • id 为窗口的标号,用以标识窗口。

  • clientRect 为窗口显示区域。

  • func 是回调方法的名称。

  • text 为窗口标题。

参数列表

参数描述
Style设置用于窗口的可选样式。如果遗漏了,则使用当前GUISkin的窗口样式。
clientRect设置可以拖动的窗口的一部分,这部分将被剪切到实际的窗口中。
text设置文本在窗口内呈现。
content设置在窗口内渲染的图形。
title设置文本在窗口标题栏显示。
id设置窗口的ID号(可以是任何值, 只要它是唯一的)。
func设置显示窗口内容的脚本函数。
image设置在窗口中渲染的图像。
style设置窗口的样式信息。

使用案例

  1. 创建项目,将其命名为 window,保存场景。

  1. 执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中打开脚本编辑器,输入下列语句:

 
  1. var windowRect0:Rect=Rect(20, 20, 120, 50);
  2. var windowRect1:Rect=Rect(20, 100, 120, 50);
  3. function OnGUI(){
  4. GUI.color=Color.red;
  5. windowRect0=GUI.Window(0, windowRect0, DoMyWindow, "Red Window");
  6. GUI.color=Color.green;
  7. windowRect1=GUI.Window(1, windowRect1, DoMyWindow, "Green Window");
  8. }
  9. function DoMyWindow(windowID:int){
  10. if(GUI.Button(Rect(10, 20, 100, 20), "Hello World"))
  11. print("Got a click in window with color"+GUI.color);
  12. GUI.DragWindow(Rect(0, 0, 10000, 10000));
  13. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,并将其拖曳到 Hierarchy 视图中的 Main Camera 上,使脚本和摄像机产生关联。

  1. 进行测试,效果如下图所示。

OnGUI 贴图 

纯色背景的界面会给人以单调的感觉,而Unity 3D 可以使用纹理贴图让游戏界面在视觉感受上更加生动。

你可以将纹理贴图想象成装修时在墙上贴壁纸,通过纹理贴图可以对界面生动性、游戏沉浸感的提升上起到画龙点睛的作用。

GUITexture 方法具体使用方法如下:

  • 将图片导入 Unity 3D 中,执行 Assets → Import Package → Custom Package 命令找到图片位置,并加载进来。

图片加载后,可以在 Project 视图中进行查看。

  • 选中图片,将 Texture type 修改成 sprit render 格式,然后将其加载到 Hierarchy 视图中。

  • Unity 3D 会自动分析图片的宽和高,然后以此规格将其加载进来。

如果此时发现图片没有全屏显示或者显示的大小不合意,可以在 Inspector 视图中进行图片大小的缩放。

你也可以使用 GUI.DrawTexture 方法绘制贴图,该方法原型如下:

 
  1. /*
  2. Rect position:表示图片的绘制区域
  3. * Texture image:表示绘制图片的对象
  4. * ScaleMode scaleMode:表示图片的缩放模式
  5. * bool alphaBlend:表示十分开启图片混合模式
  6. * float imageAspect:表示图片的缩放宽高比例
  7. */
  8. public static void DrawTexture(Rect position, Texture image, ScaleMode scaleMode, bool alphaBlend, float imageAspect);

注:

  • position 为纹理贴图的位置。

  • Image 为所贴纹理图片。

  • scaleMode 为纹理的缩放模式。

  • alphaBlend 为图片的混合模式。

  • imageAspect 为图片缩放的宽高比例。

&加载图片资源放置在根目录 Assets 中的 Resource 文件夹下,载入资源时,将整个图片文件夹载入即可。

使用案例

  1. 创建项目,将其命名为 texture,保存场景。

  1. 执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中打开脚本编辑器,输入下列语句:

 
  1. var aTexture:Texture;
  2. function OnGUI(){
  3. if(!aTexture){
  4. Debug.LogError("Assign a Texture in the inspector.");
  5. return;
  6. }
  7. GUI.DrawTexture(Rect(100, 10, 200, 200), aTexture);
  8. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,并将其拖曳到 Hierarchy 视图中的 Main Camera 上,使脚本和摄像机产生关联。

  1. 在 Inspector 视图中添加纹理资源。

  1. 进行测试,效果如下图所示。

OnGUI Skin控件

图形用户界面皮肤是图形用户界面样式的集合,集合内有许多控件,每个控件类型拥有很多样式定义。

Skin 文件的 Inspector 面板会显示出可以影响到的所有控件,展开任何一个控件菜单会显示其可以修改的内容,其中包括字体大小、字体类型、背景等。

创建一个图形用户界面皮肤,在菜单栏中执行 Assets → Create → GUI Skin 命令,创建后的 GUI Skin 如下图所示。

参数列表

参数含义描述
Font字体用户图形界面中每个控件使用的全局字体。
Box应用于所有盒子控件的样式。
Button按钮应用于所有按钮控件的样式。
Toggle切换开关应用于所有切换开关的样式。
Label标签应用于所有标签控件的样式。
Text Field文本框应用于所有文本框控件的样式。
Text Area文本区域应用于所有多行文本域控件的样式。
Window窗口应用于所有窗口控件的样式。
Horizontal Slider水平滑动条应用于所有水平滑动条控件的样式。
Horizontal Slider Thumb水平滑块应用于所有水平滑块控件的样式。
Vertical Slider垂直滑动条应用于所有垂直滑动条控件的样式。
Vertical Slider Thumb垂直滑块应用于所有垂直滑块控件的样式。
Horizontal Scrollbar水平滚动条应用于所有水平滚动条控件的样式。
Horizontal Scrollbar Thumb水平滚动条滑块应用于所有水平滚动条滑块控件的样式。
Horizontal Scrollbar Left Button水平滚动条左侧按钮应用于所有水平滚动条左侧按钮控件的样式。
Horizontal Scrollbar Right Button水平滚动条右侧按钮应用于所有水平滚动条右侧按钮控件的样式。
Vertical Scrollbar垂直滚动条应用于所有垂直滚动条控件的样式。
Vertical Scrollbar Thumb垂直滚动条滑块应用于所有垂直滚动条滑块控件的样式。
Vertical Scrollbar Up Button垂直滚动条顶部按钮应用于所有垂直滚动条顶部按钮控件的样式。
Vertical Scrollbar Down Button垂直滚动条底部按钮应用于所有垂直滚动条底部按钮控件的样式。
Custom 1-20自定义附加的自定义样式可以应用于任何控件。
Custom Styles自定义样式一个带有可以应用于任何控件的自定义样式的集合。
Settings设定所有图形用户界面的附加设定。

使用案例

  1. 创建项目,将其命名为 GUISkin,保存场景。

  1. 加载图片资源,将图片资源放置在根目录 Assets 中的 Resource 文件夹下。

  1. 单击 Project 视图下拉三角,创建 GUI Skin,如图下图所示。

  1. 在 Inspector 面板中修改GUI Skin 参数,分别设置 BoxButtonLabel 样式,如下图所示。

  1. 执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中打开脚本编辑器,输入下列语句:

 
  1. var s1:GUISkin[];
  2. private var cont:int=0;
  3. function OnGUI(){
  4. GUI.skin=s1[cont%s1.Length];
  5. if(s1.Length==0){
  6. Debug.LogError("Assign at least 1 skin on the array");
  7. return;
  8. }
  9. GUI.Label(Rect(10, 10, 100, 20), "Hello World!");
  10. GUI.Box(Rect(10, 50, 50, 50), "A BOX");
  11. GUI.Button(Rect(10, 110, 70, 30), "A button");
  12. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,将其连接到 Main Camera 上。

  1. 在 Inspector 视图中添加纹理资源,并将 GUI Skin 拖动到 Main Camera 的 Inspector 视图下。

  1. 进行测试,效果如下图所示。

 OnGUI Toggle控件

Unity 3D Toggle 控件用于在屏幕上绘制一个开关,通过控制开关的开启与闭合来执行一些具体的指定操作。

当用户切换开关状态时,Toggle 控件的绘制函数就会根据不同的切换动作来返回相应的布尔值。

如选中 Toggle 控件会返回布尔值 true,取消选中就会返回布尔值 false

具体使用方法如下:

 
  1. public static function Toggle(position:Rect, value:bool, text:string):bool;
  2. public static function Toggle(position:Rect, value:bool, image:Texture):bool;
  3. public static function Toggle(position:Rect, value:bool, content:GUIContent):bool;
  4. public static function Toggle(position:Rect, value:bool, text:string, style:GUIStyle):bool;
  5. public static function Toggle(position:Rect, value:bool, image:Texture, style:GUIStyle):bool;
  6. public static function Toggle(position:Rect, value:bool, content:GUIContent,style:GUIStyle):bool;

注:

  • position 为控件显示位置。

  • value 为默认控件是开还是关。

  • text 为控件显示的字符内容。

参数列表

参数描述
position设置控件在屏幕上的位置及大小。
image设置控件上显示的纹理图片。
style设置控件使用的样式。
text设置控件上显示的文本。
content置控件的文本、图片和提示小。
value设置开关是开启还是关闭。

使用案例

  1. 创建项目,将其命名为 GUI.Toggle,保存场景。

  1. 执行 Assets → Create → JavaScript 命令,创建一个新的脚本文件。

  1. 在 Project 视图中打开脚本编辑器,输入下列语句:

 
  1. var aTexture:Texture;
  2. private var toggleTxt:boolean=false;
  3. private var toggleImg:boolean=false;
  4. function OnGUI(){
  5. if(!aTexture){
  6. Debug.LogError("Please assign a texture in the inspector.");
  7. return;
  8. }
  9. toggleTxt=GUI.Toggle(Rect(10, 10, 100, 30), toggleTxt, "A Toggle text");
  10. toggleImg=GUI.Toggle(Rect(10, 50, 50, 50), toggleImg, aTexture);
  11. }

  1. 按 Ctrl+S 键保存脚本。

  1. 在 Project 视图中选择脚本,将其连接到 Main Camera 上。

  1. 在 Inspector 视图中添加纹理资源。

  1. 进行测试,效果如下图所示。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/880463.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

[大语言模型-论文精读] ACL2024-长尾知识在检索增强型大型语言模型中的作用

ACL2024-长尾知识在检索增强型大型语言模型中的作用 On the Role of Long-tail Knowledge in Retrieval Augmented Large Language Models Authors: Dongyang Li, Junbing Yan, Taolin Zhang, Chengyu Wang, Xiaofeng He, Longtao Huang, Hui Xue, Jun Huang 1.概览 问题解决&…

OpenHarmony(鸿蒙南向开发)——小型系统内核(LiteOS-A)【LMS调测】

往期知识点记录: 鸿蒙(HarmonyOS)应用层开发(北向)知识点汇总 鸿蒙(OpenHarmony)南向开发保姆级知识点汇总~ 持续更新中…… 基本概念 LMS全称为Lite Memory Sanitizer,是一种实时…

建立分支提交代码

git分支 git branch 产看当前分支 git branch -a 查看所有分支 git checkout 分支名 切换分支 git checkout -b 分支名 建立分支(仅仅是在本地建立了,并没有关联线上) git push --set-upstream origin 分支名 把本地分支推到先线上 gti add …

自定义认证过滤器和自定义授权过滤器

目录 通过数据库动态加载用户信息 具体实现步骤 一.创建数据库 二.编写secutity配置类 三.编写controller 四.编写服务类实现UserDetailsService接口类 五.debug springboot启动类 认证过滤器 SpringSecurity内置认证流程 自定义认证流程 第一步:自定义一个类继承Abstra…

信息技术网络安全政策制定

为什么要制定网络安全政策? 通常,公司并不认为需要制定网络安全政策。现有的政策是为了保护公司的资产,而数据也是一项资产。 网络安全政策的真正必要性很简单:网络安全并不像锁门或不偷公司笔那么简单。在许多情况下&#xff0…

前海石公园的停车点探寻

前海石公园是真的很美,很多看海人,很多钓鱼佬,很多抓螃蟹的人,很多挖沙子的人,很多拍照的人,尤其是没有大太阳的时间段或每天傍晚或每个放假的时候人气超高,故前海石公园停车真的很紧张。由于前…

Unreal Engine 5 C++: 编辑器工具编写入门01(中文解释)

目录 准备工作 1.创建插件 2.修改插件设置 快速资产操作(quick asset action) 自定义编辑器功能 0.创建编辑器button,测试debug message功能 大致流程 详细步骤 1.ctrlF5 launch editor 2.创建新的cpp class,derived from AssetAction…

物联网助力智慧交通:优势与前景

智慧交通是当今城市发展的必然趋势,而物联网技术在交通运输领域的应用正是为实现智慧交通建设提供了前所未有的机遇和优势。物联网作为连接和控制物理世界的重要技术手段,在交通领域的应用极大地改善了交通系统的效率、安全性和环保性。 首先&#xff0c…

上海建站提升在线曝光率的关键

在当今数字化时代,企业在线曝光率的高低直接影响到其市场份额和品牌认知度。尤其是在上海这样的大都市,竞争尤为激烈。以下是提升在线曝光率的一些关键策略。 一、优化网站建设 首先,网站是企业在线形象的“门面”。一个设计美观、用户友好的…

STM32嵌入式编程学习到提高:【4】UART串口打印

------------------------------------------------------------------------------------------------------------------------- 工程文件:放在百度云盘里,需要的自行下载!!! 链接: https://pan.baidu.com/s/14gRne…

专业网站建设必备

专业网站建设不仅仅是简单的页面搭建,更是一项综合性的工程,需要结合行业特性、用户体验和技术创新,打造一个符合企业需求、独具特色的线上空间。 第一印象至关重要 一个企业网站就如同公司的数字名片,第一印象往往决定了用户是否…

【LeetCode】每日一题 2024_9_26 数组元素和与数字和的绝对差(模拟)

前言 每天和你一起刷 LeetCode 每日一题~ LeetCode 启动! 题目:数组元素和与数字和的绝对差 代码与解题思路 func differenceOfSum(nums []int) int {sum1, sum2 : 0, 0for _, v : range nums {sum1 vfor v > 0 {sum2 v%10v / 10}}return sum1-s…

零基础学Servlet

零基础学Servlet 一。介绍: servlet是一种比较古老的编写网站的方式,在2010年之前比较流行,在此之后,有一堆大佬创造了Spring(一种框架),Spring是针对Servlet进行进一步封装,从而让…

CANopen开源库canfestival的移植

本文记录将CANopen开源库CANfestival移植到GD32F470单片机的过程。CANopen协议理解请参考博客:CANopen协议的理解-CSDN博客 CANfestival开源库下载链接 CSDN链接: https://download.csdn.net/download/heqiunong/89774627 官网链接:https:/…

黑芝麻A1000-Ubuntu20.04(九)yolov5从训练到板端运行过程详解

宿主机:台式电脑 Ubuntu20.04 开发板:A1000(烧录版本SDK v2.3.1.2) 模型转换容器:bsnn-tools-container-stk-4.2.0 编译容器:a1000b-sdk-fad-2.3.1.2 yolov5使用工程:黑芝麻根据https://github.…

高性能分布式搜索引擎Elasticsearch详解

♥️作者:小宋1021 🤵‍♂️个人主页:小宋1021主页 ♥️坚持分析平时学习到的项目以及学习到的软件开发知识,和大家一起努力呀!!! 🎈🎈加油! 加油&#xff01…

[vulnhub] Jarbas-Jenkins

靶机链接 https://www.vulnhub.com/entry/jarbas-1,232/ 主机发现端口扫描 扫描网段存活主机,因为主机是我最后添加的,所以靶机地址是135的 nmap -sP 192.168.75.0/24 // Starting Nmap 7.93 ( https://nmap.org ) at 2024-09-21 14:03 CST Nmap scan…

【Linux】Linux基本命令

目录 文件和目录操作: ls cd pwd cp mv rm mkdir rmdir touch clear history which/whereis 文件查看和编辑: cat less head tail vi 或 vim sz/rz echo 系统信息和管理: su uname hostname df free top ps ki…

2025台球展,2025河南台球及配套设施展览会3月举办

阳春三月,年度招商季,壹肆柒中国国际台球产业博览会助力全国台球企业拓市场; 2025中国(郑州)国际台球产业博览会(壹肆柒台球展) The 2025 China (Zhengzhou) International Billiards Industry…

C++:采用模板封装顺序表,栈,队列

1.顺序表&#xff1a; list.hpp #ifndef LIST_HPP #define LIST_HPP #include <iostream>using namespace std;template <class L>class Seqlist { private:L *ptr;L size;L len0;public:void init(L n){//堆区申请空间&#xff08;大小为n&#xff09;this->…