透明状态栏(沉浸式状态栏)
透明状态栏(Translucate StatusBar)是android从4.4开始模仿ios推出的一种模式,他可以改变状态栏的颜色,使其更加的与自己的app样式所统一
- android 4.4推出的状态栏为透明样式,但会有一层灰色的自顶向下的渐变色。
- Android 5.0推出的状态栏默认为半透明样式的,但可通过代码使其变成全透明模式的。
实现方式
实现方式有两种:
- 通过在我们app顶部添加一个等于状态栏高度的view,并定义上我们app样式的颜色即可,但其局限性较高,只能定于固定颜色,对于不同颜色需要由不同的代码去实现。
- 第二种是利用
fitsSystemWindows
属性以及对应的样式进行实现。
通过顶部添加一个view实现(待完善,可参考hongyang博客)
通过 fitsSystemWindows
实现。
- 创建values-19文件夹并创建styles文件,添加如下代码
<resources>
<style name="AppBaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowTranslucentStatus">true</item>
</style>
</resources>
windowTranslucebtStatus表示透明状态栏的属性
- 创建values-21文件,并创建styles文件,添加如下代码
<resources>
<style name="AppBaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">@android:color/transparent</item>
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowContentTransitions">true</item>
</style>
</resources>
- 通常我们会让我们的状态栏和我们的app的标题一样,android5.0 推出的ToolBar或者我们往往会自定义并封装我们自己的标题栏。好消息是ToolBar已经实现了对应的属性,我们只需要正常的使用即可,不好的消息是我并不会用- 0 -。后期补充ToolBar的使用。但ToolBar使用的并不多,我们往往自定义title。那么在title中我们只需要添加一个
fitsSystemWindows
属性即可。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/blue"
android:fitsSystemWindows="true"
android:gravity="center"
android:minHeight="?attr/actionBarSize"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="@dimen/y48" >
<TextView
android:id="@+id/tv_title_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="bottom"
android:text="标题"
android:textSize="@dimen/title_text_font" />
<ImageView
android:id="@+id/iv_title_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="@dimen/x5"
android:padding="@dimen/x15"
android:scaleType="centerCrop"
android:src="@drawable/back_up_left" />
<LinearLayout
android:id="@+id/ll_title_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:orientation="horizontal" />
</RelativeLayout>
</LinearLayout>
在实现该属性时,我的根视图本身是一个<RelativeLayout>
,但当我加入fitsSystemWindow
属性时,发现会出现布局错乱的现象,及标题的位置明明是居中确偏上,我用试图边界进行查看时,返现标题的高度虽是wrap_content
,但确不是包裹,我个人认为应该是RelativeLayout
的测量问题(有待考证)。
OK ,伟大的透明状态栏就实现了。
但是,在android5.0以上使用以上代码时,会发现有一个半透明的覆盖层,这不是逼死强迫症吗,所以在网上搜了一段代码,添加到BaseActivity中,靠谱。
@Override
protected void onStart() {
// TODO Auto-generated method stub
if (VERSION.SDK_INT >= VERSION_CODES.LOLLIPOP) {
Window window = getWindow();
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.getDecorView().setSystemUiVisibility(
View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
| View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.setStatusBarColor(Color.TRANSPARENT);
}
super.onStart();
}