http://blog.csdn.net/u010687392/article/details/46852565
版权声明：本文为博主原创文章，未经博主允许不得转载。转载注明出处：sunzxyong
ok，今天继续更新material design系列！！！
废话不说，先看看效果图吧：
好了，现在来讲讲上图是怎么实现的吧！讲之前先讲讲几个控件：
coordinatorlayout
该控件也是design包下的一个控件，然而这个控件可以被称为design包中最复杂、功能最强大的控件：coordinatorlayout。为什么这样说呢？原因是：它是组织它众多子view之间互相协作的一个viewgroup。
coordinatorlayout 的神奇之处就在于 behavior 对象。怎么理解呢？coordinatorlayout使得子view之间知道了彼此的存在，一个子view的变化可以通知到另一个子view，coordinatorlayout 所做的事情就是当成一个通信的桥梁，连接不同的view，使用 behavior 对象进行通信。
比如：在coordinatorlayout中使用appbarlayout，如果appbarlayout的子view（如toolbar、tablayout）标记了app:layout_scrollflags滚动事件,那么在coordinatorlayout布局里其它标记了app:layout_behavior的子view（linearlayout、recyclerview、nestedscrollview等）就能够响应（如toolbar、tablayout）控件被标记的滚动事件。如：
[html] view
plaincopyprint?
<android.support.design.widget.coordinatorlayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.appbarlayout
android:id="@+id/appbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitssystemwindows="true">
<android.support.v7.widget.toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionbarsize"
android:background="#30469b"
app:layout_scrollflags="scroll|enteralways" />
<android.support.design.widget.tablayout
......
/>
</android.support.design.widget.appbarlayout>
<linearlayout
android:layout_height="match_parent"
android:orientation="vertical"
android:scrollbars="none"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<!-- content view .....-->
</linearlayout>
</android.support.design.widget.coordinatorlayout>
上面这段代码中，toolbar标记了layout_scrollflags滚动事件，那么当linearlayout滚动时便可触发toolbar中的layout_scrollflags效果。即往上滑动隐藏toolbar，下滑出现toolbar，而不会隐藏tablayout，因为tablayout没有标记scrollflags事件，相反，如果tablayout也标记了scrollflags事件，那么linearlayout的下滑时toolbar和tablayout都会隐藏了。
layout_scrollflags中的几个值：
scroll: 所有想滚动出屏幕的view都需要设置这个flag， 没有设置这个flag的view将被固定在屏幕顶部。
enteralways:这个flag让任意向下的滚动都会导致该view变为可见，启用快速“返回模式”。
enteralwayscollapsed:当你的视图已经设置minheight属性又使用此标志时，你的视图只能已最小高度进入，只有当滚动视图到达顶部时才扩大到完整高度。
exituntilcollapsed:滚动退出屏幕，最后折叠在顶端。
【注意】: 设置了layout_scrollflags标志的view必须在没有设置的view的之前定义，这样可以确保设置过的view都从上面移出,
只留下那些固定的view在下面。
tablayout
说到tablayout，就是实现多个tab之间的切换，不过google在design library新推出的tablayout既实现了固定的选项卡 - (tab的宽度平均分配)，也实现了可滚动的选项卡
- (tab宽度不固定，同时可以横向滚动)，还实现了所有tab居中显示。它还有一个重要作用就是结合viewpager来实现多个tab之间的切换。
来看看tablayout的三种实现方式：
固定的tab，根据tablayout的宽度适配
固定的tab，在tablayout中居中显示
可滑动的tab
要实现上述效果，首先就需要加入tablayout：
<android.support.design.widget.tablayout
android:id="@+id/tablayout"
android:layout_height="wrap_content"
app:tabgravity="fill"
app:tabmode="fixed"
app:tabselectedtextcolor="#ff0000"
app:tabtextcolor="#ffffff" />
上面有几个参数我来详细介绍下吧，其实就是通过改变这几个参数来改变tablayout显示效果的：
tabgravity —tab的重心，有填充和居中两个值，为别为fill和center。
tabmode —tab的模式，有固定和滚动两个模式，分别为 fixed 和 scrollable。
tabtextcolor —设置默认状态下tab上字体的颜色。
tabselectedtextcolor —设置选中状态下tab上字体的颜色。
然后在代码中动态添加tab：
[java] view
tablayout mtablayout = (tablayout) findviewbyid(r.id.tablayout);
mtablayout.addtab(mtablayout.newtab().settext("tabone"));//给tablayout添加tab
mtablayout.addtab(mtablayout.newtab().settext("tabtwo"));
mtablayout.addtab(mtablayout.newtab().settext("tabthree"));
mtablayout.setupwithviewpager(mviewpager);//给tablayout设置关联viewpager，如果设置了viewpager，那么viewpageradapter中的getpagetitle()方法返回的就是tab上的标题
viewpager设置代码：
viewpager mviewpager = (viewpager) findviewbyid(r.id.viewpager);
myviewpageradapter viewpageradapter = new myviewpageradapter(getsupportfragmentmanager());
viewpageradapter.addfragment(fragmentone.newinstance(), "tabone");//添加fragment
viewpageradapter.addfragment(fragmenttwo.newinstance(), "tabtwo");
viewpageradapter.addfragment(fragmentthree.newinstance(), "tabthree");
mviewpager.setadapter(viewpageradapter);//设置适配器
然后把mviewpager设置给tablayout即可。贴一下viewpager适配器代码：
myviewpageradapter.java
public class myviewpageradapter extends fragmentpageradapter {
private final list<fragment> mfragments = new arraylist<>();//添加的fragment的集合
private final list<string> mfragmentstitles = new arraylist<>();//每个fragment对应的title的集合
public myviewpageradapter(fragmentmanager fm) {
super(fm);
}
/**
* @param fragment 添加fragment
* @param fragmenttitle fragment的标题，即tablayout中对应tab的标题
*/
public void addfragment(fragment fragment, string fragmenttitle) {
mfragments.add(fragment);
mfragmentstitles.add(fragmenttitle);
@override
public fragment getitem(int position) {
//得到对应position的fragment
return mfragments.get(position);
public int getcount() {
//返回fragment的数量
return mfragments.size();
public charsequence getpagetitle(int position) {
//得到对应position的fragment的title
return mfragmentstitles.get(position);
}
好了，tablayout就介绍完了。。。效果就是开始那张效果图的效果，可滑动切换。
上面两个控件如果明白怎么用了，那么这个效果就很简单了，我就直接贴代码了。。。
主布局：activity_main.xml
<android.support.v4.view.viewpager
android:id="@+id/viewpager"
android:layout_height="match_parent" />
功能实现：mainactivity.java
public class mainactivity extends actionbaractivity {
protected void oncreate(bundle savedinstancestate) {
super.oncreate(savedinstancestate);
setcontentview(r.layout.activity_main);
toolbar mtoolbar = (toolbar) findviewbyid(r.id.toolbar);
mtoolbar.settitletextcolor(color.white);//设置toolbar的titl颜色
setsupportactionbar(mtoolbar);
viewpager mviewpager = (viewpager) findviewbyid(r.id.viewpager);
myviewpageradapter viewpageradapter = new myviewpageradapter(getsupportfragmentmanager());
viewpageradapter.addfragment(fragmentone.newinstance(), "tabone");//添加fragment
viewpageradapter.addfragment(fragmenttwo.newinstance(), "tabtwo");
viewpageradapter.addfragment(fragmentthree.newinstance(), "tabthree");
mviewpager.setadapter(viewpageradapter);//设置适配器
tablayout mtablayout = (tablayout) findviewbyid(r.id.tablayout);
主要就是这两个代码文件！！！
源码地址：http://download.csdn.net/detail/u010687392/8893117