[Turn]unity3d GUI for game development

Transferred from: http://blog.csdn.net/kuloveyouwei/article/details/23598171

GUI plays an important role in the development of the game, whether the GUI of the game is friendly, whether it is convenient to use or not, which determines the game experience of the player to a great extent. Unity has built-in a complete GUI system that provides a full range of GUI solutions from layouts, controls to skins, and GUI interfaces that can be made in a variety of styles and styles. The GUI is used in unity to do the GUI drawing work, currently unity does not provide a built-in GUI visual editor, so the GUI interface of the production needs all by writing script code to achieve, if the game has a lot of interface production requirements, you can write the editing GUI editor for your needs, or with third-party GUI plugins, such as Ngui.

Unity's GUI classes provide a rich set of interface controls that can be used in conjunction with GUI controls such as:

GUI code needs to be called in the Ongui function in order to draw, GUI control generally need to descendant rect parameter to specify the screen drawing area, for example, rect (0,10,200,300), the corresponding screen rectangular area of the upper left corner of the coordinates (0,10), width 200, height is 300, In the Unity GUI, the screen coordinate system is the origin point in the upper-left corner

Next we look at the label control, the label control is suitable for displaying text information or pictures, we create a new C # script, called TestGUI.cs, and then bind to our main camera object, the label initialization code is as follows:

void Ongui () {//gui.color = color.red; Gui. Label (New Rect (Ten, ten, +), "Hello world!"); Gui. Label (New Rect (TEXTURE.WIDTH/4, TEXTURE.HEIGHT/4), texture);}

We set it to two labels, one display text, the other shows a picture, such as:

The box control, which is used to draw text or pictures with a border background, has the following code:

        void Ongui () {//gui.color = Color.red;//gui. Label (New Rect (Ten, ten, +), "Hello world!"); /gui. Label (New Rect (TEXTURE.WIDTH/4, TEXTURE.HEIGHT/4), texture); Gui. Box (new Rect (Ten, Screen.width * 0.5f, Screen.height * 0.5f), "This is a title"); Gui. Box (New Rect (TEXTURE.WIDTH/4, TEXTURE.HEIGHT/4), texture);}        

The effect is as follows:

Button control, which is used to draw the buttons that respond to a click event, the code is as follows:

Gui. button (new rect (10, 10, 150, 50), "This is a text button");//Picture button Gui.button (new rect (TEXTURE.WIDTH/4, TEXTURE.HEIGHT/4), texture);

Effects such as:

Draw a text picture of the button, the code is as follows:

            Draw a button with picture and text    guicontent Guic = new Guicontent ("button", texture);    Gui. Button (New Rect (Ten, +, (), Guic);        

We can set the button's Click event, the code is as follows:

Gui. button (new Rect (10, 10, 150, 50), "This is a text button");//Picture button if (GUI. button (new Rect (TEXTURE.WIDTH/4, Max, TEXTURE.HEIGHT/4), texture)) {Debug.Log ("--------aaa");} Draw a button with picture and text guicontent Guic = new Guicontent ("button", texture); Gui. Button (New Rect (Ten, +, (), Guic);    

When we click on the button, we will output the printed content in the console,

TextField control, in the game, often need to use the information input window, such as Chat window, user information input, etc. passwordfield control is used to draw the password input box, often used in the user login interface; The textarea control is similar to TextField's usage, The difference is that TextField is a single line, textarea can edit multiple lines of text, creating the following code:

usingUnityengine;usingSystem.Collections; Public classTestgui:monobehaviour { Publictexture2d Texture;  Public stringUserName;  Public stringpassword;  Public BOOLissuccess; //Use this for initialization    voidStart () {userName="Admin"; Password="123"; }        //Update is called once per frame    voidUpdate () {}voidOngui () {//gui.color = color.red; //GUI.        Label (New Rect (Ten, ten, +), "Hello world!"); //GUI.        Label (New Rect (TEXTURE.WIDTH/4, TEXTURE.HEIGHT/4), texture); //GUI.        Box (new Rect (Ten, Screen.width * 0.5f, Screen.height * 0.5f), "This is a title"); //GUI. Box (New Rect (TEXTURE.WIDTH/4, TEXTURE.HEIGHT/4), texture);//GUI. button (new Rect (10, 10, 150, 50), "This is a text button");//        //Picture Button//if (GUI. Button (New Rect (TEXTURE.WIDTH/4, TEXTURE.HEIGHT/4), texture))//        {//Debug.Log ("--------aaa");//////        }////        //Draw a button with pictures and text//guicontent Guic = new Guicontent ("button", texture);//GUI. Button (New Rect (Ten, +, (), Guic);UserName=gui. TextField (NewRect (Ten,Ten, Max, -), userName); //The mask character of the ' * ' Password stringPassword=gui. Passwordfield (NewRect (Ten, -, Max, -), Password,'*', -); Gui. TextArea (NewRect (Ten, -, Max, -),"ABCDERFASDASDASDASFASDAASDFDFSFSD"); if(GUI. Button (NewRect (Screen.width/2- -, Screen.height/2- -, -, -),"Login"))        {            //Determine login            if(Username.equals ("Admin") && password. Equals ("123") ) {issuccess=true; }            Else{issuccess=false; }        }        if(issuccess) {GUI. Label (NewRect (Ten, $, -, -),"Login Successful! "); } Else{GUI. Label (NewRect (Ten, $, -, -),"Login failed! "); }    }}

The effect is as follows:

The toggle control can be used to make a switch button, and each time it is clicked, it switches between the on and off states, creating the following code:

Text Toggletxt = GUI. Toggle (New Rect (Ten, ten, +), Toggletxt, "A Toggle text");//Picture toggleimg = GUI. Toggle (New Rect (Ten, A, A, a), toggleimg, texture);

Effects such as:

The toolbar control is useful for drawing a set of buttons that activate only one at a time, and can be used to make toolbars, creating the following code:

public int Toolbarint;toolbarint=gui. Toolbar (New Rect (10,10,250,30), toolbarint,new string[]{"function One", "function two", "function Three"});

Effects such as:

The Silder slider is a very common interface element that can be used in the GUI interface for volume adjustment, progress display, and numerical adjustment, where slider controls are divided into horizontal and vertical 2 in unity, The corresponding GUI functions are Horizontalslider and Verticalslider, and the code is created as follows:

Hslidervalue = GUI. The Horizontalslider (new Rect (), 0.0f, 10.0f), hslidervalue, and/or shows the horizontal slider value Gui.label (new rect (25,22,100,30), Hslidervalue.tostring ("0.00")); vslidervaule = GUI. Verticalslider (New rect (+, +, +), Vslidervaule, 0.0f, 10.0f);//Displays the vertical slider value Gui.label (new rect (22,170,100,30), Vslidervaule.tostring ("0.00"));

Effects such as:

ScrollBar controls, scroll bars scrollbar are commonly used for scrolling in the page area, such as in document browsing, where scrollbar controls are divided horizontally and vertically into 2 types, The corresponding GUI functions are Horizontalscrollbar and Verticalscrollbar, and the code is created as follows:

Hsbarvalue = GUI. Horizontalscrollbar (New Rect (+,-), Hsbarvalue, 1.0f, 0.0f, 10.0f); vsbarvaule = GUI. Verticalscrollbar (New Rect (+,-), Vsbarvaule, 1.0f, 10.0f, 0.0f);

Effects such as:

Unity's default controls look very simple, and during game development, developers design a personalized game interface based on the type and content of the game, and unity can configure the Guiskin to change the default style of the control, creating a game-style control look. Open the Assets->create->gui skin in the menu bar in turn to create the Guiskin, such as:

Click the Guiskin file to set the parameters of the Guiskin in the Inspector view, assuming that you now need to change the background picture of the button, as well as the font size on the button, click the button to collapse the item, expand the button control's style parameter, change the normal, Hover, Active, on Normal, on Hover, on Hover, Font size are several parameters, such as:

Then we create a button in the code that looks like this:

Public Guiskin MySkin; Gui.skin = MySkin; Gui. button (new Rect (60, 50, 588/2, 288/2), "Start Game");

Set MySkin as we just created the Guiskin, bind, click after effect such as:

Guilayout automatic layout, in Unity GUI controls are laid out in two ways, a fixed layout, that is, when the control is drawn to the location of the parameter, specify the precise position of the control, and unity also supports the automatic layout of the control, automatic layout for the control of the dynamic situation, Or sometimes developers do not care about the precise location of the control, if you want to use automatic layout, then you need to use the Guilayout class instead of the previously used GUI class, and remove the rect () position parameter.

Automatic layout Guilayout.button ("Aaaaaaa");

[Turn]unity3d GUI for game development