声明
这篇文章是针对Android 5.0及以上版本的系统进行透明的状态栏设置,Android 5.0以下的系统暂不在本篇文章的讨论范围之内。
Android 5.0透明状态栏——普通界面
先贴出MainActivity布局代码:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimary"
android:fitsSystemWindows="true"
tools:context="stephen.com.material_design.NoteActivity">
<include
layout="@layout/app_bar_note"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</RelativeLayout>
上面的代码中,最主要的两行分别是:
- 设置最外层布局背景色为Toolbar的颜色:
android:background="@color/colorPrimary"
- 设置Toolbar不扩展到状态栏:
android:fitsSystemWindows="true"
在布局文件中设置完毕后,还需要在onCreate()
里面加上如下的代码: - 设置状态栏颜色为透明:
getWindow().setStatusBarColor(Color.TRANSPARENT);
- 设置状态栏和APP的位置关系:
getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
setSystemUiVisibility(int visibility)传入的实参类型如下:
- View.SYSTEM_UI_FLAG_VISIBLE:显示状态栏,Activity不全屏显示(恢复到有状态的正常情况)。
- View.INVISIBLE:隐藏状态栏,同时Activity会伸展全屏显示。
- View.SYSTEM_UI_FLAG_FULLSCREEN:Activity全屏显示,且状态栏被隐藏覆盖掉。
- View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN:Activity全屏显示,但状态栏不会被隐藏覆盖,状态栏依然可见,Activity顶端布局部分会被状态遮住。
主要需要用到的参数就是以上的几个,其他的参数在实际的开发中用的相对较少,这里也就不列举出来了。
通过上面的两个地方的代码设置之后,我们的APP就可以实现透明状态栏的效果了。
以上就是普通的界面设置透明状态栏的方法。
Android 5.0透明状态栏——带DrawerLayout界面
带有DrawerLayout的界面设置透明状态栏,最终效果是和网易云音乐一样的,方法其实和上面的差不多,但是有个小的地方需要注意,在这里我还是把代码和方法都完整的讲一遍。
带有DrawerLayout的布局文件:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimary"
tools:openDrawer="start">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical">
<include
layout="@layout/app_bar_main"/>
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="@layout/nav_header_main"
app:menu="@menu/activity_main_drawer"/>
</android.support.v4.widget.DrawerLayout>
在这里说一下要注意的几个点:
- 这个
<LinearLayout> ... </LinearLayout>
的作用,我之前没有用这个<LinearLayout>
包裹Toolbar
,结果怎么设置,都不能实现非常完美的透明状态栏,要么是statusbar颜色问题,要么是statusbar和NavigationView颜色不统一的问题。后来查找了很多资料,在一个小角落里面发现了,需要外层用<LinearLayout>
包裹一下,这样的话就可以非常完美的显示出网易云音乐的效果了。 -
NavigationView
里面设置的android:fitsSystemWindows="true"
,这个也是为了让侧边栏即抽屉能够和状态栏颜色统一。 -
<include ... />
里面就是正常的设置Toolbar
什么的了,但是要注意在Toolbar
布局的最外层中也记得要添加android:fitsSystemWindows="true"
在布局文件中设置完毕之后,接着就是在代码中设置了,在onCreate()
里面加上如下的代码:
- 设置状态栏颜色为透明:
getWindow().setStatusBarColor(Color.TRANSPARENT);
- 设置状态栏和APP的位置关系:
getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
将以上的所有代码都设置完毕之后,最终呈现的效果如下:
至此,我们已经在Android 5.0上实现透明状态栏。但是对于这样的透明状态栏,我个人是不推荐的。因为我们进行的Android开发,而这个透明状态栏却给人一种IOS的风格,Android开发就应该从方方面面都能够体现出Android的特性。虽然在Android 5.0之前,Android的UI风格一直都惨不忍睹,但是我们一路都坚持下来了,而在Android 5.0之后,因为Material Design的推出,Android的颜值可以说是提升了非常多。所以我们开发人员更应该开发Pure Android的程序,而不是模仿和抄袭IOS的各种风格。