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

Unity 3D GUI 简介

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

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

概念

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

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

《植物大战僵尸》中的 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-Left、Top-Right、Bottom-Left、Bottom-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 参数，分别设置 Box、Button、Label 样式，如下图所示。
 

 

 

 

  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.rhkb.cn/news/431130.html


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











相关文章










仓颉编程入门2，启动HTTP服务








仓颉编程入门2，启动HTTP服务




上一篇配置了仓颉sdk编译和运行环境，读取一个配置文件，并把配置文件简单解析了一下。 
前面读取配置文件，使用File.readFrom()，这个直接把文件全部读取出来，返回一个字节数组。然后又创建一个字节流，给文件…




阅读更多...

















Apache James配置连接达梦数据库








Apache James配置连接达梦数据库




项目场景： 
Apache James配置连接达梦数据库，其他配置中不存在的数据库也可参考此方案。 配置步骤 
1、把需要的jar包导入到James 
把DmJdbcDriver18.jar复制到下面lib目录下 
james-2.3.2\lib  2、 修改连接配置 
james-2.3.2\apps\james\SAR-INF\confi…




阅读更多...

















Dockerfile部署xxljob








Dockerfile部署xxljob




使用Dockerfile部署xxljob 
1. 背景 
我们在使用定时任务调度时，通常会使用xxljob容器化部署xxljob，通常使用 docker pull xuxueli/xxl-job-admin:2.4.0 拉取镜像并启动容器。这种方式对于x86架构服务器来说，没有任何问题。但是在arm架构的服…




阅读更多...

















springboot项目引入了第三方jar包








springboot项目引入了第三方jar包




应该把jar包放在resource目录下，新建一个lib目录放进去，不然打包的时候会报错找不到jar包，放入jar包，右键添加到库，才可以使用。 _g().startMarquee();




阅读更多...

















MapReduce基本原理








MapReduce基本原理




目录 
整体执行流程​ 
Map端执行流程 
Reduce端执行流程 
Shuffle执行流程 整体执行流程 八部曲 读取数据--> 定义map --> 分区 --> 排序 --> 规约 --> 分组 --> 定义reduce --> 输出数据 首先将文件进行切片（block）处理&#xff…




阅读更多...

















【C语言】猜数字游戏








【C语言】猜数字游戏




个人主页 ： zxctscl 如有转载请先通知 文章目录 前言1. 随机数生成1.1 rand1.2 srand1.3 time1.4 设置随机数的范围 2. 猜数字游戏实现2.1 游戏菜单2.2 主函数部分2.3 game函数部分2.4 附代码2.5 优化代码 前言 
前面学习的这些知识，我们就可以写一些稍微…




阅读更多...

















常见统计量与其抽样分布








常见统计量与其抽样分布




什么是统计量 
我们首先给出统计量的定义:设  X 1 , X 2 , ⋯ , X n X_1,X_2,\cdots,X_n X1​,X2​,⋯,Xn​ 为来自于总体X的一个样本，  g ( X 1 , X 2 , ⋯ , X n ) g(X_1,X_2,\cdots,X_n) g(X1​,X2​,⋯,Xn​) 为关于 X 1 , X 2 , ⋯ , X n X_1,X_2,\cdots,X_n X…




阅读更多...

















C++ STL容器(三) —— 迭代器底层剖析








C++ STL容器(三) —— 迭代器底层剖析




本篇聚焦于STL中的迭代器，同样基于MSVC源码。 文章目录 迭代器模式应用场景实现方式优缺点 UML类图代码解析list 迭代器const 迭代器非 const 迭代器 vector 迭代器const 迭代器非const迭代器 反向迭代器 迭代器失效参考资料 迭代器模式 
首先迭代器模式是设计模式中…




阅读更多...

















linux网络编程7








linux网络编程7




24.9.24学习目录 一.网络通信过程（续）1.路由器 二.原始套接字（SOCK_RAW）1.创建原始套接字2.数据包解析 一.网络通信过程（续） 
1.路由器 
路由器是用于连接多个逻辑上分开的网络； 具有判断网络地…




阅读更多...

















React-Native 中使用 react-native-image-crop-picker 在华为手机上不能正常使用拍照功能








React-Native 中使用 react-native-image-crop-picker 在华为手机上不能正常使用拍照功能




背景: 
React-Native 0.66 中使用 react-native-image-crop-picker 在安卓 华为手机上不能正常使用拍照功能, 其他品牌正常 
代码如下:  
import ImagePicker from react-native-image-crop-picker;ImagePicker.openCamera(photoOptions).then(image > {callback(image);}) …




阅读更多...

















不靠学历，不拼年资，怎么才能月入2W？








不靠学历，不拼年资，怎么才能月入2W？




之前统计局发布了《2023年城镇单位就业人员年平均工资情况》，2023年全国城镇非私营单位和私营单位就业人员年平均工资分别为120698元和68340元。也就是说在去年非私营单位就业人员平均月薪1W，而私营单位就业人员平均月薪只有5.7K左右。 图源：…




阅读更多...

















DownShift: Tuning Shift Reduction With Reliability for Racetrack Memories








DownShift: Tuning Shift Reduction With Reliability for Racetrack Memories




目录 DownShift: Tuning Shift Reduction With Reliability for Racetrack Memories文章摘要：文章的主要贡献包括：文章的结构如下：DownShiftDownShift通过以下方式改进了现有的数据放置策略： GROGU（Generating Reliabi…




阅读更多...

















简单题94. 二叉树的中序遍历 （python）20240921








简单题94. 二叉树的中序遍历 （python）20240921




问题描述： python： 
# Definition for a binary tree node.
# class TreeNode(object):
#     def __init__(self, val0, leftNone, rightNone):
#         self.val  val
#         self.left  left
#         self.right  right
class Solution(object…




阅读更多...

















【重学 MySQL】三十七、聚合函数








【重学 MySQL】三十七、聚合函数




【重学 MySQL】三十七、聚合函数 基本概念5大常用的聚合函数COUNT()SUM()AVG()MAX()MIN() 使用场景注意事项示例查询 聚合函数（Aggregate Functions）在数据库查询中扮演着至关重要的角色，特别是在处理大量数据时。它们能够对一组值执行计算&a…




阅读更多...

















图书管理系统实现








图书管理系统实现




图书管理系统实现 图书管理系统作用图书管理系统绘图创建Book创建BookListOperation包下代码User包AdminUserNomalUser Main方法整体代码（带有注释）Opertaion包下的代码IOpertaion（接口）Add添加图书代码Dele删除图书代码Borrow借阅…




阅读更多...

















PyTorch 池化层详解








PyTorch 池化层详解




在深度学习中，池化层（Pooling Layer）是卷积神经网络（CNN）中的关键组成部分。池化层的主要功能是对特征图进行降维和减少计算量，同时增强模型的鲁棒性。本文将详细介绍池化层的作用、种类、实现方法&#xf…




阅读更多...

















C++——多线程编程（从入门到放弃）








C++——多线程编程（从入门到放弃）




进程：运行中的程序 线程：进程中的进程 线程的最大数量取决于CPU的核心数 
一、将两个函数添加到不同线程中 
demo：两个函数test01()和test02()，实现将用户输入的参数进行打印输出1000次 将这两个函数均放到独立的线程t1和t2中&…




阅读更多...

















vue3+element-plus icons图标选择组件封装








vue3+element-plus icons图标选择组件封装




一、最终效果 二、参数配置 
1、代码示例 
<t-select-icon v-model"selectVlaue" />2、配置参数&#xff08;Attributes&#xff09;继承 el-input Attributes 
参数说明类型默认值v-model绑定值string-prefixIcon输入框前缀iconstringSearchisShowSearch是否显…




阅读更多...

















从角速度向量的角度理解姿态角速度和机体角速度的转换公式








从角速度向量的角度理解姿态角速度和机体角速度的转换公式




一、什么是姿态角速度 这是我从《多旋翼飞行器设计和控制》上截取的关于欧拉角的定义。无人机的姿态角速度即偏航角、俯仰角、滚转角的一次导数&#xff0c;分别是、、。 二、什么是机体角速度 这是我在网上随便找的图&#xff0c;展示了机体坐标系。这个坐标系与飞机固定连接&…




阅读更多...

















【软件测试】详解测试中常用的几种测试方法








【软件测试】详解测试中常用的几种测试方法




目录 一、集成测试二、 系统测试三、验收测试四、回归测试 总结 一、集成测试 
术语 
集成测试是继组件测试之后的又一个层次。集成测试假定交给这个层次的测试对象已经经过了组件测试&#xff0c;并且任何组件内部的缺陷都已经尽可能地被纠正。 
集成 
开发人员、测试人员和专…




阅读更多...


















最新文章












推荐文章


















Copyright @ 2022~2023