Android 实现变色状态栏

首先我们得了解什么是透明状态栏以及什么是沉浸式状态栏,以及其区别,国内习惯称透明状态栏为沉浸式状态栏,但是两者是有本质区别的。

先来看看什么是沉浸式模式。

Android 4.4中,沉浸式体验得到了再次强化,提供了一种“全屏模式”(Full-screen Immersive Mode)。全屏模式又分两种,一种叫后撤式 (Lean Back),另一种叫做沉浸式(Immersive)。后撤式已经在之前的系统中被广泛使用了——当你在优酷APP中观看视频时,大部分时间手指是不会去碰屏幕的。这种情况下,虚拟键和状态栏都会自动隐藏,但当你触摸屏幕的时候,它们又会出现。而新加入的沉浸式则不太一样,在沉浸式全屏状态下,对屏幕的操作并不会唤出系统栏。想要唤出系统栏,你必须从屏幕的上/下边缘向屏幕内划入。沉浸式的全屏状态更适合游戏和阅读这样的应用。

但沉浸模式和普通全屏不同点在于,沉浸模式通过下滑屏幕上方或者下方可以调出虚拟键和状态栏。

比如多看阅读,下图是在阅读时沉浸模式下全屏。

然后从屏幕上方下滑或者下方上划,虚拟键和状态栏出现了。但却是直接覆盖在程序文字上的。

而沉浸式状态栏的来源就是很多手机用的是实体按键,没有虚拟键,于是开了沉浸模式就只有状态栏消失了。于是沉浸模式成了沉浸式状态栏。

Android 4.4 一个很重要的改变就是透明系统栏.。新的系统栏是渐变透明的, 可以最大限度的允许屏幕显示更多内容, 也可以让系统栏和 Action Bar 融为一体, 仅仅留下最低限度的背景保护以免通知通知栏内容和 Action Bar 文字/图标难以识别。谷歌把这种效果称之为:Translucent Bar。

Translucent Bar 是 Android 对 Edge to Edge 尝试中的一个, 也是最容易被用户注意到的. 它的初始目的就是要最大化可视面积和淡化系统界面的存在感。

其实简单一点就是布局延伸到状态栏,状态栏背景与应用背景相同,这就是*透明状态栏*。最直接的例子就是UC浏览器的天气界面,其布局延伸到状态栏,但是状态栏与应用同背景,如图所示

但是这样有时候会把状态栏颜色变得和应用的背景颜色一样,但是实际上只是修改了状态栏的颜色,我们称它为变色状态栏

而现在大家所在用的QQ等软件,状态栏与软件颜色融为一体,其实就是变色状态栏。而小米MIUI的自带应用,也都是变色状态栏或者是透明状态栏,而并非是沉浸式状态栏。

这里我们姑且称变色状态栏为透明状态栏的一种,本篇文章就是带大家实现这种透明状态栏。

由于这种效果只有在4.4及以上有效,所以本篇文章的效果只有在4.4及以上有效。

首先应用主题


        @color/colorPrimary
        @color/colorPrimaryDark

" data-snippet-id="ext.7aa43b0f8d91da8238f865c9576446df" data-snippet-saved="false" data-codota-status="done"><resources>

    <style name="AppTheme" parent="@style/BaseTheme">

    </style>
    <style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    </style>

</resources>

然后我们在res下新建一个values-v19的目录,代表最低API为19,新建一个style.xml,下面的代码是透明状态栏的关键


        true
        true

" data-snippet-id="ext.6d530167ba32f626785eebb613c33747" data-snippet-saved="false" data-codota-status="done"><resources>

    <style name="AppTheme" parent="@style/BaseTheme">
        <item name="android:windowTranslucentNavigation">true</item>
        <item name="android:windowTranslucentStatus">true</item>
    </style>

</resources>

我们禁用了系统的ActionBar,使用ToolBar代替,布局代码如下

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:fitsSystemWindows="true"
        ></android.support.v7.widget.Toolbar>

</LinearLayout>

细心的你会发现在Toolbar中加入了android:fitsSystemWindows=”true”属性,这就是将布局延伸到状态栏,这时候你运行一下,会发现Toolbar上移到了状态栏的位置。上移的高度刚好是状态栏的高度。

但是我们并不想它移动到上面,只是想它状态栏和Toolbar颜色一样,要怎么做的,很简单,在代码中通过setSupportActionBar设置到ActionBar的位置即可。

Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);

之后的效果就是这样的。

很明显的看到,ToolBar就是之前的高度,但是状态栏也变色了。

但是我们又怎么能满足于此呢。在Android 5.0上,我们的状态栏的颜色是要比Toolbar的颜色要深的。就像这样。

我们还要进一步修饰,需要对状态栏着色,这里需要用到一个开源库SystemBarTint

加入依赖

  compile ‘com.readystatesoftware.systembartint:systembartint:1.0.3‘

之后再设置布局后加入以下代码

SystemBarTintManager tintManager=new SystemBarTintManager(this);
tintManager.setStatusBarTintResource(R.color.colorPrimaryDark);
tintManager.setStatusBarTintEnabled(true);

最终效果就是上图所示

当然这个库里还有很多函数,具体功能自己去琢磨吧,并且其内部源码也并不复杂,建议还是看下其源码实现。

本篇文章的源码简单,就不上源码了。

版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-10-09 23:30:58

Android 实现变色状态栏的相关文章

android 变色状态栏

最近想着让自己做的app看起来好看点..所以给自己的app添加了可以变色的状态栏..我没有做向下的兼容...只能手机版本是4.4及以上的手机使用.网上有人叫沉浸式,我觉着这边博主的解释是正确的: Android 实现变色状态栏 特别重要的一步: Activity一定要使用一种主题! android:theme="@style/AppTheme.NoActionBar" 这里我使用的是默认的主题,看你自己需要使用. 1,首先在activity的onCreate方法中,将标题栏设置为透明:

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

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

Android 透明的状态栏有渐变的阴影效果

前言 欢迎大家我分享和推荐好用的代码段~~ 声明          欢迎转载,但请保留文章原始出处: CSDN:http://www.csdn.net 雨季o莫忧离:http://blog.csdn.net/luckkof 正文 状态栏透明后有渐变的阴影效果,如何去除? 这是google default设计,如果桌面壁纸是白色的时候比较明显,这个渐进的效果是通过背景图来设置的,在frameworks/base/packages/systemui/res/ 里面drawable-hdpi(如果是其

Android 沉浸式状态栏

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

Android 沉浸式状态栏 实现方式二 ( 更简单 )

以前写过一个沉浸式状态栏 的实现方式 Android 沉浸式状态栏 实现方式一 现在有个更为简单的实现方式 . 相关链接 http://www.apkbus.com/forum.php?mod=viewthread&tid=255929&extra=page%3D3%26filter%3Dsortid%26orderby%3Ddateline%26sortid%3D12 1.效果图 demo 的 github 地址  https://github.com/zyj1609wz/Android

android 实现自定义状态栏通知(Status Notification)

在android项目的开发中,有时为了实现和用户更好的交互,在通知栏这一小小的旮旯里,我们通常需要将内容丰富起来,这个时候我们就需要去实现自定义的通知栏,例如下面360或者网易的样式: 首先我们要了解的是 自定义布局文件支持的控件类型:Notification的自定义布局是RemoteViews,因此,它仅支持FrameLayout.LinearLayout.RelativeLayout三种布局控件,同时支持AnalogClock.Chronometer.Button.ImageButton.I

【Android实战】Android沉浸式状态栏实现(下)

之前的Android沉浸式状态栏实现并没有考虑软键盘的影响,接下来的内容将会针对这个问题给出解决方式,先看一下效果图 这个是一个留言板的效果图: 即弹出软键盘的时候并不会导致整个布局上移. 详细怎样实现?依照下面步骤进行设置: 1.布局文件里声明例如以下 <activity android:name="com.storm.durian.activity.LeaveMessageDetailsActivity" android:screenOrientation="por

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

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

Android 沉浸式状态栏攻略 让你的状态栏变色吧

转载请标明出处: http://blog.csdn.net/lmj623565791/article/details/48649563: 本文出自:[张鸿洋的博客] 一.概述 近期注意到QQ新版使用了沉浸式状态栏,ok,先声明一下:本篇博客效果下图: 关于这个状态栏变色到底叫「Immersive Mode」/「Translucent Bars」有兴趣可以去 为什么在国内会有很多用户把 ?透明栏?(Translucent Bars)称作 ?沉浸式顶栏??上面了解了解,请勿指点我说的博文标题起得不对