TabLayout、ViewPager、fragment实现可滑动的顶部菜单

首先看下效果

第一步:主布局

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <android.support.v7.widget.Toolbar
        android:id="@+id/tool_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        android:theme="@style/AppTheme.ToolBar"
        app:title="@string/app_name">

    </android.support.v7.widget.Toolbar>

    <android.support.design.widget.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabMode="fixed" />

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

    </android.support.v4.view.ViewPager>
</LinearLayout>
第二步:定义四个Fragment,每个Fragment中都有个TextView,举其中一个布局代码:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent">



    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="推荐"/>

</LinearLayout>
第三步:自定义一个ViewPagerAdapter继承于FragmentStatePagerAdpater

public class ViewPagerAdapter extends FragmentStatePagerAdapter {
    private List<FragmentInfo> fragmentInfos;

    public ViewPagerAdapter(FragmentManager fm) {
        super(fm);
        initFragment();
    }

    /**
     * 初始化fragment
     */
    private void initFragment() {
        fragmentInfos = new ArrayList<>();
        fragmentInfos.add(new FragmentInfo("推荐", RecommendFragment.class));
        fragmentInfos.add(new FragmentInfo("排行", RankingFragment.class));
        fragmentInfos.add(new FragmentInfo("游戏", GamesFragment.class));
        fragmentInfos.add(new FragmentInfo("分类", CategoryFragment.class));
    }

    /**
     * 获得fragment
     * @param position
     * @return
     */
    @Override
    public Fragment getItem(int position) {
        try {
            return (Fragment) fragmentInfos.get(position).getFragment().newInstance();
        } catch (Exception e) {
            e.printStackTrace();
        }
        return null;
    }

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

    /**
     * 获取tableLayout上面的标题
     */
    @Override
    public CharSequence getPageTitle(int position) {
        return fragmentInfos.get(position).getTitle();
    }
}
第四步:定义一个常量类

public class FragmentInfo {
    public String title;
    public Class fragment;

    public FragmentInfo(String title, Class fragment) {
        this.title = title;
        this.fragment = fragment;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public Class getFragment() {
        return fragment;
    }

    public void setFragment(Class fragment) {
        this.fragment = fragment;
    }
}
第五步:主布局中将三者进行绑定

ViewPagerAdapter pagerAdapter = new ViewPagerAdapter(getSupportFragmentManager());
//viewpager设置适配器
viewPager.setAdapter(pagerAdapter);
//TableLayoutViewPager进行绑定
tabLayout.setupWithViewPager(viewPager);

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值