1.Toolbar
新建一个项目,默认都会显示ActionBar,是根据项目中AndroidManifest中指定的主题来显示的。
<!-- Base application theme. -->
<style name="AppTheme" 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>
指定不带ActionBar的主题有两种,Theme.AppCompat.NoActionBar 和 Theme.AppCompat.Light.NoActionBar。前者为深色主题,会将界面的主体颜色设为深色,陪衬颜色设为淡色,后者为淡色主题,会将界面的主体颜色设为淡色,陪衬颜色设为深色。
定义Toolbar:
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary">
获取实例:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
还可以通过添加action按钮来丰富Toolbar的内容,添加的逻辑和Actionbar添加menu相同。
在<Item>中通过app:showAsAction来指定按钮的显示位置,showAsAction主要有以下几种值可选:always表示永远显示在Toolbar中,如果屏幕空间不够则不显示;ifRoom表示屏幕空间足够的情况下显示在Toolbar中,不够的话就显示在popupWindow中;never表示永远显示在popupWindow中。
Toolbar的action按钮只会显示图标,popupWindow的action按钮只会显示文字。
2.DrawerLayout
DrawLayout是一个布局,布局中允许放入两个直接子控件,第一个子控件是主屏幕中显示的内容,第二个子控件是滑动菜单中显示的内容。
layout_gravity指定滑动菜单在屏幕的左边还是右边,指定为start,表示会根据系统语言进行判断,如果系统语言是从左往右,如英语、汉语,滑动菜单就在左边,如果系统语言是从右到左,比如阿拉伯语,滑动菜单就在右边。
通过setDisplayHomeAsUpEnabled()方法来让导航按钮显示出来,通过setHomeAsUpIndicator()方法来设置一个导航按钮图标。在onOptionsItemSelected()方法中对HomeAsUp按钮的点击事件进行处理,id永远是android.R.id.home。
3.NavigationView
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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
...
<android.support.design.widget.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="@layout/nav_header_nav"
app:menu="@menu/activity_nav_drawer" />
</android.support.v4.widget.DrawerLayout>
menu 是在NavigationView中显示具体的菜单项的,headerLayout则是用来在NavigationView中显示头部布局的。
调用setNavigationItemSelectedListener()方法来设置菜单项选中事件的Listener。
4.FloatingActionButton
FloatingActionButton不属于主界面的一部分,而是位于另外一个维度。
5.Snackbar
Snackbar允许在提示中加入一个可交互按钮,当用户点击按钮的时候可以执行一些额外的逻辑操作。
6.CoordinatorLayout
CoordinatorLayout是一个加强版的FrameLayout,可以监听其所有子控件的各种事件,然后自动帮我们做出最为合理的响应。比如Snackbar提示将FloatingActionButton遮挡住了,CoordinatorLayout会监听到Snackbar的弹出事件,自动将内部的FloatingActionButton向上偏移。
7.CardView
CardView也是一个FrameLayout,只是额外提供了圆角和阴影等效果。
8.AppBarLayout
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.liaowh.myapplication.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="@style/AppTheme.PopupOverlay"
app:layout_scrollFlags="scroll|enterAlways|snap"/>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
</android.support.v7.widget.RecyclerView>
</android.support.design.widget.CoordinatorLayout>
AppBarLayout必须是CoordinatorLayout的子布局
1.将Toolbar嵌套到AppBarLayout中
2.给RecyclerView指定一个布局行为,这样才能将RecyclerView置于Toolbar下方
RecyclerView滚动的时候将滚动事件都通知给了AppBarLayout,当AppBarLayout接收到滚动事件的时候,它内部的子控件是可以指定如何去相应这些时间的,通过app:layout_scrollFlags属性就能实现。scroll表示当RecyclerVIew向上滚动的时候,Toolbar会跟着向上滚动并实现隐藏;enterAways表示当RecyclerView向下滚动的时候,Toolbar会跟着向下滚动并重新显示; snap表示当Toolbar还没有完全隐藏或者显示的时候,会根据当前滑动的距离,自动选择隐藏还是显示。
SwipeRefreshLayout
在RecyclerView的外面嵌套一层SwipRefreshLayout,RecyclerView就有了下拉刷新功能。通过setOnRefreshListener()方法监听。
CollapsingToolbarLayout
CollapsingToolbarLayout是一个作用于Toolbar基础上的布局,可以让Toolbar的效果变得更加丰富。
CollapsingToolbarLayout限定只能作为AppBarLayout的直接子布局来使用,而AppBarLayout又必须是CoordinatorLayout的子布局。
android:theme指定一个ThemeOverlay.AppCompat.Dark.ActionBar的主题,要实现更加高级的Toolbar效果,需要将这个主题指定提到上一层来。
app:contentScirm属性用于指定CollapsingToolbarLayout在趋于折叠状态以及折叠之后的背景色,即折叠后的Toolbar的背景色。
exitUntilCollapsed表示当CollapsingToolbarLayout随着滚动完成折叠之后就保留在界面上,不再移出屏幕。
app:layout_collapseMode指定当前控件在CollapsingToolbarLayout折叠过程中的折叠模式,其中pin表示在折叠过程中位置始终保持不变,parallax表示在折叠过程中会产生一定的错位偏移。
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.example.liaowh.myapplication.ScrollingActivity">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar"
android:fitsSystemWindows="true"
android:layout_height="@dimen/app_bar_height"
android:layout_width="match_parent"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/toolbar_layout"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
app:layout_collapseMode="pin"
app:popupTheme="@style/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:showIn="@layout/activity_scrolling"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.liaowh.myapplication.ScrollingActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/text_margin"
android:text="@string/large_text" />
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/fab_margin"
app:layout_anchor="@id/app_bar"
app:layout_anchorGravity="bottom|end"
app:srcCompat="@android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
利用状态栏
Android 5.0之前,我们是无法直接对状态栏的背景或者颜色进行操作的,而Android5.0及之后的系统都是支持这个功能的。
1.将控件的android:fitsSystemWindows属性指定为true,表示该控件会出现在系统状态栏里。
2.在程序的主题中将状态栏的颜色指定为透明色,注意这里需要使用values-v21中的styles.xml
<style name="ExampleTheme" parent="AppTheme">
<item name="android:statusBarColor">@android:color/transparent</item>
</style>
<activity android:name=".MainActivity"
android:theme="@style/ExampleTheme">
</activity>