iOS 26 Chrome下关闭键盘后SAPUI5布局偏移（残留空白区域）

问题详情 #

• 设备环境：最新款iPad、iOS 16系统、Chrome浏览器
• 应用版本：SAPUI5 1.71.46
• 症状：点击输入框唤起屏幕键盘时，布局正常收缩适配；关闭键盘后，应用无法恢复至全屏高度，屏幕底部残留空白区域。

解决方案建议 #

1. 监听键盘收起事件触发UI重绘 #

iOS Chrome中键盘收起后可能不会自动触发窗口resize事件，需手动监听并强制SAPUI5重绘布局：

// 监听输入框失焦（键盘收起的触发点）
window.addEventListener('focusout', () => {
    // 延迟执行，确保键盘完全收起
    setTimeout(() => {
        // 触发窗口resize事件，触发SAPUI5布局重新计算
        window.dispatchEvent(new Event('resize'));
        // 可选：针对应用根容器直接触发重绘
        const oAppContainer = sap.ui.getCore().byId("appContainer");
        oAppContainer?.rerender();
    }, 300);
});

2. 修正Viewport配置 #

检查应用index.html中的viewport meta标签，确保配置适配iOS移动端：

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">

viewport-fit=cover可避免iOS浏览器的安全区域布局偏移，确保应用占满屏幕。

3. 升级SAPUI5版本 #

SAPUI5 1.71.x为旧版本，已不在官方主流维护范围内，后续版本（如1.84及以上）修复了大量移动端布局相关bug，建议升级至SAP官方支持的维护版本。

4. 排查自定义CSS冲突 #

检查应用中是否存在固定高度的自定义样式、position: fixed元素未正确响应窗口尺寸变化的情况，这类样式可能导致键盘收起后布局高度无法自动更新。

内容的提问来源于stack exchange，提问作者pkm22082559