参考
android中fitsSystemWindows的用处
我们为什么要用fitsSystemWindows?
全屏、沉浸式、fitSystemWindow使用及原理分析:全方位控制“沉浸式”的实现
Android开发:Translucent System Bar 的最佳实践
Android 沉浸式状态栏攻略 让你的状态栏变色吧
背景
在实现沉浸式状态栏时,我们会用到android:fitsSystemWindows="true"这个属性,对于该属性网上给出的解释实在有些模糊,这里我先描述我对这个属性的理解,理解后再来实现沉浸式状态栏效果。
个人理解
在设置了透明状态栏(StatusBar)或者导航栏(NavigationBar)之后,activity的内容会延伸至对应的区域,使得该区域出现重叠现象,这对内容包含交互控件的情况影响尤其巨大,为了解决这个情况,fitsSystemWindows属性出现了,我们可以为任何view添加此属性,设置了该属性的view的所有padding属性将失效,并且系统会根据情况给该view添加paddingTop和paddingBottom(当设置透明状态栏时,系统会为该view添加一个值等于状态栏高度的paddingTop,当设置了透明导航栏时,系统会为该view添加一个值等于导航栏高度的paddingBottom)。
在默认情况下,多个view设置该属性时,只有最外层的view才会起作用;我们也可以通过覆写自定义view的一些方法来决定自身的处理,及子view是否有机会截断并对fitsSystemWindows做出自己的反应,如DrawerLayout、CoordinatorLayout和CollapsingToolbarLayout就使用了自定义fitsSystemWindow(难怪给drawerLayout设置该属性时和我们理解的行为不一致)。
有了以上的理解,我们可以来动手实现沉浸式状态栏了。
沉浸式状态栏
我们要实现的效果有以下两种:
- 背景图片填满了整个屏幕。
- 状态栏和actionBar颜色一致。
第一种效果:
我们只需要把内容延伸至状态栏和导航栏,然后给根布局设置图片背景,若需要内容不出现在状态栏和导航栏区域则再添加android:fitsSystemWindows="true"既可。
- 在values、values-v19、values-v21的style.xml都设置一个 Translucent System Bar 风格的Theme。
values/style.xml
<style name="AppTheme.Image" parent="AppTheme"/>
values-v19/style.xml和values-v21/style.xml
<style name="AppTheme.Image" parent="AppTheme">
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
- 给activity设置theme。
<activity android:name=".ImageActivity"
android:theme="@style/AppTheme.Image"/>
- 布局添加背景图片和android:fitsSystemWindows="true"。
<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:fitsSystemWindows="true"
android:background="@drawable/image"
tools:context="com.example.myfitwindowsystems.ImageActivity">
</RelativeLayout>
5.0效果:
4.4效果:
若想要去掉5.0系统的半透明状态栏,我们可以设置状态栏颜色为透明,想要设置状态栏,那么就不能隐藏掉状态栏了,因此设置如下:
values-v21/style.xml
<style name="AppTheme.Image" parent="AppTheme">
<item name="android:windowTranslucentStatus">false</item>
<item name="android:windowTranslucentNavigation">true</item>
<item name="android:statusBarColor">@android:color/transparent</item>
</style>
第二种效果
别管兼容4.4了~~ 现在都8.1了~~ 直接修改statusBar颜色不就美滋滋了~~
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP){
getWindow().setStatusBarColor(getResources().getColor(R.color.colorPrimary));
}
或者修改values-v21/style.xml
<style name="AppTheme.Color" parent="AppTheme">
<item name="android:statusBarColor">@color/colorPrimary</item>
</style>
算了,还是写一下兼容写法吧
- 添加theme
values-v19/style.xml
<style name="AppTheme.Color" parent="AppTheme">
<item name="android:windowTranslucentStatus">true</item>
</style>
values-v21/style.xml
<style name="AppTheme.Color" parent="AppTheme">
<item name="android:statusBarColor">@color/colorPrimary</item>
</style>
- 设置theme
<activity android:name=".ColorActivity"
android:theme="@style/AppTheme.Color">
- 修改布局文件
在toolbar添加android:fitsSystemWindows="true",记得高度为wrap_content。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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:orientation="vertical"
tools:context="com.example.myfitwindowsystems.ColorActivity">
<android.support.v7.widget.Toolbar
android:id="@+id/id_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:background="@color/colorPrimary">
</android.support.v7.widget.Toolbar>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello world!"/>
</LinearLayout>
- activity中设置toolbar
Toolbar toolbar = (Toolbar) findViewById(R.id.id_toolbar);
setSupportActionBar(toolbar);
5.0效果:
4.4效果: