Android中的ViewPager、Fragment、TabLayout三者联合使用（将Fragment放置于ViewPager中）

工作内容：

1.ViewPager、Fragment、TabLayout三者联合使用

学习分享：

一、ViewPager、Fragment、TabLayout联合使用步骤：

1.在activity.xml中添加ViewPager和TabLayout组件【使用v4包中的】

2.写适配器FragmentPagerAdapter(适合数据较小时使用【原因：即使fragment销毁其中的内容依然存在内存中】，大量数据时使用FragmentStatePagerAdapter),之后调用可以使Fragment填充ViewPager的Item

3.TabLayout.setupWithViewPager(ViewPager) 将标题栏和ViewPager关联起来

【注意：Fragment中含有ViewPager,ViewPager中放置的是Fragment——即：Fragment嵌套Fragment。在切换时可以产生错误（数据加载不出）——处理方法：在ViewPager的FragmentViewPagerAdapter中传入的FragmentManager,使用getChildFragmentManager获得】

activity.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".FragmentTestActivity">
    <!-- tablayout 存放标题栏 -->
    <android.support.design.widget.TabLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/tablayout"
        app:tabIndicatorColor="@color/orange"
        app:tabSelectedTextColor="@color/orange"
        app:tabTextColor="@color/deepskyblue"
        app:tabGravity="fill"
        app:tabMode="fixed"
        android:fillViewport="false"
        >
    </android.support.design.widget.TabLayout>
    <android.support.v4.view.ViewPager
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:id="@+id/viewpager"
        >
    </android.support.v4.view.ViewPager>
    <!-- 春夏秋冬四个TextView -->
    <include
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        layout="@layout/layout_fragtest_bottonline"/>
</LinearLayout>

fragment.xml文件

<?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">
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/spring"
        android:id="@+id/iv_spring"
        />
</LinearLayout>

Fragment.class文件

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.Toast;

/**
 * Created by Administrator on 2016/9/1.
 */
public class Fragment_spring extends Fragment {
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        return inflater.inflate(R.layout.frag_spring,container,false);
    }

    @Override
    public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);
        ImageView imageView = (ImageView)view.findViewById(R.id.iv_spring);
        imageView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(getActivity(), "春天来了", Toast.LENGTH_SHORT).show();
            }
        });
    }
}

FragmentPagerAdapter.class文件;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import java.util.List;

/**
 * Created by Administrator on 2016/9/3.
 */
public class FragPagerAdapter extends FragmentPagerAdapter {
    private List<Fragment> fragments;
    private List<String> titles;

    /**
     * 构造函数（关联fragments,viewpager,title）
     * @param fm 碎片管理者
     * @param fragments 碎片集合
     * @param titles    标题集合
     */
    public FragPagerAdapter(FragmentManager fm,List<Fragment> fragments,List<String> titles) {
        super(fm);
        this.fragments = fragments;
        this.titles = titles;
    }

    @Override
    public Fragment getItem(int position) {
        return fragments.get(position);
    }

    @Override
    public int getCount() {
        return fragments.size();
    }
    //获取当前的标题
    @Override
    public CharSequence getPageTitle(int position) {
        return titles.get(position);
    }
}

activity.class文件：

import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import com.plane.people.planebattle.adapter.FragPagerAdapter;
import java.util.ArrayList;
import java.util.List;

public class FragmentTestActivity extends AppCompatActivity implements View.OnClickListener{
    private ViewPager viewPager;
    private TabLayout tabLayout;
    private FragPagerAdapter fragPagerAdapter;  //适配器
    private List<Fragment> fragments;   //存放碎片Fragment
    private List<String> titles;    //存放标题
    private FragmentManager fm;
    private int [] tvIDs = {R.id.tv_sp,R.id.tv_su,R.id.tv_au,R.id.tv_wi};//TextView的id数组
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_frag_test);
        initListener();
        initData();
    }

    /**
     * 1.初始化viewPager和tabLayout
     * 2.添加点击事件
     */
    private void initListener() {
        viewPager = (ViewPager)findViewById(R.id.viewpager);
        tabLayout = (TabLayout)findViewById(R.id.tablayout);
        for (int i = 0; i < tvIDs.length; i++) {
            findViewById(tvIDs[i]).setOnClickListener(this);
        }
    }
    //初始化数据
    private void initData() {
        /**
         * （引入包为android.app时可以使用getFragmentManager()获取FragmentManager）
         * 使用getSupportFragmentManager（）获取 FragmentManager 需要当前Activity继承FragmentActivity
         * 或其子类（AppCompatActivity是其子类）
         * 【引入import android.support.v4.app.类名，需使用使用getSupportFragmentManager（）】
         * 1.初始化fragments，titles，fm
         * 2.添加数据
         * 3.设置ViewPager的适配器
         */
        fragments = new ArrayList<>();
        titles = new ArrayList<>();
        fm = getSupportFragmentManager();
        fragments.add(new Fragment_spring());
        fragments.add(new Fragment_summer());
        fragments.add(new Fragment_autumn());
        fragments.add(new Fragment_winter());
        titles.add("春");
        titles.add("夏");
        titles.add("秋");
        titles.add("冬");
        fragPagerAdapter = new FragPagerAdapter(fm,fragments,titles);
        viewPager.setAdapter(fragPagerAdapter);
        tabLayout.setupWithViewPager(viewPager);//标题栏TabLayout关联ViewPager
    }

    /**
     * 实现点击几个TextView显示对应的ViewPager页
     * @param v
     */
    @Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.tv_sp:
               viewPager.setCurrentItem(0);
                break;
            case R.id.tv_su:
                viewPager.setCurrentItem(1);
                break;
            case R.id.tv_au:
                viewPager.setCurrentItem(2);
                break;
            case R.id.tv_wi:
                viewPager.setCurrentItem(3);
                break;
        }
    }
}

实现效果：

上方是标题栏（点击可以使中间的页面跳转到相应的页面）

中间是viewpager（可以左右滑动，滑动后标题栏选中的标题跟着改变）

下边是include引入的4个textview（点击使viewpager滑动到对应页面）