TabLayout应用

第一步：将tabLayout 和 viewpager 添加到布局里面

           注意：这里需要将标签包引入

<android.support.design.widget.TabLayout    android:id="@+id/tablayout"    android:layout_width="match_parent"    android:layout_height="wrap_content"    /><android.support.v4.view.ViewPager    android:id="@+id/viewpager"    android:layout_width="match_parent"    android:layout_height="0dp"    android:layout_weight="1"    />

第二步：创建一个适配器，进行数据和界面之间的适配(建一个MyAdapter的类）

//适配器里有什么？//1 显示的fragment列表private List<Fragment> list;//2 显示标签的标题列表private List<String> listTitle;//重写构造函数，在构造函数里进行成员变量（fragment列表和标题列表的赋值）public  MyAdapter(FragmentManager fm, List<Fragment> list, List<String> listTitle){    super(fm);    this.list = list;    this.listTitle = listTitle;}@Overridepublic Fragment getItem(int position) {    //返回位置对应的fragment    return list.get(position);}@Overridepublic int getCount() {    //返回所有fragment的个数    return list.size();}//返回标题对应的tab上的名字@Overridepublic CharSequence getPageTitle(int position) {    return listTitle.get(position);}

第三步：创建fragment（viewpager里面放的是fragment）

第四步：将数据和界面关联起来

       

              //声明属性
    private TabLayout tabLayout;
    private ViewPager viewPager;


    //声明要显示的界面和标题数据
    private List<Fragment> list;
    private List<String> listTitle;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


        // 在这里进行数据和界面的初始化
        // 1 将id和成员变量进行关联
        tabLayout =(TabLayout)findViewById(R.id.tablayout);
        viewPager = (ViewPager)findViewById(R.id.viewpager);
        //2 进行数据的初始化和整理
        list = new ArrayList<Fragment>();
        list.add(new OneFragment());
        list.add(new TwoFragmen());
        list.add(new ThreeFragment());


        listTitle = new ArrayList<String>();
        listTitle.add("One");
        listTitle.add("Two");
        listTitle.add("Three");


        //3 创建适配器
        MyAdapter adapter =new MyAdapter(getSupportFragmentManager(),list,listTitle);
        // 4 绑定适配器


        viewPager.setAdapter(adapter);
        //指定当前选中页
        viewPager.setCurrentItem(0);


        // 5 将tablayout 和viewpager 关联
        tabLayout.setupWithViewPager(viewPager);