NGUI 3.5 Tutorial (vii) Input box

Tribute to the original http://blog.csdn.net/chenggong2dm/article/details/38332089

write in front:

This article will use Ngui to create a glorified input box.
Welcome everyone to correct, shoot bricks! Original very hard, if reproduced, please indicate the source.

Create an input box

In Ngui 3.5, the creation of a control can be accomplished by "searching" and then "dragging" (also Ngui recommended method).

(1) In the project panel, search for "control", that is, search controls. After that, you'll find a bunch of Ngui controls.

(2) Locate the simple Input Field and drag to the bottom of the hierarchy panel. I'm dragging it right down to the UI root.

In the game view, this control appears as follows:

(3) Beautify the input box. Our art certainly will not be satisfied with this type of input box, then we have to replace its style, is actually to give the control a basemap.

Select the input box and change the Atlas and Sprite in the Inspector panel to modify the Basemap. If you do not understand how to build Atlas and Sprite, please refer to my previous article "NGUI 3.5 tutorial (iv) Atlas and Sprite (make Picture button)".

(4) Change the font of the input box. Since we want to apply a custom font, we have to put the good font, set on. If you do not understand the font production, please refer to my previous article "NGUI 3.5 tutorial (six) font fonts."

(5) Change the position of the text in the input box. Define the font, font size, you will find that the word in the input box is not centered, some biased. You need to adjust the anchors under the label:

Method Two: You can set the type of anchors to none, and then adjust by transform.

(6) Run, try the input effect:

What to note about the input box is:

1, if there is no custom font, the input of Chinese is transparent (blank), can not be displayed.

2, if the font exceeds the size of the input box, the same cannot be displayed.

3, using dynamic fonts will increase the draw call.

4, in the phone, click on the input box, will automatically call the phone's virtual keyboard, and then enter.

NGUI 3.5 Tutorial (vii) Input box