Chinar blog ：www.chinar.xin

Unity UGUI 完整系列教程 (Chinar中文图解)

Unity UGUI InputField组件

本文提供全流程，中文翻译。

Chinar 的初衷是将一种简单的生活方式带给世人

使有限时间具备无限可能

Chinar —— 心分享、心创新！

助力快速掌握 Unity UGUI InputField 组件的使用

为初学者节省宝贵的时间，避免采坑！

Chinar 教程效果：

文章目录

1
- Presentation —— 介绍
- - 1.1 Attribute —— 属性
  - 1.2 Content Type —— 内容类型
  - - 1.2.1 Line Type —— 行类型
    - 1.2.2 Custom —— 自定义
2
- Exemple —— 例子
支持
- May Be —— 开发者，总有一天要做的事！

全文高清图片，点击即可放大观看 (很多人竟然不知道)

1

Presentation —— 介绍

InputField 组件是一个用来管理输入的组件

我们通常用来输入用户的账号，密码，或者聊天时输入文字,等等输入逻辑…

1.1 Attribute —— 属性

我们创建一个 InputField 组件看一下它的属性：

在 Unity 的 Hierarchy 面板上右键–>UI–>InputField

选中创建的 InputField 对象，可以看到它的子物体有两个 Text对象

Placeholder ：用来提示用户的占位符

Text ：用来输入内容

然后我们看 Input Field 属性

下面看一下每个属性的详细功能

属性	功能
`TextComponent`	用来管理输入的文本组件
`Text`	输入的内容 ( 我们可以在代码中用 `InPutField.text` 获取到 )
`Character Limit`	字符限制类型，可以限制最大字符数的值。
`Content Type`	内容类型，定义输入内容`接受/限制`的字符类型
`Line Type`	行类型。单行、多行，多行回车换行
`Placeholder`	占位符，用来提示输入的内容，当点击输入框后会隐藏
`Caret Blink Rate`	输入框上的光标的闪烁频率
`Selection Color`	选中文本的背景颜色
`Hide Mobile Input (iOS only)`	隐藏移动输入内容，仅IOS有用

1.2 Content Type —— 内容类型

属性	功能
`Standard`	标准，可以输入任何字符
`Auto corrected`	自动更正，可以自动更正用户输入，并建议输入内容
`Integer Number`	整数，只允许输入整数
`Decimal Number`	十进制数，仅允许输入数字和小数点后一位
`Alphanumeric`	字母数字，允许字母和数字。无法输入符号
`Name`	名称(`支持中文`)自动将每个单词的首字母大写。(用户可以使用Delete键绕过大小写规则 )
`Email Address`	电子邮件地址，允许您输入最多包含一个@符号的字母数字字符串
`Password`	*密码：用 `` 表示输入的字符，从而隐藏输入内容。(允许符号)**
`Pin`	*用 `` 号表示输入的字符。仅允许输入整数**
`Custom`	自定义：允许`自定义行类型、输入类型、默认键盘类型、字符验证`

1.2.1 Line Type —— 行类型

属性	功能
`Single Line`	`单行` ：仅允许文本在一行上
`Multi Line Submit`	`多行自动换行` ：允许文本使用多行。仅在一行写满后使用新行
`Multi Line Newline`	`多行回车新建行` ：用户可以随时通过按 `Enter` 键来新建行，继续输入

1.2.2 Custom —— 自定义

使用此选项，我们可以完全按照我们的需求来自定义输入逻辑、用户输入方式

Line Type 上面介绍过了，这里来介绍下面的三个选项

Input Type 与 Character Vlidation 中的内容在 Content Type 中包含，不再解释

Keyboard Type：它可以在用户选中输入框时，调出不同类型的键盘

`Keyboard Type` 属性	功能
`Default`	目标平台的默认键盘
`ASCLL Capable`	带标准ASCII键的键盘。
`Numbers And Punctuation`	键盘与数字和标点符号键
`URL`	键盘与URL输入键
`Number Pad`	键盘与标准数字键
`Phone Pad`	键盘与适合键入电话号码的布局
`NamePhone Pad`	键盘与字母数字键
`Email Address`	带有适合键入电子邮件地址的其他键的键盘
`Nintendo Network Account`	带有网络账号键的键盘
`Social`	键盘与常用于社交媒体上的符号键，如Twitter
`Search`	键盘上带有“.” 空格键旁边的键，适合键入搜索词

2

Exemple —— 例子

我们来实现一个小 Demo：获取用户的账号密码：简单的搭建一个用户输入界面

两个 InputField 输入框分别命名： Account 和 Password

一个 Button 按钮

我们将密码的输入框的Content Type 改为 Password

为了测试：创建一个脚本挂在到相机上

using UnityEngine;
using UnityEngine.UI;public class ChinarInputField : MonoBehaviour
{public InputField Account;//账号输入框public InputField Password;//密码输入框/// <summary>/// 初始化输入框/// </summary>void Start(){Account = GameObject.Find("Account").GetComponent<InputField>();Password = GameObject.Find("Password").GetComponent<InputField>();}/// <summary>/// 绑定到登录按钮上/// </summary>public void Login(){print("账号："+Account.text+"  密码："+Password.text);}
}

运行后，打印输出：

至此：您已完美征服了 UGUI - InputField

其他组件请继续学习，贴心的 Chinar 为您准备了 UGUI 全套教程

Unity UGUI 完整系列教程 (Chinar中文图解)

支持

May Be —— 开发者，总有一天要做的事！

拥有自己的服务器，无需再找攻略

Chinar 提供一站式《零》基础教程

使有限时间具备无限可能！

先点击领取 —— 阿里全产品优惠券 (享受最低优惠)

Chinar 免费服务器、建站教程全攻略！( Chinar Blog )

END

本博客为非营利性个人原创，除部分有明确署名的作品外，所刊登的所有作品的著作权均为本人所拥有，本人保留所有法定权利。违者必究

对于需要复制、转载、链接和传播博客文章或内容的，请及时和本博主进行联系，留言，Email: ichinar@icloud.com

对于经本博主明确授权和许可使用文章及内容的，使用时请注明文章或内容出处并注明网址

Unity UGUI InputField 中文详解-Chinar相关推荐

Unity UGUI Button 中文详解-Chinar
Chinar blog :www.chinar.xin Unity UGUI 完整系列教程 (Chinar中文图解) Unity UGUI Button 组件本文提供全流程,中文翻译. Chinar ...
Unity编辑器AssetDatabase函数API用法中文详解-Chinar教程
Chinar blog :www.chinar.xin AssetDatabase 函数用法汇总本文提供全流程,中文翻译助力快速理解 AssetDatabase API 用法为初学者节省宝贵的时 ...
Unity编辑器类中文教程汇总-Chinar（一个默默无闻分享知识的人）
Chinar blog :www.chinar.xin Unity 编辑器资料汇总本文提供全流程,中文翻译统计我所有编辑器 Unity Editor 教程资料,便于查询学习为初学者节省宝贵的时间 ...
Unity：锚点详解
锚点时基于父对象让子对象定位用的.所以我们移动锚点时候的范围就是父对象的宽和高. 锚点在一起时这四个三角形在一起时意味着锚点在一起当锚点在一起的时候,图片的大小不会随着父对象的大小改变而改变:图片 ...
Nginx配置文件nginx.conf中文详解（转）
######Nginx配置文件nginx.conf中文详解######定义Nginx运行的用户和用户组 user www www;#nginx进程数,建议设置为等于CPU总核心数. worker_pr ...
halcon例程讲解_跟我学机器视觉-HALCON学习例程中文详解-开关引脚测量
跟我学机器视觉-HALCON学习例程中文详解-开关引脚测量 This example program demonstrates the basic usage of a measure object. ...
转载雨松mono Unity获取游戏对象详解（来自我的长微博）
Unity获取游戏对象详解(来自我的长微博) 转载自雨松mono 本文固定链接: http://www.xuanyusong.com/archives/2768 转载请注明: 雨松MOMO 201 ...
随笔分类 - HALCON学习例程中文详解
from: https://www.cnblogs.com/chita/category/563492.html 随笔分类 - HALCON学习例程中文详解 HALCON学习例程中文详解跟我学机器视 ...
Nginx主配置文件nginx.conf中文详解
第1章 nginx配置解释图解第2章 Nginx核心配置文件nginx.conf史上最细中文详解 2.1 定义Nginx运行的用户和用户组 2.2 nginxworker进程数,即处理请求的进程(熟 ...

Unity UGUI InputField 中文详解-Chinar