TabLayout+ViewPager+Fragment使用

Paste_Image.png

实现图中效果，使用TabLayout+ViewPager+Fragment

一、布局

  <?xml version="1.0" encoding="utf-8"?>
  <com.zhy.autolayout.AutoLinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
   xmlns:app="http://schemas.android.com/apk/res-auto"
   android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical"
  android:background="@color/gray_line">
<include layout="@layout/item_title_haveback"/>
<android.support.design.widget.TabLayout
    android:id="@+id/tl_coupon"
    android:layout_width="match_parent"
    app:tabIndicatorColor="@color/golden"
    app:tabSelectedTextColor="@color/golden"
    app:tabTextColor="@color/txt_color_tint_"
    android:layout_height="90px">
</android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
    android:id="@+id/vp_coupon"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>
</com.zhy.autolayout.AutoLinearLayout>

二、Activity实现

    ArrayList<String> titleDatas=new ArrayList<>();
    titleDatas.add("体验券");
    titleDatas.add("优惠券");
    ArrayList<Fragment> fragmentList = new ArrayList<Fragment>();
    fragmentList.add(new ExperienceFragment());
    fragmentList.add(new DiscountFragment());
    MyViewPageAdapter myViewPageAdapter = new MyViewPageAdapter(getSupportFragmentManager(), titleDatas,        fragmentList);
    vpCoupon.setAdapter(myViewPageAdapter);
    tlCoupon.setupWithViewPager(vpCoupon);
    tlCoupon.setTabsFromPagerAdapter(myViewPageAdapter);

三、MyViewPageAdapter实现（Fragment创建省略）

 public class MyViewPageAdapter extends FragmentPagerAdapter {
private ArrayList<String> titleList;
private ArrayList<Fragment> fragmentList;
public MyViewPageAdapter(FragmentManager fm, ArrayList<String> titleList, ArrayList<Fragment> fragmentList) {
    super(fm);
    this.titleList = titleList;
    this.fragmentList = fragmentList;
}
@Override
public Fragment getItem(int position) {
    return fragmentList.get(position);
}
@Override
public int getCount() {
    return fragmentList.size();
}
@Override
public CharSequence getPageTitle(int position) {
    return titleList.get(position);
}
}

TabLayout+ViewPager 也可以实现布局

一、Activity实现（布局同上）

  private ArrayList<View> viewList = new ArrayList<>();
  private TabLayout tlMain;
private ViewPager vpMain;
private MyAdapter adapter;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
ArrayList<String> titleDatas=new ArrayList<>();
    titleDatas.add("体验券");
    titleDatas.add("优惠券");
    View view1 = getLayoutInflater().inflate(R.layout.view1, null);
    View view2 = getLayoutInflater().inflate(R.layout.view2, null);
    viewList.add(view1);
    viewList.add(view2);
    initView();
}

private void initView() {
    tlMain = (TabLayout) findViewById(R.id.tlMain);
    tlMain.setTabMode(TabLayout.MODE_FIXED);
    tlMain.addTab(tlMain.newTab().setText(titleDatas.get(0)));
    tlMain.addTab(tlMain.newTab().setText(titleDatas.get(1)))；
    vpMain = (ViewPager) findViewById(R.id.vpMain);
    adapter = new MyAdapter(titleList, viewList);
    tlMain.setTabsFromPagerAdapter(adapter);
    vpMain.setAdapter(adapter);
    tlMain.setupWithViewPager(vpMain, true);
}

二、MyAdapter实现

 public class MyAdapter extends PagerAdapter {
private ArrayList<String> titleList;
private ArrayList<View> viewList;
public MyAdapter(ArrayList<String> titleList, ArrayList<View> viewList) {
    this.titleList = titleList;
    this.viewList = viewList;
}
@Override
public int getCount() {
    return viewList.size();
}
@Override
public boolean isViewFromObject(View view, Object object) {
    return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
    container.addView(viewList.get(position));
    return viewList.get(position);
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
    container.removeView(viewList.get(position));
}
@Override
public CharSequence getPageTitle(int position) {
    return titleList.get(position);
}

}