无法使用 Cordova 更改状态栏
Can't Change Status Bar with Cordova
我正在使用 Cordova 构建混合应用程序,并且正在尝试动态更改状态栏的颜色。我动态地这样做的原因是不同的平台可以使用略有不同的颜色来让它感觉更原生。
我在我的项目中 installed cordova-plugin-statusbar
,现在我的应用程序的 JS 代码中有 StatusBar
对象。但是,当我尝试使用 StatusBar.backgroundColorByHexString
方法时,它不起作用。
这是处理这个问题的代码:
function onDeviceReady() {
document.addEventListener( 'pause', onPause.bind( this ), false );
document.addEventListener( 'resume', onResume.bind( this ), false );
if (StatusBar) {
window.alert("The plugin loaded correctly.");
}
if (cordova.platformId == 'ios') {
StatusBar.overlaysWebView(false);
StatusBar.backgroundColorByHexString("#4CAF50");
window.alert("The plugin should have run.");
} else {
StatusBar.backgroundColorByHexString("#388E3C");
window.alert("The plugin should have run.");
}
};
代码运行时没有抛出任何错误,但它根本没有改变状态栏(我正在 Android 设备上进行测试,所以我假设相同的行为发生在其他设备上平台)。我该如何解决这个问题?
我终于弄明白了,所以如果其他人有这个问题,这里是解决方案:
- 启动 Cordova 工具扩展的卸载程序
- "Repair"扩展并重启Visual Studio
- 进入设置并清除 Cordova 缓存
- 将 Cordova CLI 版本更改为 5.1.1
- 为了完成对 5.1.1 的更新,安装白名单插件,将域策略信息添加到您的
config.xml
文件,并向每个页面添加 CSP 策略标记,例如 <meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
在您的应用中
我正在使用 Cordova 构建混合应用程序,并且正在尝试动态更改状态栏的颜色。我动态地这样做的原因是不同的平台可以使用略有不同的颜色来让它感觉更原生。
我在我的项目中 installed cordova-plugin-statusbar
,现在我的应用程序的 JS 代码中有 StatusBar
对象。但是,当我尝试使用 StatusBar.backgroundColorByHexString
方法时,它不起作用。
这是处理这个问题的代码:
function onDeviceReady() {
document.addEventListener( 'pause', onPause.bind( this ), false );
document.addEventListener( 'resume', onResume.bind( this ), false );
if (StatusBar) {
window.alert("The plugin loaded correctly.");
}
if (cordova.platformId == 'ios') {
StatusBar.overlaysWebView(false);
StatusBar.backgroundColorByHexString("#4CAF50");
window.alert("The plugin should have run.");
} else {
StatusBar.backgroundColorByHexString("#388E3C");
window.alert("The plugin should have run.");
}
};
代码运行时没有抛出任何错误,但它根本没有改变状态栏(我正在 Android 设备上进行测试,所以我假设相同的行为发生在其他设备上平台)。我该如何解决这个问题?
我终于弄明白了,所以如果其他人有这个问题,这里是解决方案:
- 启动 Cordova 工具扩展的卸载程序
- "Repair"扩展并重启Visual Studio
- 进入设置并清除 Cordova 缓存
- 将 Cordova CLI 版本更改为 5.1.1
- 为了完成对 5.1.1 的更新,安装白名单插件,将域策略信息添加到您的
config.xml
文件,并向每个页面添加 CSP 策略标记,例如<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
在您的应用中