一、本文所涉及到的知识点
源码下载
二、目标
通过利用ViewPager+FragmentStatePagerAdapter+TabLayout 实现顶部滑动效果，如图：
三、知识点讲解
1、ViewPager
是Android库中自带的一个控件，可以实现屏幕间的切换，是个容器类，继承自ViewGroup。一般和PageAdapter或者其子类配合使用进行view切换。比如当和Fragment使用时，会和FragmentPagerAdapter或者FragmentStatePagerAdapter一块使用。
viewPager.setAdapter(
fragmentStatePagerAdapter);
2、FragmentStatePagerAdapter适配器
我们知道Adapter是作为UI和数据的桥梁，负责创建显示每个子项的View和提供对下层数据的访问。这里我们给ViewPager绑定的是Fragment所以选择了FragmentStatePagerAdapter。
定义Fragment数组 ：
private List<Fragment>
fragments;
把Fragment数组添加到FragmentStatePagerAdapter中
fragmentStatePagerAdapter.setFragments(
fragments);
3、TabLayout
TabLayout是在水平布局上显示Tab页，做过C++、.Net等桌面程序或者Web页面的对tab页应该不陌生，使用非常普遍。Android中在xml引用TabLayout如下
<
android.support.design.widget.TabLayout
android
:id=
"@+id/course_tablayout"
android
:layout_width=
"match_parent"
android
:layout_height=
"wrap_content"
android
:background=
"@color/mask_tags_8"
app
:tabIndicatorColor=
"@color/color_lv_selector"
app
:tabSelectedTextColor=
"@color/mask_tags_1"
app
:tabTextColor=
"@color/color_lv_selector"
app
:tabIndicatorHeight=
"5dp"
>
</
android.support.design.widget.TabLayout>
其中
app
:tabTextColor=
"@color/color_lv_selector"，设置TabLayout字体颜色，
app
:tabSelectedTextColor=
"@color/mask_tags_1"为选择后的颜色；
android
:background=
"@color/mask_tags_8"为背景色；
app
:tabIndicatorColor=
"@color/color_lv_selector"为指示器下标颜色；
app
:tabIndicatorHeight=
"5dp"为指示器下标高度。
ViewPager和TabLayout建立联系
tabLayout.setupWithViewPager(viewPager);
设置TabLayout滚动模式
tabLayout.setTabMode(TabLayout.
MODE_SCROLLABLE);
4、Bundle
这里我们用Bundle在Fragment之间传递对象参数。
这里我们定义了一个序列化类，通过Bundle传送到跟随动态菜单切换的Fragment代码如下：
public static TabFragment newInstance(CourseBean extra){
Bundle bundle=
new Bundle();
bundle.putSerializable(
KEY,extra);
TabFragment fragment=
new TabFragment();
fragment.setArguments(bundle);
return fragment;
}
在Fragment初始化的时候通过Bundle bundle=getArguments();获取bundle实例，然后通过
courseBean=(CourseBean)bundle.getSerializable(
KEY);获取预先传入的实体类。
四、主要代码
1、这里我们定义了CourseBean实体类进行Fragment之间的参数传递
public class CourseBean
implements Serializable {
private String
title;
// 分类Tab(对应课程名称)名称
private String
href;
// 课程地址点击地址
private String
data_type;
// 课程分类
public CourseBean() {
super();
}
public CourseBean(String title, String href, String data_type) {
super();
this.
title = title;
this.
href = href;
this.
data_type = data_type;
}
public String getTitle() {
return
title;
}
public void setTitle(String title) {
this.
title = title;
}
public String getHref() {
return
href;
}
public void setHref(String href) {
this.
href = href;
}
public String getData_type() {
return
data_type;
}
public void setData_type(String data_type) {
this.
data_type = data_type;
}
@Override
public String toString() {
return
"CategoriesBean [title=" +
title +
", href=" +
href
+
", data_type=" +
data_type +
"]";
}
}