Android 沉浸式状态栏的多种样式
小菜最近正在处理客户端顶部沉浸式展示图片,借此整理了一下小菜自己研究测试的沉浸式状态栏。
沉浸式状态栏大家都很熟悉,即 APP 界面图片延伸到状态栏, 应用本身沉浸于状态栏,即顶部不会默认展示系统的黑条。因为小菜技术有限,理解不透彻,所以仅分享一下自己应用测试中可以呈现的几种样式。
公共的步骤:
- 布局文件中添加使用 Toolbar 控件(纯色 Toolbar 背景色为颜色,图片 Toolbar 样式设置背景色为图片或添加一个 ImageView 控件),在文件根布局与 Toolbar 中添加 android:fitsSystemWindows="true",这个很重要,可以使背景图片延伸至状态栏,当然在 Java 文件中设置一样的效果;
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@android:color/white" android:fitsSystemWindows="true" android:orientation="vertical"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/colorAccent" android:fitsSystemWindows="true"> </android.support.v7.widget.Toolbar> </LinearLayout>
- 设置主题样式,一般是三个 style.xml 文件,分别是 values (默认)、 values-v19 (处理 Android4.4 版本) 和 values-v21 (处理 Android5.0以后的半透明);
values style.xml <style name="ToorbarTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="android:windowNoTitle">true</item> <item name="android:windowFullscreen">false</item> <item name="windowActionBar">false</item> <item name="windowNoTitle">true</item> <item name="android:windowIsTranslucent">true</item> <item name="android:windowActionBar">false</item> </style>
values-v19 style.xml <style name="ToorbarTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="android:windowNoTitle">true</item> <item name="android:windowFullscreen">false</item> <item name="android:windowTranslucentStatus">false</item> <item name="android:windowTranslucentNavigation">true</item> <item name="windowActionBar">false</item> <item name="windowNoTitle">true</item> <item name="android:windowIsTranslucent">true</item> </style>
values-v21 style.xml <style name="ToorbarTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="android:windowNoTitle">true</item> <item name="android:windowFullscreen">false</item> <item name="windowActionBar">false</item> <item name="windowNoTitle">true</item> <item name="android:windowIsTranslucent">true</item> <item name="android:windowActionBar">false</item> </style>
- Java 代码中处理导航栏变黑和透明的主题版本判断;
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { val window = window window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS) window.statusBarColor = resources.getColor(R.color.colorAccent) window.decorView.systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN }
纯色 Toolbar 样式
纯色 Toolbar 在使用中一般会将顶部状态栏设置与 Toolbar 背景色一致;
val window = window window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS) window.statusBarColor = resources.getColor(R.color.colorAccent)
在测试过程中会出现底部虚拟操作按纽栏目被遮挡,如下图,此时应注意设置 systemUiVisibility 属性。
window.decorView.systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
无状态栏 Toolbar 样式(一般不会应用)
无状态栏 Toolbar 样式一般不会在日常中使用,但是测试的过程中发现,分享给大家,其根本原因是主题中
<item name="android:windowFullscreen">true</item>
,其他处理上面完全相同。 <style name="ToorbarNoBarTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="android:windowBackground">@null</item> <item name="android:windowNoTitle">true</item> <item name="android:windowFullscreen">true</item> <item name="windowActionBar">false</item> <item name="windowNoTitle">true</item> </style>
图片 Toolbar 样式
图片 Toolbar 样式,一般分两种:一种是设置 Toolbar 背景图 background;另一种是添加一个 ImageView 控件。小菜用的是作为 Toolbar 背景图 background 方式处理,使用 ImageView 控件时还需要单独处理图片,并有部分拉伸的可能。
图片作为布局背景沉浸样式
- 图片作为布局背景的方式比较简单,方式与公共的相同,只是不需要 Toolbar 而已。
- 测试发现,若将根布局的高设为
android:layout_height="wrap_content"
时图片正常展示,如果为android:layout_height="match_parent"
则图片会被拉伸,当然小菜认为根布局设置为 wrap_content 方式是不合理的。 - 小菜的解决方法是使用 layer-list 的 drawable,类似于启动页初始加载时的样式。
<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@color/colorPrimary"></item> <item android:top="26dp"> <bitmap android:gravity="top|center_horizontal" android:src="@mipmap/icon_bg" /> </item> </layer-list>
Tips1:还有一种样式与沉浸式展示效果一样,就是折叠布局 CollapsingToolbarLayout 折叠后的效果也是沉浸式状态,可以固定折叠后的状态,但是并不建议这样处理,只是偶然想到而已,各位有兴趣可以研究一下。
Tips2:使用 Toolbar 时,建议不要再多添加一层布局 Layout,需要的话可以用 CoordinatorLayout。
<!-- 不建议用: --> <LinearLayout android:id="@+id/user_header_new_login_lay" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:orientation="vertical"> <android.support.v7.widget.Toolbar android:layout_width="match_parent" android:id="@+id/test_tb" android:fitsSystemWindows="true" android:layout_height="100dp"> </android.support.v7.widget.Toolbar> </LinearLayout> <!-- 建议使用: --> <android.support.design.widget.CoordinatorLayout android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true"> <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:fitsSystemWindows="true" app:elevation="0dp"> <android.support.v7.widget.Toolbar android:layout_width="match_parent" android:id="@+id/test_tb" android:fitsSystemWindows="true" android:layout_height="100dp"> </android.support.v7.widget.Toolbar> </android.support.design.widget.AppBarLayout> </android.support.design.widget.CoordinatorLayout>
下面的是小菜我的公众号,欢迎闲来吐槽哦~
低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。
持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。
转载内容版权归作者及来源网站所有,本站原创内容转载请注明来源。
- 上一篇
Android两条并排RecyclerView实时联动滑动增强
Android两条并排RecyclerView实时联动滑动增强 在附录1中,我初步实现了两条垂直摆放的RecyclerView的实时联动滚动,但是附录文章1的实现存在一定问题,比如当用户的手指同时在屏幕的两条RecyclerView区域内滑动,将发生异常。还有就是,比如在RecyclerView1正在滚动时候,用户又在RecyclerView2的区域内手指滑动,这样将触发循环嵌套滚动事件,引发错误,因此本文在附录1的基础上改进,通过拦截处理系统的触摸事件解决造成RecyclerView滚动引发的问题。 代码: package zhangphil.test; import android.graphics.Color; import android.os.Bundle; import android.support.annotation.NonNull; import android.support.annotation.Nullable; import android.support.v7.app.AppCompatActivity; import android.support.v7...
- 下一篇
03.app保活解决方案
最近针对我们项目中app经常收不到推送的问题作了一些处理,增加app的保活管理。我们知道当安卓进程退到后台之后,很容易被系统杀死,这个时候推送消息一般都是收不到的。我也观察了一些比较主流的app,像同花顺,钉钉,甚至是支付宝我都很少在后台收到过消息,尤其是支付宝计步功能老是不准,很有可能就是这种问题导致的 当然没有百分之百可以实现保活的解决方案,即便是从ndk层面去进行,但至少我们要尽一些努力,我采用的是双进程守护+1像素Activity的实现方式 双进程守护: 开启两个service,分别在两个进程中运行,启动一个service时,通过aidl的方式将它和另一个service绑定在一起,当其中一个service被杀掉的时候,另一个service中重新将它启动 service1启动绑定service2 @Override public int onStartCommand(Intent intent, int flags, int startId) { //提高进程优先级 startForeground(GuardServiceId2,new Notification()); //绑定...
相关文章
文章评论
共有0条评论来说两句吧...
文章二维码
点击排行
-
Docker使用Oracle官方镜像安装(12C,18C,19C)
- Springboot2将连接池hikari替换为druid,体验最强大的数据库连接池
- CentOS8编译安装MySQL8.0.19
- Docker快速安装Oracle11G,搭建oracle11g学习环境
- SpringBoot2配置默认Tomcat设置,开启更多高级功能
- MySQL8.0.19开启GTID主从同步CentOS8
- CentOS7,8上快速安装Gitea,搭建Git服务器
- Jdk安装(Linux,MacOS,Windows),包含三大操作系统的最全安装
- SpringBoot2编写第一个Controller,响应你的http请求并返回结果
推荐阅读
最新文章
- Springboot2将连接池hikari替换为druid,体验最强大的数据库连接池
- CentOS8,CentOS7,CentOS6编译安装Redis5.0.7
- MySQL8.0.19开启GTID主从同步CentOS8
- Docker快速安装Oracle11G,搭建oracle11g学习环境
- SpringBoot2整合Redis,开启缓存,提高访问速度
- Windows10,CentOS7,CentOS8安装Nodejs环境
- CentOS7编译安装Cmake3.16.3,解决mysql等软件编译问题
- SpringBoot2编写第一个Controller,响应你的http请求并返回结果
- SpringBoot2更换Tomcat为Jetty,小型站点的福音
- CentOS7设置SWAP分区,小内存服务器的救世主