TabLayout与ViewPager

      啥也别说先看效果图,因为我不会弄动态图，其实这个界面是可以滑动的，也可以点下方的Tab进行切换

因为TabLayout和ViewPager分别属于design包和support包，所以我们得在build.gradle里添加：
compile 'com.android.support:support-v4:24.1.1'compile 'com.android.support:design:24.1.1'
如果出现this support library should not use a different version than the compileSdkVersion的问题，
是因为添加的包的版本得和compileSdkVersion版本一致，手动改一下就好了
 
首先在activity_main.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:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    这里必须设置为垂直，否则ViewPager不能滑动
    tools:context="com.example.administrator.tab_viewpager.MainActivity">    <android.support.v4.view.ViewPager        android:layout_width="match_parent"        android:layout_height="0dp"        android:layout_weight="1"        android:scrollbars="none"        android:id="@+id/viewPager">    </android.support.v4.view.ViewPager>    <android.support.design.widget.TabLayout        android:layout_width="match_parent"        android:layout_height="50dp"        app:tabGravity="fill"        android:id="@+id/tabLayout"
	app:tabIndicatorHeight="0dp"    是为了不显示Tab底部的横线
        app:tabMode="fixed"      是为了让Tab底部不可滑动
        app:tabSelectedTextColor="#ff4081"     设置选中后的字体颜色
        app:tabTextColor="#000">      设置字体颜色
    </android.support.design.widget.TabLayout></LinearLayout>
 
接着创建3个fragment1.xml,fragment2.xml，fragment3.xml，除了字3个xml是一样的，这里只展示其中一个
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical"    android:gravity="center"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="#f0f0ff">    <ImageView        android:src="@mipmap/ic_launcher"        android:layout_width="wrap_content"        android:layout_height="wrap_content"/>    <TextView        android:text="这是话题"        android:layout_width="wrap_content"        android:layout_height="wrap_content"/></LinearLayout>
现在所有布局文件都准备好了
 
接着创建3个Fragment1,Fragment2,Fragment3 java文件，同样这里只展示一个，名字上的差别自己改
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;public class Fragment1 extends Fragment {    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container,                             @Nullable Bundle savedInstanceState) {        View view = inflater.inflate(R.layout.fragment1, null);        return view;
	//@Nullable表示用来标注给定的参数或返回值可以为null（其实我也不懂，就这样用吧）
    }}
 
接着创建MyAdapter java文件
import android.support.v4.app.Fragment;import android.support.v4.app.FragmentPagerAdapter;import android.support.v4.app.FragmentManager;import java.util.List;
 
public class MyAdapter extends FragmentPagerAdapter {    PRivate List<String> title;    private List<Fragment> views;    public MyAdapter(FragmentManager fm, List<String> title, List<Fragment> views) {        super(fm);        this.title = title;        this.views = views;    }    @Override    public Fragment getItem(int position) {        return views.get(position);    }    @Override    public int getCount() {        return views.size();    }    //配置标题的方法    @Override    public CharSequence getPageTitle(int position) {        return title.get(position);    }}
最后MainActivity
import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.support.design.widget.TabLayout;import android.support.v4.app.Fragment;import android.support.v4.view.ViewPager;import java.util.ArrayList;import java.util.List;public class MainActivity extends AppCompatActivity {    private TabLayout tabLayout;    private ViewPager viewPager;    private List<String> mTitle = new ArrayList<String>();    private List<Fragment> mFragment = new ArrayList<Fragment>();    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);
 
        //初始化        initView();        MyAdapter adapter = new MyAdapter(getSupportFragmentManager(), mTitle, mFragment);        viewPager.setAdapter(adapter);        //为TabLayout设置ViewPager        tabLayout.setupWithViewPager(viewPager);    }    //初始化界面下面的3个Tab
    private void initView() {        tabLayout = (TabLayout) findViewById(R.id.tabLayout);        viewPager = (ViewPager) findViewById(R.id.viewPager);        mTitle.add("话题");        mTitle.add("主页");        mTitle.add("个人");        mFragment.add(new Fragment1());        mFragment.add(new Fragment2());        mFragment.add(new Fragment3());    }}
全部完成啦！
 
PS:该文章只是本人自个写写供小白学习使用，源文章出处http://www.cnblogs.com/share2015/p/5271622.html
有任何关于本文章的疑问可以发QQ邮箱和我学习探讨lijiahongssg@qq.com