zoukankan      html  css  js  c++  java
  • 沉浸式状态栏

    1、沉浸式状态栏

    如果页面顶部是图片,一般会把状态栏变成透明。

    首先可以检测下当前环境是否支持沉浸式状态栏,检测语句:

    //是否支持沉浸式状态栏
    alert(plus.navigator.isImmersedStatusbar());

    默认是不支持的,会弹出false. 想让环境支持,需要修改项目下的配置文件manifest.json

    "plus":{
        "statusbar": {
            "immersed": true
           },
           ...
    }
    

    修改完成后,会弹出true.效果如下:

    终端支持:

    • Android4.4及以上系统支持;

    • iOS7.0及以上系统支持。

    2、状态栏全屏

    全屏并非状态栏透明或变色,而是没有状态栏,也就是看不见电量、信号那条了。
    设置语句:

    //参数:true - 全屏;false - 不全屏
    plus.navigator.setFullscreen(true);

    效果如下:

    终端支持:
    没有终端类型限制

    3、状态栏背景色

    修改背景色一般用于页面顶部背景色为纯色的场景,修改成和页面一致的背景色,使页面更和谐。

    修改语句:

    //设置系统状态栏背景色
    plus.navigator.setStatusBarBackground('#6495ED'); 

    效果如下:

    终端支持:

    • Android5及以上系统支持;

    • iOS7.0及以上系统支持。

    4、状态栏文字颜色

    与背景色调整相同,如果背景图颜色不当,会造成前景的信号栏文字颜色与背景太相近,看不清前景,此时需要调整前景色。
    前景色的使用限制更多些,只能设置黑或白,设置语句:

    //参数:dark - 黑色; light - 白色
    plus.navigator.setStatusBarStyle('light');

    效果如下:

    终端支持:

      • Android5只有小米和魅族支持,Android6及以上所有安卓支持;

      • iOS7及以上支持

  • 相关阅读:
    "分段器"组件:<segment> —— 快应用组件库H-UI
    "页内标签"组件:<tab> —— 快应用组件库H-UI
    "标签栏"组件:<main-tab> —— 快应用组件库H-UI
    "导航栏"组件:<nav-bar> —— 快应用组件库H-UI
    如何配置pch文件
    如何清除Xcode8打印的系统日志
    iOS打包ipa给客户测试流程
    如何安装ipa文件
    如何获取苹果手机的UDID
    iOS键盘输入屏幕上移
  • 原文地址:https://www.cnblogs.com/tine/p/8243318.html
Copyright © 2011-2022 走看看