科尔多瓦隐藏状态栏

Question

我正在使用Phonegap和Framework7为iPad构建应用程序，无论我做什么都似乎无法隐藏iPad上的状态栏。我已经尝试了一些教程，包括以下问题：

• 如何使用Phonegap Build删除iOS状态栏？
• 如何在iOS中使用Cordova完全隐藏状态栏？
• Cordova/Phonegap在iOS上忽略config.xml中的全屏首选项

我尝试了以上所有问题答案中提供的解决方案，但我的状态栏仍然存在。

我使用xCode打开项目并查看设置已正确配置：

对于部署信息中的iPhone设置：

• 状态栏样式：默认
• 隐藏状态栏（已选中）
• 需要全屏幕（已选中）

针对iPad部署信息中的设置：

• 应用程序启动时隐藏（已选中）
• 需要全屏幕（已选中）

在 Info > 自定义iOS目标属性 中，我已经进行了以下设置：

• 视图控制器基于状态栏外观：否

当 deviceready 事件被触发时，我也尝试使用JavaScript的方式：

StatusBar.hide();

更新

当我运行：

StatusBar.isVisible

该属性返回false，但我仍然看到顶部的白色条。

- Chin Leung

---

你是否已经将状态栏插件添加到你的应用程序中了？ - kris

@kris 是的，我已经在应用程序中添加了它。 - Chin Leung

Answer 1

经过长时间的调试，我终于找到了问题所在。

实际上，状态栏已经被隐藏了，我们看到的白色条是Framework7提供的覆盖层，这就解释了下面的情况：

StatusBar.isVisible // false

显然Framework7正在隐藏状态栏，但在应用程序顶部留下了一个空白的白色栏，即内边距。

所以要删除该栏，我必须从html标签中删除类with-statusbar-overlay。为此，我将以下内容添加到我的Javascript文件中：

document.documentElement.classList.remove('with-statusbar-overlay');

请注意，在deviceready事件之前必须执行Javascript修复。否则，您将看到带有栏的主视图，然后该栏将消失。如果您在事件之前放置它，则用户将永远看不到该栏。

document.documentElement.classList.remove('with-statusbar-overlay');

Dom7(document).on('deviceready', function(){
    // Your code
});

- Chin Leung