移动端键盘适配怎么做？输入框、滚动与提交

移动端键盘适配的核心是让焦点控件保持可见。先确定键盘弹出后视口如何变化，再处理滚动、提交和错误回焦。用自动布局教程整理输入区、按钮和提示的伸缩关系，静态画面也能覆盖不同屏高。

先画出键盘出现后的视口

输入框获得焦点时，底部按钮可能被键盘遮住，页面也可能被系统自动滚动。设计稿应分别标注安全区、可滚动区域和固定操作区，不能只把键盘图片叠在完整页面底部。

焦点滚动到可见位置

多行输入框靠近页面底部时，滚动距离要留出错误提示和提交按钮的空间。焦点切换到下一个字段后，页面不应跳回顶部。错误回焦要把字段、文案和键盘状态一起考虑。

提交动作和键盘类型匹配

收起键盘不等于取消编辑

用户下滑或点击空白处收起键盘时，已输入内容应保留。取消编辑要有明确按钮，并区分撤销本次修改和仅关闭键盘。

读屏和横屏检查

字段标签、错误消息和提交结果要按逻辑顺序播报；横屏或较小高度下，焦点控件仍必须可见。原型用两个屏高和错误状态走一遍，确认自动布局不会把按钮推出视口。

把可变区域和固定区域分开

表单正文应是可滚动区域，提交操作可根据产品规则固定或跟随内容。自动布局中为输入区设置最小高度和可伸缩约束，键盘出现时只缩短可用视口，不挤压错误消息。多个字段连续输入时，焦点移动要有稳定的滚动策略。

如果表单需要拍照或选择文件，返回页面后仍应保留输入和错误状态。横屏或分屏场景下，键盘可能遮住更多内容，设计稿应至少覆盖低高度屏幕和系统字体放大后的情况。

结算表单的输入路径

用户先填写收货人，再输入手机号和地址。手机号格式错误时，页面滚到字段并保留键盘；地址多行输入时，提交按钮在键盘收起后可见。提交请求超时，保持用户填写的内容并显示查询或重试入口，不清空整个表单。

移动端验收清单

• 焦点输入框、错误提示和提交按钮是否同时可见？
• 键盘收起与取消编辑是否有清楚区别？
• 字体放大和横屏下是否仍能滚动到当前字段？
• 读屏焦点顺序是否与视觉顺序一致？

表单长度和自动保存

长表单可以分段保存或使用步骤条，键盘弹出时只滚动当前段落。自动保存要给轻量状态，不应每次键盘收起都弹出遮挡提示。若保存失败，保留本地输入并提供再次保存，避免用户因为收起键盘而丢失内容。

输入法候选词、数字键盘和密码键盘的高度不同，设计稿至少说明可用视口而不是固定键盘像素。错误提示增加一行时，滚动区域要能自动容纳，不把按钮顶到键盘下方。

用真实设备或等效视口检查焦点切换、返回、旋转和字体放大；静态截图无法证明这些变化，需要可点击原型和明确的滚动预期。

焦点、滚动和错误的交接

输入框获得焦点时，记录滚动容器和顶部安全距离；键盘收起后恢复合理位置，不把用户带到页面最顶端。错误回焦优先滚动到字段标签和提示的组合区域，而不是只让光标可见。

表单按钮在键盘上方固定时，要处理安全区和横屏宽度；跟随内容滚动时，则要保证最后一个字段完成后仍可提交。设计稿把两种策略分成变体，避免实现时混用。

用系统放大字体和不同输入法测试，确认长文案、候选词和错误提示不会覆盖下一字段。移动端体验的质量取决于这些边界，而不只是默认屏幕截图。

覆盖设备与系统差异

不同系统的键盘高度、返回键和输入法候选区都可能改变视口。设计稿用“键盘出现后剩余可视高度”表达约束，比写死某一设备的像素更可靠。按钮和错误提示的最小间距要能适应系统安全区。

密码、手机号和地址字段的输入方式不同，键盘动作也不同。表单切换字段时保留已输入文本和光标位置，关闭键盘后用户仍能确认内容。若系统自动滚动与产品滚动冲突，优先保证焦点和标签可见。

在测试记录中写明设备方向、字体大小、输入法和网络状态。真实问题往往只在这些组合下出现，不能只用默认模拟器截图判断。

交付时写视口约束

移动表单交付说明键盘出现后的可用高度、滚动容器、焦点安全距离和提交按钮策略。不要只给一张完整屏幕截图；至少提供默认、键盘、错误和提交四个状态。

设备差异、字体放大和横屏测试记录与组件一起保存，便于后续改版继续验证。

用真实输入路径回归

从第一个字段开始连续输入、切换键盘类型、触发错误、收起键盘、返回页面再继续。记录每次焦点和滚动位置，确认自动布局在不同高度下不会把提交按钮或错误提示遮住。

为不同屏高保存状态

同一表单在高屏、低屏和横屏下各保存默认、键盘、错误和提交画板，标出焦点、滚动容器和安全区。对比画板可快速发现按钮被遮挡或错误文案截断。

再用字体放大和长输入文本走一遍，确保自动布局的约束能够承受真实内容变化，而不是只适配短示例。

移动端表单发布后，记录键盘遮挡、滚动跳动、错误回焦和提交超时反馈，按设备和系统版本归类。真实反馈可以帮助团队判断是布局约束还是输入组件需要调整。

把设备测试结果回写到自动布局和表单组件说明，后续新增字段按同一约束实现。这样键盘适配不会在每个页面重复修补，也能避免旧问题回归。

当页面有固定底部栏时，键盘弹出后底部栏可以暂时隐藏或随视口上移，但策略必须稳定。用户提交后再恢复页面位置，避免结果页从错误的滚动位置开始。

把焦点、可视区域、键盘状态和提交结果作为一组验收证据保存，后续页面只需对照这组约束。出现新设备或系统版本时，先回放同一组输入路径再决定是否改布局。再检查错误提示和输入法候选区是否互相遮挡，并记录滚动偏移与焦点变化并回归。