实现头部导航——TabLayout

记得先添加依赖
在这里插入图片描述
效果图
在这里插入图片描述
布局

 <?xml version="1.0" encoding="utf-8"?>
 <android.support.constraint.ConstraintLayout  xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
        tools:context=".MainActivity">

<LinearLayout
    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="match_parent"
        android:layout_height="50dp" />

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"></android.support.v4.view.ViewPager>

</LinearLayout>
</android.support.constraint.ConstraintLayout>

MainActivity

	public class MainActivity extends AppCompatActivity {

    private TabLayout tab;
    private ViewPager pager;
    private ArrayList<String> tabs;
    private ArrayList<Fragment> frag;
     /**
       * @explain
       * @author Administrator.
       * @time 2019/01/08 14:14.
       */
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //找控件
        tab = findViewById(R.id.tab);
        pager = findViewById(R.id.pager);
        //页卡设置
        tabs = new ArrayList<>();
        tabs.add("tab1");
        tabs.add("tab2");
        tabs.add("tab3");
        //设置模式
        tab.setTabMode(TabLayout.MODE_FIXED);
        //给TabLayout添加数据
        tab.addTab(tab.newTab().setTag(tabs.get(0)));
        tab.addTab(tab.newTab().setTag(tabs.get(1)));
        tab.addTab(tab.newTab().setTag(tabs.get(2)));
        //viewpager数据
        frag = new ArrayList<>();
        frag.add(new Frag01());
        frag.add(new Frag02());
        frag.add(new Frag03());
        //创建viewpager适配器
        MyViewpagerAdapter adapter = new MyViewpagerAdapter(getSupportFragmentManager(),frag,tabs);
        pager.setAdapter(adapter);
        //TabLayout关联ViewPager
        tab.setupWithViewPager(pager);
    }
}

ViewPager适配器

public class MyViewpagerAdapter extends FragmentPagerAdapter {
    ArrayList<Fragment> frag;
    ArrayList<String> tabs;

    public MyViewpagerAdapter(FragmentManager supportFragmentManager, ArrayList<Fragment> frag, ArrayList<String> tabs) {
        super(supportFragmentManager);
        this.frag = frag;
        this.tabs = tabs;
    }

    @Override
    public int getCount() {
        return frag.size();
    }

    @Override
    public Fragment getItem(int i) {
        return frag.get(i);
    }
    //设置页面标题
    @Nullable
    @Override
    public CharSequence getPageTitle(int position) {
        return tabs.get(position);
    }
}

猜你喜欢

转载自blog.csdn.net/weixin_44305652/article/details/86074688
今日推荐