1、导入依赖 implementation 'com.android.support:design:23.3.0'
2、布局文件
<android.support.design.widget.TabLayout
android:id="@+id/tab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#32CD32"
app:tabIndicatorColor="#f00"
app:tabMode="fixed"
app:tabSelectedTextColor="#444"
app:tabTextColor="#fff"></android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:id="@+id/vp"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"></android.support.v4.view.ViewPager>
3、MainActicity代码
private TabLayout tabLayout;
private ViewPager vp;
private String[] titles = new String[]{"关注", "推荐", "视频"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tabLayout = (TabLayout) findViewById(R.id.tab);
vp = (ViewPager) findViewById(R.id.vp);
tabLayout.setTabTextColors(Color.WHITE, Color.GRAY);//设置文本在选中和为选中时候的颜色
tabLayout.setSelectedTabIndicatorColor(Color.WHITE);//设置选中时的指示器的颜色
// tabLayout.setTabMode(TabLayout.MODE_FIXED);//可滑动,默认是FIXED
// tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);//可滑动,从左边开始,不平均分
// tabLayout.setTabGravity(TabLayout.GRAVITY_CENTER);//标题聚集在中间
/**
*
* 添加Fragment到集合里
*/
List<Fragment> fragments = new ArrayList<>();
fragments.add(new Fragment1());
fragments.add(new Fragment2());
fragments.add(new Fragment3());
//设置分割线
LinearLayout linearLayout = (LinearLayout) tabLayout.getChildAt(0);
linearLayout.setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE);
linearLayout.setDividerDrawable(ContextCompat.getDrawable(this,
R.drawable.divider)); //设置分割线的样式
linearLayout.setDividerPadding(dip2px(10)); //设置分割线间隔
//实例化适配器
TitleFragmentPagerAdapter adapter = new TitleFragmentPagerAdapter(this,getSupportFragmentManager(), fragments, titles);
vp.setAdapter(adapter);
//进行滑动关联
tabLayout.setupWithViewPager(vp);
}
//像素单位转换
public int dip2px(int dip) {
float density = getResources().getDisplayMetrics().density;
return (int) (dip * density + 0.5);
}
4、适配器代码TitleFragmentPagerAdapter
package com.example.tablayoutdemo;
import android.content.Context;
import android.graphics.drawable.Drawable;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.content.ContextCompat;
import android.text.Spannable;
import android.text.SpannableString;
import android.text.style.ImageSpan;
import java.util.List;
public class TitleFragmentPagerAdapter extends FragmentPagerAdapter {
private Context context;
private List<Fragment> mFragmentList;
private String[] titles;
public TitleFragmentPagerAdapter(FragmentManager fm, List<Fragment> mFragmentList) {
super(fm);
this.mFragmentList = mFragmentList;
}
/**
* titles是给TabLayout设置title用的
*
* @param fm
* @param mFragmentList
* @param titles
*/
public TitleFragmentPagerAdapter(Context context,FragmentManager fm, List<Fragment> mFragmentList, String[] titles) {
super(fm);
this.context=context;
this.mFragmentList = mFragmentList;
this.titles = titles;
}
/**
* 返回viewpager对应的title。
*
* @param position
* @return
*/
@Override
public CharSequence getPageTitle(int position) {
if (titles != null && titles.length > 0) {
return titles[position];
}
return null;
}
/**
* 描述:获取索引位置的Fragment.
*
* @param position
* @return
*/
@Override
public Fragment getItem(int position) {
Fragment fragment = null;
if (position < mFragmentList.size()) {
fragment = mFragmentList.get(position);
} else {
fragment = mFragmentList.get(0);
}
return fragment;
}
/**
* 描述:获取数量.
*
* @return
*/
@Override
public int getCount() {
return mFragmentList.size();
}
}