iOS Phonegap 中的白色状态栏?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/20062186/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
White status bar in iOS Phonegap?
提问by user3007104
how to make top status bar translucent with white text in Phonegap 3.1.0 for iOS7?
如何在iOS7的Phonegap 3.1.0中使顶部状态栏半透明并带有白色文本?
App looks fine in mobile Safari, but when I try to run it in Phonegap text at top bar is white only while app loading, after that it's black no matter what settings I set in project's config.
应用程序在移动 Safari 中看起来不错,但是当我尝试在顶部栏中的 Phonegap 文本中运行它时,只有在应用程序加载时才显示白色,之后无论我在项目配置中设置什么设置,它都是黑色的。
Right now have <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
in web page & 'Status Bar Style' = 'Black Translucent' in XCode... doesn't help.
现在<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
在网页和 XCode 中的 'Status Bar Style' = 'Black Translucent' ... 没有帮助。
Pls help!
请帮忙!
回答by rickdmer
You can do this without any meta tags or editing anything in XCode.
您可以在没有任何元标记或在 XCode 中编辑任何内容的情况下执行此操作。
First, install the statusbar plugin via CLI:
首先,通过 CLI 安装状态栏插件:
cordova plugin add cordova-plugin-statusbar
Then you can use these preferences to style the status bar (in config.xml):
然后您可以使用这些首选项来设置状态栏的样式(在 config.xml 中):
<preference name="StatusBarOverlaysWebView" value="true" />
<preference name="StatusBarStyle" value="lightcontent" />
This will give you a transparent bar in iOS 7 with white text. For other options check out http://plugins.cordova.io/#/package/org.apache.cordova.statusbar
这将在 iOS 7 中为您提供一个带有白色文本的透明栏。对于其他选项,请查看http://plugins.cordova.io/#/package/org.apache.cordova.statusbar
回答by user3007104
finally, I found solution.
最后,我找到了解决方案。
Make sure you have following: At your index.html have following meta tag:
确保您具有以下内容:在您的 index.html 中具有以下元标记:
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
At Xcode, open [YourPrjectName].plist & add following lines:
在 Xcode 中,打开 [YourPrjectName].plist 并添加以下行:
"Status bar style" = "Transparent black style (alpha of 0.5)" AND
"View controller-based status bar appearance" = "NO"
“状态栏样式”=“透明黑色样式(alpha 为 0.5)”和
“基于控制器的状态栏外观”=“否”
Without second line in will not work (actually, that was the issue in my case).
没有第二行是行不通的(实际上,这就是我的问题)。
回答by Leo Chen
if you use phonegap build, you can call
如果你使用phonegap build,你可以打电话
StatusBar.styleLightContent();
回答by Gilana
Take a look at the link below, hope this could help you.
看看下面的链接,希望对你有帮助。
回答by Malaka Gunawardhana
May be too late, but someone else with the same question may resolve this by installing below plugin.
可能为时已晚,但其他有相同问题的人可以通过安装以下插件来解决此问题。
cordova plugin add cordova-plugin-disable-ios11-statusbar --save
cordova plugin add cordova-plugin-disable-ios11-statusbar --save
Then build and run the app the issue will be solved
然后构建并运行应用程序问题将得到解决
回答by OliverJ90
I figured a more up to date answer may help someone here, this works in cordova 3.7+ and iOS 8.x and negates the need for the extra plugin.
我想一个更新的答案可能对这里的人有所帮助,这适用于cordova 3.7+和iOS 8.x,不需要额外的插件。
In your project's plist file make sure that "Status bar is initially hidden" and "View controller-based status bar appearance" are both set to "NO"
在您项目的 plist 文件中,确保“状态栏最初是隐藏的”和“基于控制器的状态栏外观”都设置为“否”
Then, in MainViewController.m, inside - (void)viewDidLoad
add:
然后,在 MainViewController.m 里面- (void)viewDidLoad
添加:
[[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleLightContent animated:YES];
or
或者
[[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleDefault animated:YES];
for white or black text in your status bar.
用于状态栏中的白色或黑色文本。
Alternatively to hide completely, set both plist attributes above to YES, which appears to work for hiding it.
或者完全隐藏,将上面的两个 plist 属性设置为 YES,这似乎可以隐藏它。
回答by Ved
Add this one
添加这个
function onDeviceReady() {
if (parseFloat(window.device.version) === 7.0) {
document.body.style.marginTop = "20px";
}
}
document.addEventListener('deviceready', onDeviceReady, false);
The Status Bar Issue in iOS7
iOS7 状态栏问题
http://coenraets.org/blog/2013/09/phonegap-and-cordova-with-ios-7/
http://coenraets.org/blog/2013/09/phonegap-and-cordova-with-ios-7/