详解Android通知栏沉浸式/透明化完整解决方案
google在android 4.4版本加入了半透明的界面样式,在android 5.0的时候推出了material design的概念。
这些样式的加入使得原本死板、丑陋、和app颜色不一致的通知栏变得更亲和、顺眼、用户体验更友好。
作者是常年做对日项目的,对日项目以界面简洁功能强大而著称。最近客户要求ui方面做一些改变,让app看上去给用户感觉更友好。所以就提到了android 4.4以后的通知栏问题。
网上关于通知栏的文章铺天盖地,什么沉浸式,什么半透明。。。挺会拽词。也不乏有android大神也写过类似的文章,但是那文章能看?长篇大论,程序员够累了,哪有那些时间看你在那里车轱辘话满天飞,说了一大顿表达不明白,浪费时间,写的一堆垃圾文章。
本篇文章杜绝冗余,做到最简单,最实用,对日项目比的不是代码量,而是最少的代码写出最漂亮的程序。
先上gif图,android 4.4 和 android 6.0 实现样式效果之后的对比图
android 4.4
android 6.0
实现样式效果我们有两种方案
①drawerlayout+toolbar
②actionbar
下面我们就来一一实现
①drawerlayout+toolbar
添加依赖库(谷歌提供)
compile 'com.android.support:design:25.3.1'
布局代码1:使用 drawerlayout做最外层,引入navigationview侧边抽屉控件
<?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.drawerlayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/id_drawerlayout" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.tnnowu.android.demo17032801.mainactivity"> <include layout="@layout/content_layout" /> <android.support.design.widget.navigationview android:id="@+id/id_navigationview" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="left" app:itemtextcolor="@color/c_light_gray3" /> </android.support.v4.widget.drawerlayout>
布局代码2:里层嵌套toolbar
<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <android.support.v7.widget.toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#30469b" android:paddingtop="@dimen/toolbar_padding_top" app:popuptheme="@style/themeoverlay.appcompat.light" app:theme="@style/themeoverlay.appcompat.dark.actionbar"> <textview android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="toolbar版" android:textsize="20sp" /> </android.support.v7.widget.toolbar> <!--内容显示布局--> <relativelayout android:layout_width="match_parent" android:layout_height="match_parent"> <button android:id="@+id/gotoactionbar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerinparent="true" android:text="切换到actionbar版" /> </relativelayout> </linearlayout>
style样式:无actionbar
<style name="appthemenoactionbar" parent="theme.appcompat.light.noactionbar"> <!-- customize your theme here. --> <item name="colorprimary">@color/colorprimary</item> <item name="colorprimarydark">@color/colorprimarydark</item> <item name="coloraccent">@color/coloraccent</item> </style>
主程序代码:除了要在oncreate()里面初始化 drawerlayout、navigationview、toolbar控件 即initviews(),还要在oncreate()里面添加手机系统版本判断和相应的样式适配initimmersive()
private void initviews() { mdrawerlayout = (drawerlayout) findviewbyid(r.id.id_drawerlayout); mnagigationview = (navigationview) findviewbyid(r.id.id_navigationview); mnagigationview.inflateheaderview(r.layout.header_nav); mnagigationview.inflatemenu(r.menu.menu_nav); mtoolbar = (toolbar) findviewbyid(r.id.toolbar); mbtn = (button) findviewbyid(r.id.gotoactionbar); mtoolbar.settitle(""); if (mtoolbar != null) { setsupportactionbar(mtoolbar); } actionbardrawertoggle mactionbardrawertoggle = new actionbardrawertoggle(this, mdrawerlayout, mtoolbar, r.string.open, r.string.close); mactionbardrawertoggle.syncstate(); mdrawerlayout.setdrawerlistener(mactionbardrawertoggle); mbtn.setonclicklistener(new view.onclicklistener() { @override public void onclick(view v) { startactivity(new intent(mainactivity.this, demoactionbaractivity.class)); } }); } private void initimmersive() { if (build.version.sdk_int >= build.version_codes.kitkat) { windowmanager.layoutparams locallayoutparams = getwindow().getattributes(); locallayoutparams.flags = (windowmanager.layoutparams.flag_translucent_status | locallayoutparams.flags); if (build.version.sdk_int < build.version_codes.lollipop) { //将侧边栏顶部延伸至status bar mdrawerlayout.setfitssystemwindows(true); //将主页面顶部延伸至status bar;虽默认为false,但经测试,drawerlayout需显示设置 mdrawerlayout.setcliptopadding(false); } } }
这样drawlayout + toolbar就实现了样式改变。
②actionbar
布局代码
<?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="@color/colorprimary" android:fitssystemwindows="true" android:orientation="vertical"> <!--内容显示布局--> <relativelayout android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/c_light_white"> <button android:id="@+id/goback" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerinparent="true" android:text="返回到toolbar版" /> </relativelayout> </linearlayout>
style样式:有actionbar
<style name="appthemeactionbar" parent="theme.appcompat.light.darkactionbar"> <!-- customize your theme here. --> <item name="colorprimary">@color/colorprimary</item> <item name="colorprimarydark">@color/colorprimarydark</item> <item name="coloraccent">@color/coloraccent</item> </style>
主程序代码:
public class demoactionbaractivity extends appcompatactivity { private button mbtn; @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_main_actionbar); if (build.version.sdk_int >= build.version_codes.kitkat) { windowmanager.layoutparams locallayoutparams = getwindow().getattributes(); locallayoutparams.flags = (windowmanager.layoutparams.flag_translucent_status | locallayoutparams.flags); } initview(); } private void initview() { mbtn = (button) findviewbyid(r.id.goback); mbtn.setonclicklistener(new view.onclicklistener() { @override public void onclick(view v) { finish(); } }); } }
这样actionbar就实现了样式改变。
文章对应的项目地址:immersivedemo_jb51.rar
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。