如何使用Cordova完全隐藏iOS中的状态栏?

2024-01-13

我希望我正在开发的 Cordova 应用程序没有状态栏。我快到了,状态栏没有显示在启动屏幕上。但是,在加载的第一个页面上,您会看到状态栏在隐藏之前闪烁。

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

我已经添加了cordova-plugin-statusbar插件,并在deviceready回调,我正在打电话StatusBar.hide().

然而,当启动图像消失并且正在渲染第一页时,在显示页面之前状态栏会闪烁。虽然只有一瞬间,但看起来很糟糕。

有人知道如何完全隐藏状态栏,并且在隐藏之前不闪烁吗?


原答案

虽然我很晚才回答这个问题,但经过一整天的搜索,我简单地解决了这个问题,所以我想与其他人分享。

根据docs https://github.com/apache/cordova-plugin-statusbar#hiding-at-startup(并且喜欢杰塞萨尔移动 https://stackoverflow.com/users/1351469/jcesarmobile回答):

启动时隐藏

在运行时,您可以使用下面的 StatusBar.hide 函数,但是如果 如果您希望 StatusBar 在应用程序启动时隐藏,则必须修改 您应用程序的 Info.plist 文件。

添加/编辑这两个属性(如果不存在)。设置“状态栏是 最初隐藏”为“是”并设置“查看基于控制器的状态栏 外观”改为“NO”。如果您在没有 Xcode 的情况下手动编辑它,则按键 值为:

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

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

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

(如果您使用的是最新的 Cordova CLI,请参阅此处的更新 2)

因此,作为干净的替代方案,您应该使用科尔多瓦自定义配置 https://www.npmjs.com/package/cordova-custom-config。根据文档:

我为什么要使用它?

虽然一些平台首选项可以通过设置 科尔多瓦/Phonegap 在config.xml,很多(特别是与 较新的平台版本)不能。一种解决方案是手动编辑 配置文件位于platforms/目录中,但这不是 可跨多个开发机器或 CI 环境进行维护 后续的构建操作可能会覆盖您的更改。

这个插件试图通过允许额外的来解决这个差距 准备操作后要设置的特定于平台的首选项 已完成,允许 Cordova 设置的首选项 覆盖或其他要设置的未指定的首选项。自从 自定义首选项被输入到config.xml, 他们可以 致力于版本控制,因此应用于多个 开发机器、CI 环境以及构建之间的维护 或者即使平台被删除并重新添加。

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

cordova plugin add cordova-custom-config --save

并将其添加到您的config.xml文件下<platform name="ios"> block:

请参考科尔多瓦自定义配置 https://github.com/dpa99c/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>

更新 1(2018 年 2 月 20 日)

如果您使用的 cordova-custom-config 插件版本 custom-config-file标记为config-file.

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

更新 2(2018 年 7 月 6 日)

Since 科尔多瓦 CLI 6,您现在不需要安装cordova-custom-config插件用于改变platforms/ios/*-info.plist文件。 Cordova CLI 具有内置支持,使用edit-config标签。所以现在你可以简单地将以下内容添加到你的config.xml under <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>

当您构建 Cordova 应用程序时,此更改可能会失败,因为它会与platform/ios/ios.json文件。要解决此问题,您有两个选择(参考 https://stackoverflow.com/questions/47404622/edit-config-for-ios-usage-descriptions-doc-find-is-not-a-function):

选项 1(杀伤力过大但有效)

重新添加iOS平台:

ionic cordova platform remove ios
ionic cordova platform add ios

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

选项2(推荐但不适合我)

Use platform/ios/ios.json代替*-Info.plist in the edit-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>

然后执行以下操作:

cordova prepare ios
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用Cordova完全隐藏iOS中的状态栏? 的相关文章

随机推荐