K3.04.2viewport change when software keyboard dismisses设计研究

软键盘收起改变可视区域

别名: 软键盘收起 · 可视区域变化 · hardware keyboard viewport

概念解释

外接键盘一旦到位,系统通常把屏幕上的软键盘收掉,可视区域突然变高:原先被键盘挡住或被顶上去的内容落回原位,底部栏露出来,滚动长度变短。拔掉键盘或点进仍要软键盘的字段,可视区域又会变矮。这条谈的是这块高度预算的涨跌,不是焦点怎么走,也不是快捷键叫什么。软键盘弹出来遮挡输入,是另一类问题;这里的主角是它收起来之后多出来的那截屏,以及它再次出现时被拿回去的那截屏。

机制

平板布局按「当前窗口减去被软键盘占用的 inset」来排。软键盘占掉下半,应用把输入框顶进剩余视口;键盘一收,inset 归零,视口变高。若布局只在初次测量时算过一次,收起后会留下一块按「有键盘」排出来的空白,或把已经顶上去的内容留在上半,下半空着。反过来,人拔掉键盘再点输入框,软键盘重新升起,若底部提交按钮不跟着上移,就会被新键盘盖住。外接键盘模式下有时仍会为搜表情、语音或手写弹出一块矮面板,可视区域是一段连续变化,不是「有 / 无」两档。滚动位置若按「含键盘时的内容高度」来记,键盘收起后会跳,人以为文档自己动了。

怎么研究

在接上键盘、拔掉键盘、以及接上键盘仍弹出表情面板三种条件下,观察同一表单:输入框、提交按钮、底部工具栏是否仍在可视区内,滚动位置是否无故跳动。

自变量:是否监听键盘 inset 变化并重排、提交按钮是钉在窗口底还是钉在可视区底、滚动恢复用的是内容偏移还是视口偏移。 因变量:被遮挡的必操作控件数、键盘收起后的空白带高度、滚动跳动像素、完成一次提交是否需要手动滚。

不要只截「有键盘 / 无键盘」两张静态图,要在连接和断开的瞬间录屏,突变发生在过渡里。桌面没有软键盘 inset,桌面窗口缩放不能当代理。

边界

应用自己决定始终显示软键盘(某些手写或表情优先的输入)时,外接键盘不会收起这块区域,可视区变化不发生,焦点和快捷键仍然要可用。全屏绘图或游戏把软键盘当成干扰,外接键盘后应保持画布全高,不要为了一条本不会出现的 inset 去缩画布。分屏时软键盘可能只属于其中一个窗口,另一个窗口的可视区不应跟着跳。外接键盘带触摸条或功能行时,系统可能再扣一窄条 inset,那是另一块硬件占用,不要和软键盘收起混成一次重排。

怎么落地

  • 监听键盘安全区变化,按当前可视高度排底部栏和提交按钮,不要按设备全高排一次就结束。
  • 软键盘收起后,让被顶上去的内容落回,去掉为键盘留的空白;不要把「有键盘」的滚动偏移原样写回更高的视口。
  • 外接键盘仍可能弹出矮面板(表情、候选、手写),底部主操作要钉在可视区底,而不是钉在屏幕物理底。
  • 验证:接上键盘看提交按钮是否露出且无需滚动;拔掉再聚焦输入框,按钮是否仍在键盘上方。空白带或按钮被盖住,就是可视区没有跟着涨跌。

延伸

  • 同组K3.04.1 外接键盘时需提供完整键盘导航 · K3.04.3 快捷键需要与桌面一致
  • 相邻C6.06 软键盘与屏幕占用 · K3.03 折叠形态切换 · K3.05 分屏与多任务
  • 站内检索software keyboard inset · viewport resize · keyboard dismissal

同组卡片

快捷操作

分享

分享当前页面

ios_share

https://hci.top/zh/handbook/K3.04.2