The GUI is the abbreviation and short name of the graphical user interface (graphical user Interface), also called the graphical user interface. It sounds like a professional feeling, in fact we are in touch every day. For example, the browser above the forward, back, favorite buttons, the address bar, the right-click menu, and even the entire browser window can be called GUI.
And often people in the eyes of hackers, are like on a full character of the screen and quickly typing some obscure letters, and then claimed to be extremely secure, such a firewall system was compromised. This interface is exactly the same as the GUI, called the command line interface, CLI (command-line Interface).
As a second-generation game engine, the game will certainly not display a variety of information using the character interface. Although once the text class MUD game is known as a generation of classics, mud–multiple user domain, multi-user communication field, now Beijing University also open this kind of game server. But such a game has been small, not in line with the growing demand for graphical interface.
Just as few home users are now using the Dos/linux system, WINDOWS/MACOSX has become standard, and even Linux has Ubuntu, followed by a touch-focused system like iOS, Android, and Win8. As a result, GUI components came into being, with two common GUI components in unity, GUI text and GUI Texture. As the name implies, the former is used to display the text, while the latter is used to display the map.
In World of Warcraft, for example, if we want to make such an effect, then the player's name and level can be used to display the GUI text, and the head and Blood bar, and those borders can be used GUI texture to express. So with the Wow Model Viewer dug for half a day, find the following material, ready to start a cottage ^_^.
- Prototype head of a piece, too lazy again in the game again modified.
- A blood stripe, the progress bar in the game depends on it to show.
- An avatar frame, well, it's just a box.
- The level frame body, uh ... Ditto.
Keeping resources organized is a good habit and the first step in the project. Drag these stickers down to the "Textures/gui" directory and select them to change the texture type to GUI (you can press and hold CTRL multiple to make changes). This step is necessary, otherwise the image to be displayed will blur out. As for the principle I also do not understand, often encountered this even Google degrees Niang can not find the answer to the question, also can only superficial understanding, had to forget.
The footage is ready to start creating the GUI. Select "Gameobject→create Other→gui Texture" on the main menu and a Unity official logo watermark will appear in the middle of the screen, which is not what we want. Locate Unitywatermark-small in the hierarchy panel and select to modify the map of the texture property to the picture frame body you just imported. Please click "Dog planing Learning net" for more highlights.
You should already see the avatar frame in the middle of the design view, but you need a few more steps. The point-in pixel setting (Pixel Inset), where XY represents the offset of the horizontal ordinate, is set to 0,width and height to indicate the width and altitude of the picture, set to the original size (I am here 193x76). The last remaining work is to modify the GUI's position on the screen.
Since the GUI is really just a flat graphic to stick on the screen, no matter how we rotate the lens, it never changes position. So the GUI's coordinate definition is not the same as the coordinate definition of our common 3D game object, borrowing the official GUI description:
As you can see, Unity's definition of GUI coordinates is proportional, meaning that regardless of the length of the screen, the location of the GUI map is always: (screen width xtransform.x, screen height xtransform.y), and the coordinate system is the same as the most common coordinate system in mathematics. Transform.z, on the other hand, indicates that the GUI's priority on the screen will be obscured by a small priority. In addition, once a GUI becomes a sub-object of another GUI, the horizontal ordinate is invalid, and the XY in the pixel setting needs to be adjusted to control the offset.
The rest of the texture maps are also made into a GUI, as shown in the structure. The materials used are 3, 2, 1, 2, 4, respectively, compared to the above. There is not much to be aware of, adjust the occlusion relationship, and you need to modify color to produce different color effects when creating a blood bar. The rest of the job is to add the player's name and level of text. Click on the Main Menu "Gameobject→create Other→gui text", as with GUI maps, the coordinate system of GUI text is proportional as well. To make it more like Wow, I decided to look at the properties of the GUI text one after the other: more wonderful click on "Dog planing Learning Net"
- Text: text content that needs to be displayed on the screen;
- Anchor (anchor point): You can set the starting position of the drawing text, imagine nine Gongge can understand;
- Alignment (Alignment): text alignment, you can set left-aligned, right-aligned, centered;
- Pixel offset (offset): The offset pixel of the text in the XY direction relative to the starting position;
- Line Spacing (row spacing): The gap between two lines of text;
- tab Size (tab width): The so-called tab is the usual input when the TAB key to hit the blank character;
- Font (font): Text used by the typeface, the default is Arial;
- Material (material): The material used in the text;
- Font Size: The size of the font, if 0, the default size setting for the font;
- Font style: You can set the font bold, italic style;
- Pixel Correct (pixel correction): When this option is enabled, the font-size setting will be valid, or you may have to modify it by adjusting the transform.scale. Enabled by default.
There are two problems to solve, the first is a custom font, because my Wow client font has been modified by me, can not find the default font for a random font import will be. The second is the need to change the color of the font (look at Wow's font is actually a projection, for convenience this effect will not do). Ask the end of the Valley elder Niang after finishing a thought, follow the following steps to operate: more wonderful please click "Dog planing Learning Net"
- Drag a font file into the project panel, I use the "Han Yi-yi Art Body Simple", named Hanyizongyi;
- Create a new material, named Wowfont, set Shader as "Gui/text Shader", and set the corresponding Text Color;
- Expand the first step of the imported font, you will find a font Texture, drag the texture into the texture of the second step of the material box;
- Drag the Wowfont material onto the material properties of the GUI text;
- Drag the Hanyizongyi font to the font properties of the GUI text;
The same as the level of the GUI text is also done, the name and level dragged into the playerportrait, finally adjust the position and font size, finished!
Well...... Run the game, feel there is a kind of mold, haha. Of course, this is only the implementation of the approximate interface, in fact, the game does not have the life and magic value of the setting.
Unity3d the use of the GUI for game development
