如何使用 Cordova 在 iOS 中完全隐藏状态栏？

Question

提问by Geoff Smith

I want to have no status bar for the Cordova app I am developing. I am nearly there, the status bar doesn't show on the splash screen. However on the first page that loads you see a flash of the status bar, before it gets hidden.

我希望我正在开发的 Cordova 应用程序没有状态栏。我快到了，状态栏没有显示在启动屏幕上。然而，在加载的第一页上，您会看到状态栏的闪烁，然后才被隐藏。

I have checked the "hide status bar" checkbox in Xcode.

我已经选中了 Xcode 中的“隐藏状态栏”复选框。

I have added the cordova-plugin-statusbarplugin, and on the devicereadycallback, I'm calling StatusBar.hide().

我已经添加了cordova-plugin-statusbar插件，在deviceready回调中，我正在调用StatusBar.hide().

However when the splash image disappears and the first page is being rendered there is a flash of status bar prior to the page being display. It is only for a split second but looks awful.

但是，当启动图像消失并且正在呈现第一页时，在显示页面之前状态栏会闪烁。它只是一瞬间，但看起来很糟糕。

Anybody know how the status bar can be hidden completely, without flashing up before being hidden?

有谁知道状态栏怎么可以完全隐藏，隐藏之前不闪？

Answer 1

回答by Shashank Agrawal

Original Answer

原答案

Although I'm answering this question very late but after one full day of the search, I got this working simply so I would like to share it with others.

虽然我很晚才回答这个问题，但经过一整天的搜索，我得到了这个工作，所以我想与其他人分享。

According to the docs(and like jcesarmobile answered):

根据文档（就像jcesarmobile回答的那样）：

Hiding at startup
During runtime you can use the StatusBar.hide function below, but if you want the StatusBar to be hidden at app startup, you must modify your app's Info.plist file.
Add/edit these two attributes if not present. Set "Status bar is initially hidden" to "YES" and set "View controller-based status bar appearance" to "NO". If you edit it manually without Xcode, the keys and values are:

启动时隐藏
在运行时，您可以使用下面的 StatusBar.hide 函数，但如果您希望在应用程序启动时隐藏 StatusBar，则必须修改应用程序的 Info.plist 文件。
如果不存在，请添加/编辑这两个属性。将“状态栏最初是隐藏的”设置为“是”并将“基于控制器的状态栏外观”设置为“否”。如果您在没有 Xcode 的情况下手动编辑它，则键和值是：

This requires you to modify your app's info.plistfile inside platforms/ios/<app-name>/<app-name>-Info.plistfile to add the following lines:

这需要您info.plist在platforms/ios/<app-name>/<app-name>-Info.plist文件中修改应用程序的文件以添加以下几行：

<key>UIStatusBarHidden</key>
<true/>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>

But that is not recommended because this will require you to save that change which might get overwritten after the build process.

但不建议这样做，因为这将要求您保存在构建过程后可能会被覆盖的更改。

(Please see the Update 2 from here if you are using the latest Cordova CLI)

（如果您使用的是最新的 Cordova CLI，请从此处查看更新 2）

So as the clean alternative you should use cordova-custom-config. According to docs:

因此，作为干净的替代方案，您应该使用cordova-custom-config。根据文档：

Why should I use it?
While some platform preferences can be set via Cordova/Phonegap in the config.xml, many (especially ones related to newer platform releases) cannot. One solution is to manually edit the configuration files in the platforms/ directory, however this is not maintainable across multiple development machines or a CI environment where subsequent build operations may overwrite your changes.
This plugin attempts to address this gap by allowing additional platform-specific preferences to be set after the prepare operation has completed, allowing either preferences set by Cordova to be overridden or other unspecified preferences to be set. Since the custom preferences are entered into the config.xml, they can be committed to version control and therefore applied across multiple development machines, CI environments, and maintained between builds or even if a platform is removed and re-added.

我为什么要使用它？
虽然可以通过config.xml. 一种解决方案是手动编辑platforms/目录中的配置文件，但是这在多台开发机器或CI环境中是不可维护的，后续的构建操作可能会覆盖您的更改。
该插件试图通过允许在准备操作完成后设置其他特定于平台的首选项来解决这一差距，允许覆盖由 Cordova 设置的首选项或设置其他未指定的首选项。由于自定义首选项被输入到config.xml.

Now, all you have to do is to run the following command for your Cordova app:

现在，您所要做的就是为您的 Cordova 应用程序运行以下命令：

cordova plugin add cordova-custom-config --save

And add this to your config.xmlfile under <platform name="ios">block:

并将其添加到块config.xml下的文件中<platform name="ios">：

Please refer cordova-custom-config(version > 5) plugin for more information

请参阅cordova-custom-config（版本> 5）插件以获取更多信息

<custom-config-file parent="UIStatusBarHidden" platform="ios" target="*-Info.plist">
    <true/>
</custom-config-file>
<custom-config-file parent="UIViewControllerBasedStatusBarAppearance" platform="ios" target="*-Info.plist">
    <false/>
</custom-config-file>

Update 1 (20th Feb 2018)

更新 1（2018 年 2 月 20 日）

If you are using cordova-custom-config plugin version < 5 then replace custom-config-filetag with config-file.

如果您使用的是 cordova-custom-config 插件版本 < 5，则将custom-config-filetag替换为config-file.

https://github.com/dpa99c/cordova-custom-config#changes-in-cordova-custom-config5

Update 2 (6th July 2018)

更新 2（2018 年 7 月 6 日）

Since Cordova CLI 6, you now don't require to install the cordova-custom-configplugin for altering the platforms/ios/*-info.plistfile. Cordova CLI has the inbuilt support of it using edit-configtag. So now you can simply add the following in your config.xmlunder <platform name="ios">:

从Cordova CLI 6 开始，您现在不需要安装cordova-custom-config插件来更改platforms/ios/*-info.plist文件。Cordova CLI 使用edit-config标签对其进行了内置支持。所以现在你可以简单地在你的config.xml下添加以下内容<platform name="ios">：

<edit-config file="*-Info.plist" mode="merge" target="UIStatusBarHidden">
    <true />
</edit-config>
<edit-config file="*-Info.plist" mode="merge" target="UIViewControllerBasedStatusBarAppearance">
    <false />
</edit-config>

This change might fail when you build your Cordova application because it will conflict with platform/ios/ios.jsonfile. To fix this you have two options (reference):

当您构建 Cordova 应用程序时，此更改可能会失败，因为它会与platform/ios/ios.json文件冲突。要解决此问题，您有两个选择（参考）：

Option 1 (Overkill but working)

选项 1（矫枉过正但有效）

Re-add the iOS platform:

重新添加iOS平台：

ionic cordova platform remove ios
ionic cordova platform add ios

https://issues.apache.org/jira/browse/CB-13564

Option 2 (Recommended but not working for me)

选项 2（推荐但不适合我）

Use platform/ios/ios.jsoninstead of *-Info.plistin the edit-configfile. So the final config you have to add:

在文件中使用platform/ios/ios.json代替。所以你必须添加的最终配置：*-Info.plistedit-config

<edit-config file="platforms/ios/ios.json" mode="merge" target="UIStatusBarHidden">
    <true />
</edit-config>
<edit-config file="platforms/ios/ios.json" mode="merge" target="UIViewControllerBasedStatusBarAppearance">
    <false />
</edit-config>

And then do:

然后做：

cordova prepare ios

Answer 2

回答by jcesarmobile

EDIT:

编辑：

Since Cordova CLI 6.5.0 you can use edit-configtag to write in the info.plist without a plugin. This should hide the statusbar at startup

从 Cordova CLI 6.5.0 开始，您可以使用edit-configtag 在 info.plist 中写入而无需插件。这应该在启动时隐藏状态栏

<edit-config file="*-Info.plist" target="UIStatusBarHidden" mode="merge">
    <true/>
</edit-config>
<edit-config file="*-Info.plist" target="UIViewControllerBasedStatusBarAppearance" mode="merge">
    <false/>
</edit-config>

Hiding at startup
During runtime you can use the StatusBar.hide function below, but if you want the StatusBar to be hidden at app startup, you must modify your app's Info.plist file.
Add/edit these two attributes if not present. Set "Status bar is initially hidden" to "YES" and set "View controller-based status bar appearance" to "NO". If you edit it manually without Xcode, the keys and values are:

启动时隐藏
在运行时，您可以使用下面的 StatusBar.hide 函数，但如果您希望在应用程序启动时隐藏 StatusBar，则必须修改应用程序的 Info.plist 文件。
如果不存在，请添加/编辑这两个属性。将“状态栏最初是隐藏的”设置为“是”并将“基于控制器的状态栏外观”设置为“否”。如果您在没有 Xcode 的情况下手动编辑它，则键和值是：

<key>UIStatusBarHidden</key>
<true/>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>

https://github.com/apache/cordova-plugin-statusbar

Answer 3

回答by Web Developer

This way worked to me:

这种方式对我有用：

On your mac or VM xcode, select TARGETS->Your app

在您的 mac 或 VM xcode 上，选择 TARGETS->Your app

Then on INFO menu, on CUSTOM iOS TARGET PROPERTIES, add this NEW properties:

然后在 INFO 菜单上，在 CUSTOM iOS TARGET PROPERTIES 上，添加以下新属性：

Statusbar is initially hidden -> Then set the value to YES.

状态栏最初是隐藏的 -> 然后将值设置为 YES。

View controller-based status bar appearance -> Then set the value to NO

查看基于控制器的状态栏外观 -> 然后将值设置为 NO

Build and you should have no statusbar.

构建，你应该没有状态栏。

printscreen: http://prntscr.com/fg0jtf

打印屏幕：http: //prntscr.com/fg0jtf

Answer 4

回答by Ronit Roy

I was also having the same problem for android. It was solved by simply calling the below statusBar() function from the 'appCtrl' init() function.

我也遇到了同样的问题 android。它是通过简单地从“appCtrl”init() 函数调用下面的 statusBar() 函数来解决的。

Hope it will work for iOS.

希望它适用于iOS。

 $rootScope.statusBar = function(){
        document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    //console.log(StatusBar);
    StatusBar.hide();
}

如何使用 Cordova 在 iOS 中完全隐藏状态栏？

提问by Geoff Smith

回答by Shashank Agrawal

Original Answer

原答案

Hiding at startup

启动时隐藏

Why should I use it?

我为什么要使用它？

Update 1 (20th Feb 2018)

更新 1（2018 年 2 月 20 日）

Update 2 (6th July 2018)

更新 2（2018 年 7 月 6 日）

Option 1 (Overkill but working)

选项 1（矫枉过正但有效）

Option 2 (Recommended but not working for me)

选项 2（推荐但不适合我）

回答by jcesarmobile

回答by Web Developer

回答by Ronit Roy

相关推荐

最近更新

标签

如何使用 Cordova 在 iOS 中完全隐藏状态栏？

提问by Geoff Smith

回答by Shashank Agrawal

Original Answer

原答案

Hiding at startup

启动时隐藏

Why should I use it?

我为什么要使用它？

Update 1 (20th Feb 2018)

更新 1（2018 年 2 月 20 日）

Update 2 (6th July 2018)

更新 2（2018 年 7 月 6 日）

Option 1 (Overkill but working)

选项 1（矫枉过正但有效）

Option 2 (Recommended but not working for me)

选项 2（推荐但不适合我）

回答by jcesarmobile

回答by Web Developer

回答by Ronit Roy

相关推荐

ios 如何使页脚视图始终位于 UITableViewController 的底部？

ios 在tableview单元格中选择更改图像 - Swift

ios 无法完成此操作。再试一次 (-22421)

ios 如何通过 AFNetworking 进行 GET 请求？

相关推荐

最近更新

标签