现在大部分android手机都是android4.4以上,都支持开发者可以自定义状态栏色值,原来的黑底白字时代已过去。在android5.0上我们还可以自定义状态栏文字色值,让其显示深色字体。

一、沉浸式状态栏的实现

实现沉浸式状态栏效果,一般有两种方式:

1、设置系统主题,在styles.xml中设置,在相应需要实现的界面里设置其android:theme主题。

需要根据不同机器版本设置多个styles.xml文件。
下面是values-v21下的styles.xml—android5.0以上机器适用的主题

 <style name="AppTheme" parent="AppTheme.Base"><item name="android:colorPrimary">@color/colorPrimary</item><item name="android:colorPrimaryDark">@color/colorPrimaryDark</item><item name="android:colorAccent">@color/colorAccent</item><item name="android:windowDrawsSystemBarBackgrounds">false</item><item name="android:windowTranslucentStatus">true</item></style>

在values-v19中的styles.xml中设置如下:

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

而在values的styles.xml中则不设置任何属性。

2、在代码中设置界面,也需要区分不同的android版本

5.0以上并设置界面全屏,并设置状态栏背景颜色,在4.4的机器上,则设置FLAG_TRANSLUCENT_STATUS属性。
具体设置代码如下:

protected void setStatusBar() {if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {//5.0及以上View decorView = getWindow().getDecorView();int option = View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN| View.SYSTEM_UI_FLAG_LAYOUT_STABLE;decorView.setSystemUiVisibility(option);getWindow().setStatusBarColor(getResources().getColor(R.color.colorTheme));} else if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {//4.4到5.0WindowManager.LayoutParams localLayoutParams = getWindow().getAttributes();localLayoutParams.flags = (WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS | localLayoutParams.flags);}}

若要背景图也延伸到系统窗口,一般通过将状态栏设成透明色,这样就可以实现背景图延伸到状态栏。

下面对以上用到的一些属性进行归纳总结:

属性 注意事项 优缺点 失效情况 适用情况
windowTranslucentStatus 透明状态栏(Android 4.4系统效果为透明状态,5.0及其以后系统效果为半透明状态)在styles.xml(v19)中设置
windowTranslucentNavigation 透明导航栏(android4.4以上支持),在styles.xml(v19)中设置
windowDrawsSystemBarBackgrounds 使导航栏和状态栏可绘制(android5.0以上支持),即状态栏是否覆盖在ContentView上,在styles.xml(v21)中设置
android:statusBarColor 状态栏颜色
android:colorPrimary 标题栏背景颜色
android:colorPrimaryDark 状态栏透明层颜色
android:colorAccent 一般如floatingActionBar按钮的颜色,RadioButton/输入框聚焦/进度条等色值
android:textColorPrimary 标题栏文字色值
android:windowBackground 窗口背景色

对应在界面上效果是:

二、fitSystemWindows属性

android:fitsSystemWindows设置成true确保应用内容不会和系统窗口(状态栏和底下的虚拟导般栏)重叠。通过在 View 上设置和系统窗口一样高度的边框(padding )来确保应用内容不会出现到系统窗口下面。
注意事项:如果多个View设置了android:fitsSystemWindows=”true”,则只有初始的view起作用,都是从第一个设置了fitsSystemWindows的view开始计算paddin(即如果在布局中不是最外层控件设置fitsSystemWindows,那么设置的那个控件高度会多出一个状态栏高度);View 的其他 padding 值被重新改写了,在使用 fitsSystemWindows 为 true 的View 上设置 padding 值(paddingLeft/paddingTop/ 等)是没有效果。

优点:系统会自己计算好布局距状态栏的高度,使界面内容布局位于状态栏下方和导航栏上方。
缺点:若有背景图需要延伸到系统窗口(状态栏)时无法实现,需要借助如DrawerLayout,NavigationView,coordinatorlayout等控件,这些控件对dispatchApplyWindowInsets进行了处理。
如下图所示,如果没有借助上述的控件,则上面的图片无法延伸至状态栏。

三、使背景图片延伸至状态栏

如果我们可以不借助上述控件,但也希望上面的图片延伸到状态栏呢,我们可以将状态栏设置成透明状态,不使用fitSystemWindow属性,并将标题栏设置paddingTop状态栏的高度。

/**
* 获取状态栏高度
* @return
*/
private int getStatusBarHeight() {int result = 0;int resourceId = getResources().getIdentifier("status_bar_height", "dimen", "android");if (resourceId > 0) {result = getResources().getDimensionPixelSize(resourceId);}return result;
}//设置布局距离状态栏高度
public static void setLayoutPadding(Activity activity, DrawerLayout drawerLayout) {
ViewGroup contentLayout = (ViewGroup) drawerLayout.getChildAt(0);contentLayout.getChildAt(1).setPadding(contentLayout.getPaddingLeft(), getStatusBarHeight() + contentLayout.getPaddingTop(),contentLayout.getPaddingRight(), contentLayout.getPaddingBottom());}

优点:背景图可以延伸到状态栏
缺点:不同的android版本需要计算titlebar高度,稍微复杂一些
实现效果如下:

四、标题栏折叠实现

若要使上图2中的页面,向上滑动时,头图慢慢消失,当要显示现在的列表时,标题栏显示在最顶上,如下图效果,就需要结合CoordinatorLayout与CollapsingToolbarLayout结合使用。

具体实现布局如下:

 <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"android:id="@+id/main_content"android:layout_width="match_parent"android:layout_height="match_parent"android:fitsSystemWindows="true"><android.support.design.widget.AppBarLayoutandroid:id="@+id/appbar"android:layout_width="match_parent"android:layout_height="200dp"android:fitsSystemWindows="true"android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"><android.support.design.widget.CollapsingToolbarLayoutandroid:id="@+id/collapsing_toolbar"android:layout_width="match_parent"android:layout_height="match_parent"android:fitsSystemWindows="true"app:contentScrim="?attr/colorPrimary"app:expandedTitleMarginEnd="64dp"app:expandedTitleMarginStart="48dp"app:layout_scrollFlags="scroll|exitUntilCollapsed"><ImageViewandroid:id="@+id/logo"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@mipmap/header_img"android:contentDescription="@null"android:fitsSystemWindows="true"android:scaleType="fitCenter"app:layout_collapseMode="parallax"app:layout_collapseParallaxMultiplier="0.1" /><android.support.v7.widget.Toolbarandroid:id="@+id/toolbar"android:layout_width="match_parent"android:layout_height="?attr/actionBarSize"app:layout_collapseMode="pin"app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /></android.support.design.widget.CollapsingToolbarLayout></android.support.design.widget.AppBarLayout><android.support.v4.widget.NestedScrollViewandroid:id="@+id/nested_scroll_view"android:layout_width="match_parent"android:layout_height="match_parent"app:layout_behavior="@string/appbar_scrolling_view_behavior"><TextViewandroid:layout_width="match_parent"android:layout_height="wrap_content"android:text="@string/large_text" /></android.support.v4.widget.NestedScrollView><android.support.design.widget.FloatingActionButtonandroid:id="@+id/floating_action_button"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_margin="@dimen/fab_margin"android:clickable="true"android:src="@mipmap/ic_star_black_24dp"app:layout_anchor="@id/appbar"app:layout_anchorGravity="bottom|right|end" /></android.support.design.widget.CoordinatorLayout>

具体使用方法:CoordinatorLayout作为最外层容器,AppBarLayout作为第一个子view,还包含一个NestedScrollView作为一起滑动的控件,CollapsingToolbarLayout嵌套在AppBarLayout里,AppBarLayout里面又嵌套ImageView和Toolbar。

1、CoordinatorLayout

CoordinatorLayout是用来协调其子view们之间动作的一个父view。
类似于FrameLayout,根布局,能实现的效果:
1) 让浮动操作按钮上下滑动,为Snackbar留出空间。
2) 扩展或者缩小Toolbar或者头部,让主内容区域有更多的空间。
3) 控制哪个view应该扩展还是收缩,以及其显示大小比例,包括视差滚动效果动画。
我们在NestedScrollView中设置了behavior属性,
它主要用来给CoordinatorLayout的子view们实现交互的。

2、AppBarLayout

AppBarLayout是一种支持响应滚动手势的app bar布局(比如工具栏滚出或滚入屏幕);与AppBarLayout组合的滚动布局有(Recyclerview、NestedScrollView等),这需要相应的控件设置app:layout_behavior=”@string/appbar_scrolling_view_behavior”(上面代码中NestedScrollView控件所设置的)。没有设置的话,AppBarLayout将不会响应滚动布局的滚动事件。

3、CollapsingToolbarLayout

CollapsingToolbarLayout是专门用来实现子布局内不同元素响应滚动细节的布局。

在CollapsingToolbarLayout中,设置了以下以个参数:
1) //当完全CollapsingToolbarLayout折叠(收缩)后的背景颜色。
app:contentScrim=”?attr/colorPrimary”
2) //设置扩张时候(还没有收缩时)title距离左边的距离
app:expandedTitleMarginStart=”48dp”
3) //设置扩张时候(还没有收缩时)title距离右边的距离
app:expandedTitleMarginEnd=”64dp”
4)//scroll:设置该控件能滚动, exitUntilCollapsed: 向上滚动时收缩View,Toolbar一直固定在上面
app:layout_scrollFlags=”scroll|exitUntilCollapsed”

具体layout_scrollFlags还有其他三个设置:
1) enterAlways - 实现quick return效果, 当向下移动时,立即显示View(比如Toolbar)。
2) enterAlwaysCollapsed - 当你的View已经设置minHeight属性又使用此标志时,那么view将在到达这个最小高度的时候开始显示,并且从这个时候开始慢慢展开,当滚动到顶部的时候展开完。
3) snap:当一个滚动事件结束,如果视图是部分可见的,那么它将被滚动到收缩或展开。例如,如果视图只有底部25%显示,它将折叠。相反,如果它的底部75%可见,那么它将完全展开。

CollapsingToolbarLayout还可以进行一些其他设置:
1) app:contentScrim:设置折叠时标题栏布局的颜色,默认colorPrimary的色值
2) app:statusBarScrim:设置折叠时状态栏的颜色。默认colorPrimaryDark的色值。

4、Toolbar

这里设置了app:layout_collapseMode=”pin”
pp:layout_collapseMode有三种设置:
1) off:这个是默认属性,布局将正常显示,没有折叠的行为。
2) pin:CollapsingToolbarLayout折叠后,此布局将固定在顶部。
3) parallax:CollapsingToolbarLayout折叠时,此布局也会有视差折叠效果。
若设置了parallax模式时,还可以通过app:layout_collapseParallaxMultiplier设置视差滚动因子,值为:0~1。

5、NestedScrollView

这里设置了app:layout_behavior属性,
app:layout_behavior=”@string/appbar_scrolling_view_behavior”
behavior属性主要是设置了ScrollView与AppBarLayout的相互依赖关系,以非侵入的为View添加动态的依赖布局,和处理父布局(CoordinatorLayout)滑动手势。
具体原码如下:

/*** Behavior which should be used by {@link View}s which can scroll vertically and support* nested scrolling to automatically scroll any {@link AppBarLayout} siblings.*/public static class ScrollingViewBehavior extends HeaderScrollingViewBehavior {public ScrollingViewBehavior() {}public ScrollingViewBehavior(Context context, AttributeSet attrs) {}@Overridepublic boolean layoutDependsOn(CoordinatorLayout parent, View child, View dependency) {// We depend on any AppBarLayoutsreturn dependency instanceof AppBarLayout;}@Overridepublic boolean onDependentViewChanged(CoordinatorLayout parent, View child,View dependency) {offsetChildAsNeeded(parent, child, dependency);return false;}@Overridepublic boolean onRequestChildRectangleOnScreen(CoordinatorLayout parent, View child,Rect rectangle, boolean immediate) {}private void offsetChildAsNeeded(CoordinatorLayout parent, View child, View dependency) {}@Overridefloat getOverlapRatioForOffset(final View header) {}private static int getAppBarLayoutOffset(AppBarLayout abl) {}@OverrideAppBarLayout findFirstDependency(List<View> views) {}@Overrideint getScrollRange(View v) {}}

下面给出一个实现沉浸式状态栏的demo,欢迎star
https://github.com/xiewenfeng/CollapseToolBar

android沉浸式状态栏、fitsSystemWindows、标题栏折叠相关推荐

  1. Android底部菜单栏、Android沉浸式状态栏(顶部状态栏修改颜色)、自定义标题栏

    0.简介: 没有使用TabHost切换,而是变成FragmentActivity替换Fragment:沉浸式引用的git上面的jar包. 先看图片 1.底部导航栏 核心代码 <span styl ...

  2. 高大上的Android沉浸式状态栏?

    背景 之前做过Android沉浸式状态栏的相关需求,但是一直忙于工作,没时间系统的整理下沉浸式相关的知识,所以今天抽出时间,写一篇 Android沉浸式状态栏的文章. 何为沉浸式 沉浸式就是要给用户提 ...

  3. android 沉浸式开源库,Android沉浸式状态栏

    关于Android沉浸式状态栏, 网上已经有很多开源库, 虽然开源库可以解决某些特定布局下的沉浸式状态栏问题, 但是遇到比较特殊的布局就无法解决了, 所以了解一下沉浸式状态栏如何实现是有必要的. 无论 ...

  4. android 沉浸式状态栏 19,Android 沉浸式状态栏 以及 伪沉浸式状态栏

    小菜最近在调整页面状态栏的效果,主要包括沉浸式状态栏和伪沉浸状态栏(同事唠嗑给定义的玩的). 前段时间整理过一篇 Android 沉浸式状态栏的多种样式,现在小菜在稍微的补充一下,都是在日常应用中测试 ...

  5. Android沉浸式状态栏(透明状态栏)最佳实现

    Android沉浸式状态栏(透明状态栏)最佳实现 在Android4.4之前,我们的应用没法改变手机的状态栏颜色,当我们打开应用时,会出现上图中左侧的画面,在屏幕的顶部有一条黑色的状态栏,和应用的风格 ...

  6. Android沉浸式状态栏,看完这篇就够了!

    背景 之前做过Android沉浸式状态栏的相关需求,但是一直忙于工作,没时间系统的整理下沉浸式相关的知识,所以今天抽出时间,写一篇 Android沉浸式状态栏的文章. 何为沉浸式 沉浸式就是要给用户提 ...

  7. Android沉浸式状态栏(透明系统状态栏)

    Android沉浸式状态栏(透明系统状态栏)的目的:顶部系统状态栏和App的导航栏一体化,不给用户突兀的感觉,使用户把更多的视角留在我们的App上. 沉浸式状态栏的兼容情况 Android版本 透明状 ...

  8. android沉浸式 字体,Android沉浸式状态栏背景色以及字体颜色的修改

    在activity中设置透明状态栏 的思路: 1.让activity的布局全屏 此时布局会和状态栏重叠 2.让布局最上方预留出和状态栏高度一样的高度,将状态栏的背景色设置为透明 效果如下: 一般是在s ...

  9. 使用主题Theme实现Android沉浸式状态栏

    使用主题Theme实现Android沉浸式状态栏 很早的时候,通过主题设置activity沉浸式,发现坑很多,就开始使用各种StatusBarUtils,放弃了主题修改沉浸式这种方式,不知道大家有没有 ...

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

    以前写过一个沉浸式状态栏 的实现方式 Android 沉浸式状态栏 实现方式一 现在有个更为简单的实现方式 . 相关链接 http://www.apkbus.com/forum.php?mod=vie ...

最新文章

  1. 无人驾驶汽车系统入门:基于深度学习的实时激光雷达点云目标检测及ROS实现...
  2. ASP.NET MVC4中@model使用多个类型实例的方法
  3. 13岁女孩因发布JavaScript无限循环代码被捕
  4. iOS旋钮动画-CircleKnob
  5. 【Idea无法打开】Idea.bat可以正常打开,双击快捷方式无法打开解决办法
  6. Blockchain:《Blockchain applications in insurance》Deloitte—德勤区块链技术研究报告正文版—听课记录
  7. 什么是javax.ws.rs.core.context? [第3部分]
  8. CM3计算板I/O编程
  9. AT指令集及S寄存器
  10. servlet的doPost 和doGet和web文件结构
  11. lambda表达式for_each,find_if简介
  12. E20170414-ms
  13. [原创]Linux实现服务延迟启动
  14. IOS使用Charts
  15. 在电脑上怎么做报表新手_自己怎样在电脑上制作表格
  16. AVCaptureDevice中通过调用VideoZoomFactor方法调整焦距实现拉近拉远镜头进行拍照录制视频(动画缩放画面,不闪屏)
  17. 罗克韦尔AB PLC RSLogix5000中的位指令使用方法介绍
  18. 4 个分析 GameFi 项目的工具
  19. mac下快速安装php的各个版本
  20. 人脸识别技术在COVID-19抗疫中的应用:发热病人的筛查及密切接触者追踪

热门文章

  1. 我就是那个错过了乔布斯的变态老码农
  2. python 加权随机算法_python的random模块及加权随机算法的python实现方法
  3. npm引入小程序官方WeUI组件库weui-miniprogram
  4. 二叉树的先序创建、前中后序遍历(递归)C++
  5. 面对流量型DDOS攻击不知所措?这几种DDOS防护手段你需要知道
  6. 有关数据的“那些事儿”,百度云发声啦!
  7. model.generate返回句子大于1时出现<unk>的情况处理
  8. 敲击键盘后字符怎么出现在显示器
  9. Java习题练习:幸运数
  10. 什么是基本的逻辑运算?