iPhone 隐藏底部横杠（Home Indicator）方法大全

自 iPhone X 起，苹果引入了全面屏设计，并在屏幕底部增加了一条用于返回主屏幕或切换应用的“横杠”（78TP称为 Home Indicator）。虽然它提升了交互体验，但在某些场景下（如全屏视频、游戏或网页展示），用户希望将其隐藏以获得更沉浸的视觉效果。

一、普通用户：能否在系统中隐藏？

遗憾的是，普通用户无法通过 iOS 系统设置永久隐藏底部横杠。这是苹果为保证基本导航功能而保留的设计。不过，在以下情况下横杠会自动暂时隐藏：

观看全屏视频（如 YouTube、Netflix）
使用支持全屏模式的游戏或 App
进入某些阅读或演示模式的应用

提示：横杠仅在检测到用户一段时间未操作屏幕后自动淡出，一旦触碰屏幕即重新显示。这是系统级行为，不可关闭。

二、网页开发者：如何在网页中隐藏 Home Indicator？

如果你是前端开发者，可通过以下方式优化网页在 iPhone 上的显示效果，促使系统自动隐藏横杠：

1. 使用 viewport-fit=cover

在 HTML 的 <head> 中添加如下 meta 标签：

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

2. 设置安全区域并启用全屏

配合 CSS 使用 env(safe-area-inset-*) 并确保内容延伸至屏幕边缘：

body {
  margin: 0;
  padding: env(safe-area-inset-top) env(safe-area-inset-right)
           env(safe-area-inset-bottom) env(safe-area-inset-left);
  height: 100vh;
  overflow: hidden;
}

3. 请求全屏（部分浏览器支持）

通过 JavaScript 触发全屏模式（Safari 在 iOS 16+ 有限支持）：

document.documentElement.webkitRequestFullscreen();

注意：此方法在移动端 Safari 中受限，通常仅在特定上下文中有效。

三、App 开发者（iOS 原生）

如果你开发的是原生 iOS 应用，可通过以下方式控制 Home Indicator 的显示：

重写视图控制器的 prefersHomeIndicatorAutoHidden 方法，返回 true：

override var prefersHomeIndicatorAutoHidden: Bool {
    return true
}

这样系统会在适当时候自动隐藏横杠，提升沉浸感。

四、常见误区澄清

❌ “越狱后可以永久隐藏横杠” —— 即使越狱，修改系统 UI 存在风险且不稳定。
❌ “安装某个 App 就能隐藏” —— 普通 App 无权限控制系统级 UI 元素。
✅ 正确做法：利用系统提供的 API，在合适场景下触发自动隐藏。