沉浸式状态栏(Immersive Mode)和透明状态栏(Translucent Bar)。

这两个概念很多地方的解释都不是很清晰,所以导致很多人都各有各的认识。所以这里我也有一个自己的认识,笔者认为沉浸式状态栏也可以说是全屏模式,即隐藏状态栏与导航栏。 而透明状态栏是不隐藏状态栏但是它所呈现的是透明的。因为默认情况下状态栏都是黑底白字。而我们现在要实现的就是透明状态栏下的全屏模式。话不多说,看效果:

 
1.png
 
2.png

对比这两张图的状态栏效果可以看出。第一张图效果对界面来说不是很美观,但是第二个效果就非常美观了。下面我们就来实现。

使用cordova实现就需要cordova-plugin-statusbar这个插件,我们需要对此插件进行一些修改即可实现我们想要的效果。

在项目路径->platforms->android->src->org->apache->cordova->statusbar中找到StatusBar.java文件。
然后修改run方法即可:

            public void run() {
// Clear flag FLAG_FORCE_NOT_FULLSCREEN which is set initially
// by the Cordova.
Window window = cordova.getActivity().getWindow(); //添加代码start
window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION); window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.setStatusBarColor(Color.TRANSPARENT);
window.setNavigationBarColor(Color.TRANSPARENT);
//添加代码end
window.clearFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN); // Read 'StatusBarBackgroundColor' from config.xml, default is #000000.
//注释原有设置背景色的方法
//setStatusBarBackgroundColor(preferences.getString("StatusBarBackgroundColor", "#000000"));
}
 
 

Cordova 实现沉浸式(透明)状态栏效果的更多相关文章

  1. Android UI体验之全屏沉浸式透明状态栏效果

    前言: Android 4.4之后谷歌提供了沉浸式全屏体验, 在沉浸式全屏模式下, 状态栏. 虚拟按键动态隐藏, 应用可以使用完整的屏幕空间, 按照 Google 的说法, 给用户一种 身临其境 的体 ...

  2. Android 4.4 沉浸式透明状态栏与导航栏

    Android 系统自4.2 開始 UI 上就没多大改变,4.4 也仅仅是添加了透明状态栏与导航栏的功能,如图 那么如今我就来给大家解说下怎样使用这个新特性,让你的 app 尾随潮流,当然假设你不在乎 ...

  3. Android 4.4 沉浸式透明状态栏

    原文链接:http://www.bkjia.com/Androidjc/913061.html 第一种方法 这里写代码片第一种方法,在代码设置: if(VERSION.SDK_INT >= VE ...

  4. delphi 10.3.1 android沉浸式透明状态栏

    从10.2升级上来, 之前的沉浸状态栏在android手机上不透明了, 添加二个发布文件,remote path分别设为 res\values-v21和 res\values-v19 style.xm ...

  5. Android QMUI实战:沉浸式/适配状态栏

    近期研究QMUI换肤的实现,顺便分析了下QMUI的沉浸式. 网上已有很多关于QMUI实现页面沉浸式的文章,简而言之:复杂了. 本期,我们仅通过几行代码,即可完美实现页面沉浸式效果,并轻松匹配换肤的色彩 ...

  6. Android一体式(沉浸式)状态栏的实现

    注:公司开发任务适配是在4.4版本之上进行,所以此适配仅在4.4之上进行测试. 1.主要使用了第三方的开源项目SystemBarTint,github:https://github.com/jgilf ...

  7. Android中的沉浸式状态栏效果

    无意间了解到沉浸式状态栏,感觉贼拉的高大上,于是就是试着去了解一下,就有了这篇文章.下面就来了解一下啥叫沉浸式状态栏.传统的手机状态栏是呈现出黑色条状的,有的和手机主界面有很明显的区别.这一样就在一定 ...

  8. 8.Android 系统状态栏沉浸式/透明化解决方案

    转载:http://www.jianshu.com/p/34a8b40b9308 前言 网上已经有很多有关于系统状态栏的解决方案,这篇文章也不会有什么新奇的解决方案,都是本人经过自己试验,统计提炼出来 ...

  9. Android状态栏微技巧,带你真正意义上的沉浸式

    记得之前有朋友在留言里让我写一篇关于沉浸式状态栏的文章,正巧我确实有这个打算,那么本篇就给大家带来一次沉浸式状态栏的微技巧讲解. 其实说到沉浸式状态栏这个名字我也是感到很无奈,真不知道这种叫法是谁先发 ...

随机推荐

  1. 软件工程1916|W(福州大学)_助教博客】助教总结

    2018年上个学期,我担任计算机专业软件工程实践课程的助教,因为有汪老师和她的两位优秀研究生担任助教,基本上没有让我做什么事,除了参加了几次课程答辩.我对于助教需要做的事情其实还是没什么概念的.这个学 ...

  2. python应用-已知三角形的边长求他的面积和周长

    """ 已知三角形的边长求他的面积和周长 Author:罗万财 Date:2017-3-3 """ import math a=float( ...

  3. (待做例子)问题描述: el-tab 下有2个路由,其中第1个路由设置了 beforeRouteLeave,点击 el-tab 第2个tab时,样式直接跟过去了(预期结果是:样式不到第二个tab上,beforeRouteLeave允许跳转后才到第二个tab上)

    解决: 经过以上分析,强制赋值应该在前次赋值而且DOM已经刷新完毕之后进行.可以使用$nextTick,以下是代码: handleTabClick (tab) { let name = this.fi ...

  4. Redis : REmote DIctionary Server

    REmote DIctionary Server(Redis) 是一个由Salvatore Sanfilippo写的key-value存储系统. Redis是一个开源的使用ANSI C语言编写.遵守B ...

  5. [教程]Ubuntu16.04安装texstudio

    [教程]Ubuntu16.04安装texstudio step 1 首先要下载texlive. 不会的戳这里 然后直接终端命令 sudo apt-get install texstudio step ...

  6. BZOJ 4816[SDOI2017]数字表格(莫比乌斯反演)

    题目链接 \(Description\) 用\(f_i\)表示\(fibonacci\)数列第\(i\)项,求\(\prod_{i=1}^{n}\prod_{j=1}^{m}f[gcd(i,j)]\) ...

  7. connect via ssh to virtualbox guest vm without knowing ip address

    cat ssh-vm HOSTIP=`ip route get 1 | awk '{match($0, /.+src\s([.0-9]+)/, a);print a[1];exit}'` HOST_N ...

  8. 2018-2019-2 20175211 实验四《Android程序设计》实验报告

    目录 一.实验内容及步骤 1.Android Studio的安装测试 2.Activity测试 3.UI测试 4.布局测试 5.事件处理测试 二.问题及解决方法 三.代码托管 四.实验心得体会 一.实 ...

  9. Feign进行文件上传+表单调用

    Feigin默认是不支持文件上传和表单提交的,需要做一些配置才能支持. 1.feign依赖 图中红色为form支持必须的jar. 2.添加自定义Encoder类: import static java ...

  10. 【Python】解析Python中的线程与进程

    基础知识 线程 进程 两者的区别 线程的类型 Python 多线程 GIL 创建多线程 线程合并 线程同步与互斥锁 可重入锁(递归锁) 守护线程 定时器 Python 多进程 创建多进程 多进程通信 ...