TabLayout使用#
最近在做一个项目，用到了TabLayout这个新型控件，所以写此文章记录下学习成果。###
先来看一下效果图###
实现这个效果其实很简单###
-
第一步：在Android Studio中，按ctrl+alt+shift+s,然后在Dependencies中添加design依赖。如图
第二步：声明控件：
- 第三步:使用TabLayout
- `package com.yutianwang.test;
public class MainActivity extends Activity {
private TabLayout tabLayout;
private ViewPager vp_out;
private ViewPager vp_in;
private String[] tab = new String[]{"Tab1","Tab2","Tab3","Tab4","Tab5","Tab6","Tab7","Tab8","Tab9","Tab10"};
private ArrayList<String> mList = new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tabLayout = (TabLayout) findViewById(R.id.tl);
vp_out = (ViewPager) findViewById(R.id.vp_out);
initData();
vp_out.setAdapter(new MyOutPagerAdapter());
tabLayout.setupWithViewPager(vp_out);
tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
}
private void initData() {
for (int i = 0; i < tab.length; i++) {
mList.add(tab[i]);
}
}
public class MyOutPagerAdapter extends PagerAdapter{
@Override
public CharSequence getPageTitle(int position) {
return mList.get(position);
}
@Override
public int getCount() {
return mList.size();
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view==object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
TextView mText = new TextView(MainActivity.this);
mText.setText(mList.get(position));
mText.setGravity(Gravity.CENTER);
mText.setTextSize(28);
container.addView(mText);
return mText;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
}
`
拿到相应的控件之后，写一个正常的ViewPager的PagerAdapter类，然后setAdapter.要想实现上图效果，还需在PagerAdapter中多覆写一个getPageTitle(),返回标签文字。最后需要将TabLayout和ViewPager建立连接，还有就是可以设置TabLayout的TabMode.这里用的是SCROLLERABLE。其实他还有另一个TabMode,MODEFIXED,那么它们到底有什么区别呢？？？####
如果你用的是FIXED的话，那么当你的getTabTitle返回数字比较小的话，他会自动调整大小
FIXED
如果你用的是SCROLLERABLE,那么它会缩在一块了。
补充##
TabLayout还有一些常用的属性：
app:tabIndicatorColor="#F00" 标签下划线的颜色
app:tabSelectedTextColor="#f00" 标签文字选中的颜色
app:tabTextColor="#797070" 标签正常的颜色
注意##
使用TabLayout绑定ViewPager之前一定要先调用ViewPager的setAdapter()
总结##
TabMode.SCROLLERABLE适用于Tab数量多的场景，TabMode.FIXED适用于Tab数量少的场景。 最后祝大家生活愉快！
最后祝大家生活愉快！
