首先是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" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context="com.ex.qf.dragonflyfm.activity.MainActivity"> <android.support.design.widget.TabLayout android:id="@+id/tabLayout" android:layout_width="match_parent" android:layout_height="wrap_content"> <android.support.design.widget.TabItem android:text="text1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <android.support.design.widget.TabItem android:text="text1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <android.support.design.widget.TabItem android:text="text1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <android.support.design.widget.TabItem android:text="text1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <android.support.design.widget.TabItem android:text="text1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </android.support.design.widget.TabLayout> <android.support.v4.view.ViewPager android:layout_weight="1" android:id="@+id/pager" android:layout_width="match_parent" android:layout_height="match_parent"> </android.support.v4.view.ViewPager> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <Button android:text="button1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </LinearLayout>
进行一些TabLayout的初始化设置
//设置tabLayout模式 tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE); //设置选中颜色和未选中淹死 tabLayout.setTabTextColors(Color.BLACK, Color.RED);
除了采用xml静态添加tabItem的方式,还有tabLayout的动态添加tabItem:
mTabLayout.addTab(mTabLayout.newTab().setCustomView(createCustomView()).setText("娃哈哈").setIcon(R.drawable.ic_home)); mTabLayout.addTab(mTabLayout.newTab().setCustomView(createCustomView()).setText("娃哈哈").setIcon(R.drawable.ic_home)); mTabLayout.addTab(mTabLayout.newTab().setCustomView(createCustomView()).setText("娃哈哈").setIcon(R.drawable.ic_home));
其次根据id查找TabLayout,ViewPager,
pager = (ViewPager) findViewById(R.id.pager); tabLayout = (TabLayout) findViewById(R.id.tabLayout);
//tabLayout与viewpager的联动
tabLayout.setupWithViewPager(pager);//为viewPager添加Fragmentpager.setAdapter(new FragmentAdapter(getSupportFragmentManager(),lists));以下是ViewPager的专注于匹配Fragment的适配器,注意要重写onPageTitle方法,因为,tabLyaout在与ViewPager联动时,
数据被清空了。
package com.ex.qf.dragonflyfm.adapter; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentPagerAdapter; import java.util.List; /** * Created by administer on 2016/11/14. */ public class FragmentAdapter extends FragmentPagerAdapter{ private List<Fragment> lists; @Override public CharSequence getPageTitle(int position) { switch (position) { case 0: return "精选"; case 1: return "分类"; case 2: return "主播"; case 3: return "电台"; default: return super.getPageTitle(position); } } public FragmentAdapter(FragmentManager fm, List<Fragment> lists) { super(fm); this.lists = lists; } public FragmentAdapter(FragmentManager fm) { super(fm); } @Override public Fragment getItem(int position) { return lists.get(position); } @Override public int getCount() { return lists.size(); }