这个交互描述怎么写：InputText 输入框

扫一扫
官方手机版

扫一扫
AI创作程序

扫一扫
木子公众号

扫一扫
AI公众号

本文从输入框的定义、使用场景、相关组件、交互说明都有详细的分析，作者还附上输入框的源文件供大家参考学习。

往期回顾：

交互控件科普系列！Banner 的常见样式和设计注意事项总结

当你需要展示一段持续提示，却又不想打断用户操作。

定义

通过鼠标或键盘输入文字、字母、数字、符号内容。

使用场景

• 填写表单时；
• 需要输入文本数据时。

相关组件

• 当仅需要输入数字时，使用 InputNumber 数字输入框；
• 当进行搜索时，使用 Search 搜索框；
• 当需要进行包含图片、文本等内容的复杂输入时，使用 RichText 富文本编辑器。

交互说明

1. CASE1 输入框高度说明

输入框根据行数分为三种类型：单行输入框、定高文本域、自适应高度文本域。

2. CASE2 输入框宽度说明

• 输入框宽度根据实际情况确定，宽度固定无自适应；
• 为方便阅读，不可过宽（具体宽度由 UI 定义）。

3. CASE3 输入内容说明

• 可输入文字、字母、数字、符号；
• 如无特殊说明，不可输入 emoji 表情；
• 如无特殊说明，第一个字符不可为空格或回车；
• 过滤文本样式、链接;
• 输入的内容为保密信息时，显示圆点，不直接显示字符。

4. CASE4 控件状态说明

输入框共分为启用、聚焦、禁用、输入中、加载、报错、符合条件 7 种状态。

5. CASE5 暗提示说明

未输入任何内容时，输入框中需显示暗提示：

6. CASE6 字数限制说明

输入框必须对可输入的字数进行限制，分为以下两种限制方式：

源文件

下载链接: https://pan.baidu.com/s/1aq7dc2Iv3qpEF6g2PVF5uA 提取码: ridu

备用下载链接：https://share.weiyun.com/5xrRyZ0

欢迎关注作者的微信公众号：「愚者笔记」