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


对比这两张图的状态栏效果可以看出。第一张图效果对界面来说不是很美观,但是第二个效果就非常美观了。下面我们就来实现。
使用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 实现沉浸式(透明)状态栏效果的更多相关文章
- Android UI体验之全屏沉浸式透明状态栏效果
前言: Android 4.4之后谷歌提供了沉浸式全屏体验, 在沉浸式全屏模式下, 状态栏. 虚拟按键动态隐藏, 应用可以使用完整的屏幕空间, 按照 Google 的说法, 给用户一种 身临其境 的体 ...
- Android 4.4 沉浸式透明状态栏与导航栏
Android 系统自4.2 開始 UI 上就没多大改变,4.4 也仅仅是添加了透明状态栏与导航栏的功能,如图 那么如今我就来给大家解说下怎样使用这个新特性,让你的 app 尾随潮流,当然假设你不在乎 ...
- Android 4.4 沉浸式透明状态栏
原文链接:http://www.bkjia.com/Androidjc/913061.html 第一种方法 这里写代码片第一种方法,在代码设置: if(VERSION.SDK_INT >= VE ...
- delphi 10.3.1 android沉浸式透明状态栏
从10.2升级上来, 之前的沉浸状态栏在android手机上不透明了, 添加二个发布文件,remote path分别设为 res\values-v21和 res\values-v19 style.xm ...
- Android QMUI实战:沉浸式/适配状态栏
近期研究QMUI换肤的实现,顺便分析了下QMUI的沉浸式. 网上已有很多关于QMUI实现页面沉浸式的文章,简而言之:复杂了. 本期,我们仅通过几行代码,即可完美实现页面沉浸式效果,并轻松匹配换肤的色彩 ...
- Android一体式(沉浸式)状态栏的实现
注:公司开发任务适配是在4.4版本之上进行,所以此适配仅在4.4之上进行测试. 1.主要使用了第三方的开源项目SystemBarTint,github:https://github.com/jgilf ...
- Android中的沉浸式状态栏效果
无意间了解到沉浸式状态栏,感觉贼拉的高大上,于是就是试着去了解一下,就有了这篇文章.下面就来了解一下啥叫沉浸式状态栏.传统的手机状态栏是呈现出黑色条状的,有的和手机主界面有很明显的区别.这一样就在一定 ...
- 8.Android 系统状态栏沉浸式/透明化解决方案
转载:http://www.jianshu.com/p/34a8b40b9308 前言 网上已经有很多有关于系统状态栏的解决方案,这篇文章也不会有什么新奇的解决方案,都是本人经过自己试验,统计提炼出来 ...
- Android状态栏微技巧,带你真正意义上的沉浸式
记得之前有朋友在留言里让我写一篇关于沉浸式状态栏的文章,正巧我确实有这个打算,那么本篇就给大家带来一次沉浸式状态栏的微技巧讲解. 其实说到沉浸式状态栏这个名字我也是感到很无奈,真不知道这种叫法是谁先发 ...
随机推荐
- 软件工程1916|W(福州大学)_助教博客】助教总结
2018年上个学期,我担任计算机专业软件工程实践课程的助教,因为有汪老师和她的两位优秀研究生担任助教,基本上没有让我做什么事,除了参加了几次课程答辩.我对于助教需要做的事情其实还是没什么概念的.这个学 ...
- python应用-已知三角形的边长求他的面积和周长
""" 已知三角形的边长求他的面积和周长 Author:罗万财 Date:2017-3-3 """ import math a=float( ...
- (待做例子)问题描述: el-tab 下有2个路由,其中第1个路由设置了 beforeRouteLeave,点击 el-tab 第2个tab时,样式直接跟过去了(预期结果是:样式不到第二个tab上,beforeRouteLeave允许跳转后才到第二个tab上)
解决: 经过以上分析,强制赋值应该在前次赋值而且DOM已经刷新完毕之后进行.可以使用$nextTick,以下是代码: handleTabClick (tab) { let name = this.fi ...
- Redis : REmote DIctionary Server
REmote DIctionary Server(Redis) 是一个由Salvatore Sanfilippo写的key-value存储系统. Redis是一个开源的使用ANSI C语言编写.遵守B ...
- [教程]Ubuntu16.04安装texstudio
[教程]Ubuntu16.04安装texstudio step 1 首先要下载texlive. 不会的戳这里 然后直接终端命令 sudo apt-get install texstudio step ...
- BZOJ 4816[SDOI2017]数字表格(莫比乌斯反演)
题目链接 \(Description\) 用\(f_i\)表示\(fibonacci\)数列第\(i\)项,求\(\prod_{i=1}^{n}\prod_{j=1}^{m}f[gcd(i,j)]\) ...
- 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 ...
- 2018-2019-2 20175211 实验四《Android程序设计》实验报告
目录 一.实验内容及步骤 1.Android Studio的安装测试 2.Activity测试 3.UI测试 4.布局测试 5.事件处理测试 二.问题及解决方法 三.代码托管 四.实验心得体会 一.实 ...
- Feign进行文件上传+表单调用
Feigin默认是不支持文件上传和表单提交的,需要做一些配置才能支持. 1.feign依赖 图中红色为form支持必须的jar. 2.添加自定义Encoder类: import static java ...
- 【Python】解析Python中的线程与进程
基础知识 线程 进程 两者的区别 线程的类型 Python 多线程 GIL 创建多线程 线程合并 线程同步与互斥锁 可重入锁(递归锁) 守护线程 定时器 Python 多进程 创建多进程 多进程通信 ...