解决WeX5中IOS设备应用标题栏被系统状态栏覆盖的BUG

Posted 2022-12-02 cgtcsdn

//  处理ios设备中，应用标题栏被系统状态栏覆盖的bug；

第一步：引入插件

require("cordova!cordova-plugin-statusbar");

第二步：在“var Model = function()”函数中加入以下代码：

/*
* 设置状态栏的背景颜色，双引号内设置颜色；
* 取值范围：
* black, darkGray, lightGray, white, gray, red, green, 
* blue, cyan, yellow, magenta, orange, purple, brown。
* 注意：android5.0系统以上支持设置状态栏颜色。
*/    

StatusBar.backgroundColorByName("black"); // 将状态栏背景色改为黑色；

// 设置状态栏是否重叠（true / false）。   注：false（不覆盖标题栏），true（覆盖标题栏）；

StatusBar.overlaysWebView(false); // 将状态栏设置为false。

以上代码即可解决问题。

------------------------------------------------------------------------------------------------------------------

顺便介绍另外两个函数：

（1）StatusBar.show(); // 显示状态栏

（2）StatusBar.hide(); // 隐藏状态栏

注：show、hide是Android的方法，overlaysWebView是IOS的方法，backgroundColorByName是Android和IOS通用的