五叶神
五叶神
  • 发布:2016-11-15 11:29
  • 更新:2024-06-15 17:34
  • 阅读:6381

【经验分享】解决ios页面切换,状态栏背景、文字样式变换不自然问题

分类:MUI

ios的沉浸模式默认是开启的,是由配置文件apple节点下的UIReserveStatusbarOffset属性设置的;
但是偷偷听说是创建了一个webview在状态栏位置,所以切换页面的时候并不会跟着打开的webview一起滑动,只能通过plus.navigator.setStatusBarBackground("#e3393c");或者init方法的statusBarBackground参数去设置背景颜色,切换加载webview后才会去执行修改背景颜色的方法,就会有一定的延迟,切换不和谐。

故尝试了放弃UIReserveStatusbarOffset,设置值为false,果然页面整体顶上去了,那么接下来就简单了,ios的状态栏高度固定为20px,剩下的就跟安卓的沉浸模式差不多的做法了, ios中mui会给body添加固定的class:mui-plus mui-ios mui-ios-8 mui-ios-8-4 mui-statusbar,那么写几个.mui-ios 下的样式(如:.mui-ios header{ padding-top:20px;})就轻松预留了状态栏的高度,这样header是什么背景就是状态栏的背景了。

如果需要不同页面去修改状态栏文字颜色就只能通过:plus.navigator.setStatusBarStyle("UIStatusBarStyleDefault");

以及init方法的beforeback:function(){plus.navigator.setStatusBarStyle("UIStatusBarStyleBlackOpaque");} 配合变换;

目前这样使用很流畅,基本无延迟,类似原生(ios原生为渐变)

2 关注 分享
smartapple l丶yc

要回复文章请先登录注册