沉浸屏幕状态栏

现在App都讲究“沉浸”样式,不知道这个词从哪里来的,实质就是状态栏透明。我们do平台打开一个新的页面支持三种状态栏方式

显示状态栏:

也就是状态栏的背景色和前景色都是系统提供的缺省颜色,看图:

左边是设计器的设计界面,右边是真机显示的界面,大家可以看到从设计器映射到手机端的线是在状态栏下。这种状态栏样式是缺省值,代码如下

1 button1.on("touch", function() {
2     app.openPage("source://do_App/view/openpage_statusbar/page1.ui");
3 });

透明状态栏:

也就是所谓的“沉浸”式样,这种风格广泛用于ios,在android4.4以后也支持,如果是在android4.4以下显示的效果就和上面第一种样式一致。透明状态栏效果看下图:

左边是设计器的设计界面,右边是真机显示的界面,大家可以看到从设计器映射到手机端的线是在系统状态栏上。通常在IDE设计这个界面的时候最上面先放一个空白的ALayout高度40,然后放一个工具栏ALayout,高度88. JS代码如下

app.openPage({
        source : "source://do_App/view/openpage_statusbar/page2.ui",
        statusBarState : "transparent",
        statusBarFgColor : "black"// 修改缺省的状态栏字体颜色,只有white,black二种,这个属性只支持ios
    });

隐藏状态栏:

系统状态栏看不到了,看图

左边是设计器的设计界面,右边是真机显示的界面,大家可以看到从设计器映射到手机端的线是在系统状态栏上。 JS代码如下:

app.openPage({
        source : "source://do_App/view/openpage_statusbar/page3.ui",
        statusBarState : "hide"
    });
时间: 2024-10-06 08:42:43

沉浸屏幕状态栏的相关文章

Android 沉浸式状态栏

效果图 android 5.0 以上 android 4.4 API 19 以上都是原生安卓系统的效果,具体到国内的各种各样改过的系统可能会有细微差别,测试过小米和华为的机器效果基本一样. 实现 1.修改主题属性 方法一: 在values-v19文件夹下声明AppTheme为透明状态栏,代码如下 1 <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> 2 <!-- C

沉浸式状态栏 设置状态栏颜色

方式一:使用系统API 这个特性是andorid4.4支持的,最少要api19才可以使用. 1.隐藏标题栏等 在代码中设置 requestWindowFeature(Window.FEATURE_NO_TITLE);//隐藏标题栏 getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);//窗口透明的状态栏 getWindow().addFlags(WindowManager.LayoutParams.FL

Android 实现沉浸式状态栏

上一篇文章将Android 实现变色状态栏我们实现了变色的状态栏,也介绍了沉浸式状态栏和透明状态栏的区别,这篇文章我们实现沉浸式状态栏. 沉浸式状态栏的来源就是很多手机用的是实体按键,没有虚拟键,于是开了沉浸模式就只有状态栏消失了.于是沉浸模式成了沉浸式状态栏. 我们先来看下具体的效果 开启沉浸模式后,状态栏消失,从顶部向下滑动,状态栏出现,退出沉浸模式,状态栏也出现了. 我们的代码基于前一篇文章.首先是两个开启沉浸模式和关闭沉浸模式的函数 @SuppressLint("NewApi"

Android中的沉浸式状态栏效果

无意间了解到沉浸式状态栏,感觉贼拉的高大上,于是就是试着去了解一下,就有了这篇文章.下面就来了解一下啥叫沉浸式状态栏.传统的手机状态栏是呈现出黑色条状的,有的和手机主界面有很明显的区别.这一样就在一定程度上牺牲了视觉宽度,界面面积变小.Google从android kitkat(Android 4.4)开始,给我们开发者提供了一套能透明的系统ui样式给状态栏和导航栏,这样的话就不用向以前那样每天面对着黑乎乎的上下两条黑栏了,还可以调成跟Activity一样的样式,形成一个完整的主题,和IOS7.

Qt 5.9 for Android 实现沉浸式状态栏

Android 手机应用程序如果不全屏,系统默认的顶部状态栏的颜色(黑色)会破坏精心设计的 APP 的整体风格和美感,所以,对状态栏的处理,个人觉得还是很有必要的. 在 Qt 5.9 中,使用 QML声明式语言, 通过 Screen 对象来获取到设备的长宽,可以分别获取到整个设备的长宽和去掉手机顶部状态栏之后的长宽,可以说非常方便吧,但是,当你设置整个 Windows 对象或者ApplicationWindow 对象的长宽为设备的最大长宽的时候,会发现并不能生效,状态栏屹立不倒,忘了说了,这个沉

三步实现沉浸式状态栏(即状态栏与APP同色)

本篇实现的是沉浸式状态栏.先明确下概念,什么是状态栏?直接上图: 什么是沉浸式状态栏?示例图如下: 非沉浸式状态栏                                                                        沉浸式状态栏         其实,实质上就是使手机状态栏的颜色改变,使其成为自己想要的颜色.如果把它设置成和APP主色调相同,这样看上去就会好看许多.至于叫法,网上都这么叫,就不用深究它了.下面介绍如何实现,其实很简单,只需三步: 前提:建

android沉浸式状态栏、变色状态栏、透明状态栏、修改状态栏颜色及透明

首先我要区分清楚沉浸式状态栏与变色状态栏. 沉浸式状态栏指的是,状态栏隐藏,在手指做了相关操作后,状态栏显示出来,例如视频播放器,在播放视频时是隐藏状态栏的,但是点击屏幕的时候,状态栏会显示出来,再例如文本阅读器,在阅读的时候是全屏的,然后从屏幕上方下滑或者下方上划,虚拟键和状态栏出现了,但却是直接覆盖在程序文字上的,这是所谓的沉浸式状态栏. 那么大家平时所说的状态栏与导航栏颜色相同,或者透明,指的是变色状态栏,或者透明状态栏. 对于这两个概念的理解,大家可以参考http://www.andro

Android三句代码使用沉浸式状态栏

用过android手机的人都知道android使用app的时候屏幕上方的状态栏都是黑色的,就算不是黑色的都与正在打开的app颜色不同.有一种灰常不搭调的感觉.~ 今天无意中看了一下关于沉浸式状态栏的资料~~作为强迫症重度患者怎能错过? 下面就开始使用沉浸式状态栏之旅: 代码未上图先行: 沉浸式: 非沉浸式: 嗯~虽然第二张图比较模糊,但是也可以想象第一张比较好看(- ̄▽ ̄)-. 那么接下来要说的就是如何实现第一张图的那样的效果: 首先要说明的是以下方法只适合android4.4或以上的系统 an

Android沉浸式状态栏 + scrollView顶部伸缩 + actionBar渐变

最近需求要做一个拉缩渐变的状态栏,往上拉的时候,需要显示actionBar,这个过程是渐变的,顶部的图片背景能实现拉缩,并且还要实现状态栏沉浸式 效果如如下: 实现状态栏的透明化 实现ScrollView的拉缩 实现ActionBar的渐变 实现 1.至于试下实现ScrollView的拉缩这个效果很简单重写onTouchEvent方法,利用滑动的垂直方向的距离,然后在设置图片的大小 这里要注意的是:在手指释放的时候需要进行恢复图片的高度如果有兴趣的话可以加入Android工程师交流Q群:7520