因为我是在之前的基础上写的,所以这个TableLayout和Viewpager实际上是写在Fragment上的。要写到Activity里其实也是一样的啦。
先看效果图,原谅我不会动态图,只能截个图啦
布局文件
app:tabIndicatorcolor意思是选中的导航条的颜色。
app:tabSelectesTextColor是选中的导航条的文字颜色。
app:tabTextColor 是没有选中的导航条文字的颜色。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="@+id/tab"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
app:tabIndicatorColor="@color/selectTable"
app:tabSelectedTextColor="@color/selectTable"
app:tabTextColor="@color/black" />
<android.support.v4.view.ViewPager
android:id="@+id/vp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
java代码
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import com.lvyequeen.mystudysummry.R;
import com.lvyequeen.mystudysummry.adapters.FragmentVpAdapter;
import java.util.ArrayList;
import java.util.List;
public class CertificFragment extends Fragment {
private ViewPager vp;
private TabLayout tab;
private List<String> tablist = new ArrayList<>();
private List<View> views = new ArrayList<>();
private FragmentVpAdapter fragmentVpAdapter;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
initViews();
initTabStr();
View view = inflater.inflate(R.layout.fragment_certific, null);
tab = ((TabLayout) view.findViewById(R.id.tab));
vp = ((ViewPager) view.findViewById(R.id.vp));
tab.setTabMode(TabLayout.MODE_FIXED);
for (int i = 0; i < 3; i++) {
tab.addTab(tab.newTab().setText(tablist.get(i)));
}
fragmentVpAdapter = new FragmentVpAdapter(views, tablist);
vp.setAdapter(fragmentVpAdapter);
// 将tablelayout和ViewPager关联起来
tab.setupWithViewPager(vp);
tab.setTabsFromPagerAdapter(fragmentVpAdapter);
return view;
}
/**
* 初始化Viewpager的每个页面内容,这里为了简单,就直接new的视图
* 如果想要不同布局的内容,就按ViewPager的使用方式就行了。
*/
private void initViews() {
views.clear();
for (int i = 0; i < 3; i++) {
TextView view = new TextView(getContext());
view.setText(i + 1 + "个viewpager的填充界面");
views.add(view);
}
}
/**
* 同样为了简单,标题栏的内容就这么附值了。
*/
private void initTabStr() {
tablist.clear();
for (int i = 0; i < 3; i++) {
tablist.add("标题" + (1 + i));
}
}
}
适配器的代码,和平时viewpager的写法是一样的,但是多了一个方法getPageTitle();
import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;
import java.util.List;
public class FragmentVpAdapter extends PagerAdapter {
// 这个是viewpager的填充视图
private List<View> views;
// 这个是table导航条里面的内容填充
private List<String> tabstrs;
public FragmentVpAdapter(List<View> views, List<String> tabstrs) {
this.views = views;
this.tabstrs = tabstrs;
}
@Override
public int getCount() {
return views.size();
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView(views.get(position));
return views.get(position);
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(views.get(position));
}
// 这个是和tablelayout相关的
@Override
public CharSequence getPageTitle(int position) {
return tabstrs.get(position);
}
}