android状态栏随着滑动变化,Android实现沉迷式状态栏及标题栏滑动变色

Android实现沉迷式状态栏及标题栏滑动变色

效果图

1. 沉迷式状态栏的实现沉迷式状态栏实现的方式有很多，可自行百度谷歌

此处沉迷式状态栏实现采用第三方开源库 ImmersionBar,集成方式可直接查看官方文档，这里只做演示

1.1 导入包implementation 'com.gyf.immersionbar:immersionbar:2.3.2-beta01'

1.2 初始化//这里需要注意初始化必需要在setContentView(view)之后执行//处理状态栏与布局顶部重叠，官方文档提供六种方案//ImmersionBar.with(this).titleBar(mToolBar).init() ImmersionBar.with(this).init()

1.3 关闭销毁override fun onDestroy() { super.onDestroy() ImmersionBar.with(this).destroy()}

到这，沉迷式状态栏的简单集成就实现了，当然根据布局复杂程度会有各种各样的问题，比方侧滑菜单，Fragment等中沉迷式状态栏的实现，详细可先查看文档

2. 标题栏随着滑动透明度(颜色)变化，目标效果如网易云音乐介绍页

思路：标题栏后面增加一个ImageView作为标题栏的背景图片，标题栏为透明，考虑到背景图片为头部图片的底部截取，可将大小设置与头部图片一样，而后将其上移至标题栏部分；随着滑动的变化，将背景图片的透明度进行设置

布局示用意.png

toolbar背景图.png

2.1 布局文件如下<?xml version="1.0" encoding="utf-8"?>

2.2 设置状态栏透明ImmersionBar.with(this).titleBar(mToolBar).init()override fun onDestroy() { super.onDestroy() ImmersionBar.with(this).destroy()}

2.3 将标题图片上移至状态栏+标题栏高度的底部部位//将标题图片上移至状态栏+标题栏高度的底部部位val params = mIvBarView.getLayoutParams()//状态栏+标题栏的高度var topHeight = mToolBar.layoutParams.height + getStatusHeight()val ivTitleHeadBgParams = mIvBarView.getLayoutParams() as ViewGroup.MarginLayoutParamsval marginTop = params.height - topHeightivTitleHeadBgParams.setMargins(0, -marginTop, 0, 0)

2.4 设置滑动监听，控制背景图片的透明度//监听滑动状态设置透明度mScrollView.setOnScrollChangeListener { v, scrollX, scrollY, oldScrollX, oldScrollY -> var headHight = mIvHeadView.layoutParams.height var flagHight = headHight - topHeight var alpha = 0f var scrolledY = if (scrollY < 0) 0 else scrollY if (flagHight > 0) { if (scrolledY < flagHight) { alpha = scrolledY.toFloat() / flagHight } else { alpha = 1f } } mIvBarView.alpha = alpha}

参考资料Android - 仿网易云音乐歌单介绍页

源码地址Android实现沉迷式状态栏及标题栏滑动变色(Kotlin)