VerticalTabLayout 的一些用法
南门新荣
VerticalTabLayout 是一种纵向的TabLayout，为了满足各种需求被某作者开发出来，怎么开发的暂且不讨论了，先讨论拿来使用，在Android studio gradle文件中添加
添加依赖
compile 'q.rorbin:VerticalTabLayout:1.2.5'属性说明
| xml | code | 说明 |
|---|---|---|
| app:indicator_color | setIndicatorColor | 指示器颜色 |
| app:indicator_width | setIndicatorWidth | 指示器宽度 |
| app:indicator_gravity | setIndicatorGravity | 指示器位置 |
| app:indicator_corners | setIndicatorCorners | 指示器圆角 |
| app:tab_mode | setTabMode | Tab高度模式 |
| app:tab_height | setTabHeight | Tab高度 |
| app:tab_margin | setTabMargin | Tab间距 |
VerticalTabLayout 不是继承与Tablayout，而是继承于NestedScrollView，而NestedScrollView继承于Framelayout，所以基本和TableLayout的用法差不多，下面简单介绍几个常用方法
public void setupWithFragment(FragmentManager manager, List<Fragment> fragments) {
this.setupWithFragment(manager, 0, fragments);
}public void setupWithFragment(FragmentManager manager, int containerResid, List<Fragment> fragments) {
if (this.mTabFragmentManager != null) {
this.mTabFragmentManager.detach();
}
if (containerResid != 0) {
this.mTabFragmentManager = new TabFragmentManager(manager, containerResid, fragments, this);
} else {
this.mTabFragmentManager = new TabFragmentManager(manager, fragments, this);
}
}第一个方法最终调用的也是第二个方法，所以只讲第二个，看参数可以知道这两个方法都是把一些fragment和tab相绑定起来，达到点击tab显示对应fragment的目的，第一个方法没有传入containerResid，所以他会把fragment都加载在tablayout本身身上，需要空出空间来显示fragment，而第一个方法传入了containerResid所以fragment都会显示到传入的view上。
所有参数传入之后先会根据containerResid是否出入构建TabFragmentManager对象，这个对象里会直接把fragment全部加到FragmentTransaction中供切换使用
public void setupWithFragment(FragmentManager manager, List<Fragment> fragments, TabAdapter adapter);public void setupWithFragment(FragmentManager manager, int containerResid, List<Fragment> fragments, TabAdapter adapter)public void setupWithFragment(FragmentManager manager, int containerResid, List<Fragment> fragments, TabAdapter adapter) {
this.setTabAdapter(adapter);
this.setupWithFragment(manager, containerResid, fragments);
}这两个方法，看起来好像和上面两个方法也是重载关系，唯一不同的就是这两个方法还多传入了一个参数TabAdapter，这个参数很有用，tab的风格都是由这个adapter决定，其实这两个方法最后都会调用之前的方法，只是比之前多做了一步setTabAdapter，这个方法就是设置TabLayout的方法，可以设置tablayout显示几个，显示成什么样
public void setupWithViewPager(@Nullable ViewPager viewPager);这个方法就更加厉害了，它是直接把viewpager和tablayout绑定起来，只要将viewpager设置好出入，他就会直接从viewpager中解析数据然后显示出来，看他的代码
public void setupWithViewPager(@Nullable ViewPager viewPager) {
if (this.mViewPager != null && this.mTabPageChangeListener != null) { //判断有没添加监听有就移除
this.mViewPager.removeOnPageChangeListener(this.mTabPageChangeListener);
}
if (viewPager != null) {
PagerAdapter adapter = viewPager.getAdapter();// 获取viewpager的适配器
if (adapter == null) {
throw new IllegalArgumentException("ViewPager does not have a PagerAdapter set");
}
this.mViewPager = viewPager;
if (this.mTabPageChangeListener == null) {
this.mTabPageChangeListener = new VerticalTabLayout.OnTabPageChangeListener();
}
// 添加新的监听
viewPager.addOnPageChangeListener(this.mTabPageChangeListener);
this.addOnTabSelectedListener(new VerticalTabLayout.OnTabSelectedListener() {
public void onTabSelected(TabView tab, int position) { //这里基本上就是把viewpager的位置和tab位置相绑定了
if (VerticalTabLayout.this.mViewPager != null && VerticalTabLayout.this.mViewPager.getAdapter().getCount() >= position) {
VerticalTabLayout.this.mViewPager.setCurrentItem(position);
}
}
public void onTabReselected(TabView tab, int position) {
}
});
this.setPagerAdapter(adapter, true);// 这个方法中开始会对viewpager监察还有设置tablayout的一些东西
} else {
this.mViewPager = null;
this.setPagerAdapter((PagerAdapter)null, true);
}
}上面的方法最终会走到这里populateFrompageradapter,这个方法很重要，主要是对tablayout的一下设置
private void populateFromPagerAdapter() {
this.removeAllTabs();
if (this.mPagerAdapter != null) {
int adapterCount = this.mPagerAdapter.getCount();
int curItem;
if (this.mPagerAdapter instanceof TabAdapter) { // 获取pageradapter是不是实现了TabAdapter借口如果实现了，就直接调用setTabAdapter，负责走默认风格
this.setTabAdapter((TabAdapter)this.mPagerAdapter);
} else {
for(curItem = 0; curItem < adapterCount; ++curItem) {//获取viewpager的title 作为tab的title，然后一个个添加，全部使用默认风格，默认风格无法更改，不太美观
String title = this.mPagerAdapter.getPageTitle(curItem) == null ? "tab" + curItem : this.mPagerAdapter.getPageTitle(curItem).toString();
this.addTab((new QTabView(this.mContext)).setTitle((new Builder()).setContent(title).build()));
}
}
if (this.mViewPager != null && adapterCount > 0) {
curItem = this.mViewPager.getCurrentItem();
if (curItem != this.getSelectedTabPosition() && curItem < this.getTabCount()) {
this.setTabSelected(curItem);
}
}
} else {
this.removeAllTabs();
}
}接下来看看setTabAdapter到底干了啥
public void setTabAdapter(TabAdapter adapter) {
this.removeAllTabs();
if (adapter != null) {
this.mTabAdapter = adapter;
for(int i = 0; i < adapter.getCount(); ++i) {
this.addTab((new QTabView(this.mContext)).setIcon(adapter.getIcon(i)).setTitle(adapter.getTitle(i)).setBadge(adapter.getBadge(i)).setBackground(adapter.getBackground(i)));
}
}
}可以看到，在这个方法里只做了一件事就是添加tab，添加有自定义风格的tab，没错这就是我们想要的，我们的每一个tab不仅可以设置title而且可以设置icon,badge(不知道是是什么鬼),background，这一系列的东西都是我们开发时候想要的，改成自己的风格，接下来看看TabAdapter
public interface TabAdapter {
int getCount();//个数
TabBadge getBadge(int var1);
TabIcon getIcon(int var1);// 图标，传入参数是资源id
TabTitle getTitle(int var1);//标题
int getBackground(int var1);//每个一个tab的背景，这里不仅可以用图片还能使用selector，非常好用
}来获取它，然后再自定义一些属性
VerticalTabLayout 确实是个很好用的view，我这里只是简单的介绍了一下，还有很多功能大家可以自行去探索
类似资料：