TablayoutViewPagerFragment 一系列的结合使用

Gradle  文件（依赖 ）

apply plugin: 'com.android.application'

android {
    compileSdkVersion 24
    buildToolsVersion "27.0.1"
    defaultConfig {
        applicationId "com.bwie.tablayoutviewpagerfragmentday13"
        minSdkVersion 15
        targetSdkVersion 24
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(include: ['*.jar'], dir: 'libs')
    androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', {
        exclude group: 'com.android.support', module: 'support-annotations'
    })
    compile 'com.android.support:appcompat-v7:24.2.1'
    testCompile 'junit:junit:4.12'
    compile 'com.android.support:design:24.2.1'
}

xml 文件

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.bwie.tablayoutviewpagerfragmentday13.MainActivity">

    <android.support.design.widget.TabLayout
        app:tabMode="scrollable"
        android:id="@+id/mytablayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabTextColor="@color/colorPrimary"
        app:tabSelectedTextColor="@color/colorAccent"
        app:tabTextAppearance="@android:style/TextAppearance.Large"
        app:tabIndicatorHeight="1dp"
        />
    <android.support.v4.view.ViewPager
        android:id="@+id/vp"
        android:layout_below="@+id/mytablayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</RelativeLayout>

fragment  viewpager 的xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.bwie.tablayoutviewpagerfragmentday13.MainActivity">

    <android.support.design.widget.TabLayout
        app:tabMode="scrollable"
        android:id="@+id/mytablayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabTextColor="@color/colorPrimary"
        app:tabSelectedTextColor="@color/colorAccent"
        app:tabTextAppearance="@android:style/TextAppearance.Large"
        app:tabIndicatorHeight="1dp"
        />
    <android.support.v4.view.ViewPager
        android:id="@+id/vp"
        android:layout_below="@+id/mytablayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</RelativeLayout>

Activity代码

package com.bwie.tablayoutviewpagerfragmentday13;

import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {

    private TabLayout mMytablayout;
    private String[] channels = {"关注", "热点", "推荐", "北京", "娱乐", "体育", "教育", "科技", "历史", "地理", "视频"};
    private ViewPager mVp;
    private ArrayList<Fragment> fragments;
    private FragmentManager fm;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
    }

    private void initView() {
        mMytablayout = (TabLayout) findViewById(R.id.mytablayout);
        mVp = (ViewPager) findViewById(R.id.vp);//得到ViewPager
        mMytablayout.setupWithViewPager(mVp);
        fm = getSupportFragmentManager();
//        mMytablayout.setTabMode(TabLayout.MODE_SCROLLABLE);//设置显示的模式
        //给mMytablayout配置tab页
        for (int i = 0; i < channels.length; i++) {
            mMytablayout.addTab(mMytablayout.newTab().setText(channels[i]).setIcon(R.mipmap.ic_launcher));//
        }
        //给VIewPager配置pager页
        fragments = new ArrayList<Fragment>();
        for(int i=0;i<channels.length;i++){
            MyFragmentForVp fragment = new MyFragmentForVp();//创建fragment作为vp的pager页
            //向Fragment传值
            Bundle b = new Bundle();
            b.putString("title",channels[i]);
            fragment.setArguments(b);

            fragments.add(fragment);//保存fragment，作为vp的pager页
        }
        //通过适配器配置给vp
        mVp.setAdapter(new FragmentPagerAdapter(fm) {
            @Override
            public Fragment getItem(int position) {

                return fragments.get(position);
            }

            @Override
            public int getCount() {
                return fragments.size();
            }

            @Override
            public CharSequence getPageTitle(int position) {
                return channels[position];
            }
        });


    }
}

fragment viewpager 的代码

package com.bwie.tablayoutviewpagerfragmentday13;

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.TextView;

/**
 * Created by Administrator on 2017/12/13.
 */

public class MyFragmentForVp extends Fragment{
    private TextView tv;
    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_for_vp_layout,null);
        Bundle b = getArguments();
        tv = (TextView) view.findViewById(R.id.tv);
        //给tv赋不同的值
        tv.setText(b.getString("title"));
        return view;
    }
}