一、原文链接

原文链接：http://blog.csdn.net/chenggong2dm/article/details/38332089

写在前面：  

本文将用NGUI创建一个经过美化的输入框。欢迎大家纠错、拍砖！原创很辛苦，如有转载，请注明出处。

创建输入框

在NGUI 3.5中，创建控件都可以通过【搜索】，然后【拖拽】实现（也是NGUI推荐的方法）。

（1）在Project面板中，搜索“Control”，也就是搜索控件。之后，会发现NGUI的一堆控件。

（2）找到 Simple Input Field，拖拽到层级面板下面。我这里把它直接拖拽到UI Root下面了。

在game视图中，会出现这个控件，如下：

（3）美化输入框。我们的美术肯定不会对这种样式的输入框满意，那么我们就要替换掉它的样式，其实就是给控件换一张底图。

选中输入框，在inspector面板里更改 Atlas 和 Sprite，以修改底图。如果有不明白怎么建立atlas和sprite的，请参照我前面的文章《NGUI 3.5教程（四）Atlas和Sprite（制作图片按钮）》。

（4）更改输入框的字体。由于我们要应用自定义字体，所以要把做好的字体，设置上。如果有不明白字体制作的，请参照我前面的文章《NGUI 3.5教程（六）Font字体》。

（5）修改文字在输入框中的位置。定义好字体、字体大小后，会发现，字在输入框里不居中了，有些偏。需要在Label下，调整Anchors：

方法二：可以把Anchors的Type设置为None，然后通过Transform来调整。

（6）运行，试试输入效果：

关于输入框需要注意的是：

• 1，如果没自定义字体，输入中文的时候为透明的（空白），无法显示。
• 2，如果字体超过输入框的大小，一样无法显示。
• 3，使用动态字体，会增加draw call。
• 4，在手机里，点击输入框后，会自动调用手机的虚拟键盘，之后进行输入。

版权属于：东哥笔记 - DongGe.org

本文链接：https://dongge.org/blog/299.html

自2017年12月26日起，『转载以及大段采集进行后续编辑』须注明本文标题和链接！否则禁止所有转载和采集行为！