怎样将DrawerLayout显示在ActionBar/Toolbar和status bar之间
注意:下面效果实现方法仅仅在Android Lollipop下完毕,并如果你使用Theme.AppCompat.NoActionBar或者是Theme.AppCompat.Light.NoActionBar主题
Material Design有个非常酷炫的效果,就是DrawerLayout
隐藏的那一部分在拉开的时候,本应该被ActionBar
和status
bar挡住的那部分,如今能够露出来了。
这样的效果已有人给出效果的实现方法了,可是对于非常多人来说还是不知道它是怎样实现的,所以这个这里先讲讲原理:
在新的框架和支持包下,我们可以实现下面功能:首先使用Toolbar
来取代ActionBar
,这样我们就行把ActionBar
嵌入到我们的View体系中。然后我们"禁用"系统的status
bar,由DrawerLayout
来处理status bar,最后抽屉部分往上移,或者裁剪掉status
bar那一部分。
控制status bar
在你的values-v21里面加入新的主题,并设置一下属性:
values-v21/themes.xml
<style name="AppTheme">
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">@android:color/transparent</item>
</style>
这里解释一下:
windowDrawsSystemBarBackgrounds
,将它设置为true,系统将在你的window里面绘制status
bar。默觉得TRUE。之所以要写出来是由于你的theme有可能是继承过来的,确保为true。(在这里小插曲一下,因调试时。总以为凝视了这段代码就以为是false。程序猿思维害苦了我。另外从命名来看。Android把它称为system bar,可能是为了与能被我们处理的status bar区分开而做的改变。
)
statusBarColor
设置为透明是由于我们不再须要系统的status bar,由于我们无法控制它的位置,后面我们将交由DrawerLayout
来处理。
使用DrawerLayout
首先,你的布局文件应该是和这个类似的:
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/my_drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"> <!-- Your normal content view -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"> <!-- We use a Toolbar so that our drawer can be displayed
in front of the action bar -->
<android.support.v7.widget.Toolbar
android:id="@+id/my_awesome_toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary" /> <!-- The rest of your content view --> </LinearLayout> <!-- The navigation drawer -->
<ScrimInsetsFrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="304dp"
android:layout_height="match_parent"
android:layout_gravity="left"
android:background="@android:color/white"
android:elevation="10dp"
android:fitsSystemWindows="true"
app:insetForeground="#4000"> <!-- Your drawer content --> </ScrimInsetsFrameLayout> </android.support.v4.widget.DrawerLayout>
在这里布局里面我们用到了一个的开源类ScrimInsetsFrameLayout,它的主要作用就是利用fitsSystemWindows
的回调方法fitSystemWindows(Rect
来获取status bar的大小,然后调整画布以达到去掉status bar的效果。所以我们须要在
insets)ScrimInsetsFrameLayout
下设置fitsSystemWindows
为true。当然你也能够不使用这个类,而改用layout_marginTop
属性来达到效果。
insetForeground
这个属性是ScrimInsetsFrameLayout
自带的,表示插入区域的前景色,我们设置为带透明的黑色#4000。别忘了使用这个属性须要加入例如以下代码到attrs.xml里:
values/attrs.xml
<declare-styleable name="ScrimInsetsView">
<attr name="insetForeground" format="reference|color" />
</declare-styleable>
自此,我们已经实现了将DrawerLayout
抽屉的那一部分显示在Toolbar
和system
bar(为了和以下的status bar区分,我们称为system bar)之间了,但是system bar的颜色被我们设置了透明,所以我们接下来要改变status bar的颜色。
改变status bar的颜色
你可能已经注意到刚才的布局里面DrawerLayout
的fitsSystemWindows
属性设置了为true,这是由于我们要在代码里面使用了DrawerLayout
设置status
bar颜色的方法:
// 在这里我们获取了主题暗色,并设置了status bar的颜色
TypedValue typedValue = new TypedValue();
getTheme().resolveAttribute(R.attr.colorPrimaryDark, typedValue, true);
int color = typedValue.data; // 注意setStatusBarBackgroundColor方法须要你将fitsSystemWindows设置为true才会生效
DrawerLayout drawerLayout = (DrawerLayout) findViewById(R.id.my_drawer_layout);
drawerLayout.setStatusBarBackgroundColor(color);
有关获取attr属性值的方法。能够看我另外一篇文章。点这里。
使用Toolbar来取代ActionBar
在代码里面这样设置:
Toolbar toolbar = (Toolbar) findViewById(R.id.my_awesome_toolbar);
setSupportActionBar(toolbar);
最后
赶紧看看你出来的效果是不是和上面的一样?为了实现这一点效果并理解它,真要认真琢磨一下,最后感谢你的阅读到这里。
怎样将DrawerLayout显示在ActionBar/Toolbar和status bar之间的更多相关文章
- 解决ActionBar中的item不显示在ActionBar的问题
今天在用ActionBar,需要增加一个菜单选项,按教程在/res/menu下对应的布局文件中添加了一个item,但是它却是显示在overflow中,而不是直接显示在ActionBar当中的.我的布局 ...
- 在RecyclerView列表滚动的时候显示或者隐藏Toolbar
先看一下效果: 本文将讲解如何实现类似于Google+应用中,当列表滚动的时候,ToolBar(以及悬浮操作按钮)的显示与隐藏(向下滚动隐藏,向上滚动显示),这种效果在Material Design ...
- WPF 4 开发Windows 7 任务栏(Overlay Icon、Thumbnail Toolbar、Progress Bar)
原文:WPF 4 开发Windows 7 任务栏(Overlay Icon.Thumbnail Toolbar.Progress Bar) 在上一篇我们介绍了如何在WPF 4 中开发Wind ...
- Android下拉上滑显示与隐藏Toolbar另一种实现
public abstract class RecyclerViewScrollListener extends RecyclerView.OnScrollListener { private sta ...
- colorAccent、colorPrimary、colorPrimaryDark actionbar toolbar navigationbar
伴随着Android5.0的发布也更新了support-v7-appcompat 到V21,其中增加了ToolBar.recyclerview.cardview等控件. Android5.0对改变AP ...
- Android colorAccent、colorPrimary、colorPrimaryDark actionbar toolbar navigationbar
伴随着Android5.0的发布也更新了support-v7-appcompat 到V21,其中增加了ToolBar.recyclerview.cardview等控件. Android5.0对改变AP ...
- Android UI ActionBar功能-自定义 Action Bar 样式
ActionBar的样式官方提供了三种: Theme.Holo Theme.Holo.Light Theme.Holo.Light.DarkActionBar 但不仅仅是这三种,我们还可以自己定义Ac ...
- vim——打开多个文件、同时显示多个文件、在文件之间切换
打开多个文件: 1.vim还没有启动的时候: 在终端里输入 vim file1 file2 ... filen便可以打开所有想要打开的文件 2.vim已经启动 输入 :open file 可以再打开 ...
- Android UI ActionBar功能-在 Action Bar 上添加按钮
在ActionBar上添加按钮实现某些功能最常见的Application的功能如:在ActionBar上添加一个搜索按钮: 首先官方文档说明:http://wear.techbrood.com/tra ...
随机推荐
- Linux 内核框架图
- 【spring】jar包详解与模块依赖关系
以spring3.X为例 jar包详解 1. spring-core.jar:包含Spring框架基本的核心工具类,Spring其它组件要都要使用到这个包里的类,是其它组件的基本核心: 2. spri ...
- Linux学习笔记(一) 文件系统
对于每一个 Linux 学习者来说,了解 Linux 文件系统的结构是十分有必要的 因为在 Linux 中一切皆文件,可以说只有深入了解 Linux 的文件系统,才会对 Linux 有更深刻的理解 L ...
- 【转】C语言中access函数
头文件:unistd.h 功 能: 确定文件或文件夹的访问权限.即,检查某个文件的存取方式,比如说是只读方式.只写方式等.如果指定的存取方式有效,则函数返回0,否则函数返回-1. 用 法: int a ...
- mysql You can't specify target table 'sys_org_relation' for update in FROM clause 删除表条件不能直接包含该表
mysql中You can't specify target table for update in FROM clause错误的意思是说,不能先select出同一表中的某些值,再update这个表( ...
- c++基础_矩阵乘法
#include <iostream> using namespace std; int main(){ int a,b; cin>>a>>b; long c[a] ...
- Python之文件处理-批量修改md文档内容
目录 Python之文件处理-批量修改md文档内容 Python之文件处理-批量修改md文档内容 #!/usr/bin/env python # -*- coding:utf-8 -*- import ...
- Python Pandas库的学习(三)
今天我们来继续讲解Python中的Pandas库的基本用法 那么我们如何使用pandas对数据进行排序操作呢? food.sort_values("Sodium_(mg)",inp ...
- Python基础知识点总结
Python基础知识与常用数据类型 一.Python概述: 1.1.Python的特点: 1.Python是一门面向对象的语言,在Python中一切皆对象 2.Python是一门解释性语言 3.Pyt ...
- angular(转)
学习之前可以看看 知乎上讨论angularjs优缺点 帮你选择框架的网站 同类主流框架对比 教程 angularjs在慕课网 angularjs在51cto angularjs在图灵社区 社区 Ang ...