TabLayout与ViewPager实现顶部导航栏

最新推荐文章于 2024-07-26 21:24:56 发布

原创最新推荐文章于 2024-07-26 21:24:56 发布 · 985 阅读

2 ·

CC 4.0 BY-SA版权

本文介绍如何在Android应用中实现TabLayout与ViewPager组件的结合使用，并通过具体代码示例展示了如何配置布局、创建适配器及管理多个Fragment。特别强调了适配器的实现方法及其在Fragment间的切换。

布局；

<?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:background="#F87C67"
    android:orientation="vertical">

    <android.support.design.widget.TabLayout
        android:id="@+id/tab"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#ffffff"        //背景色
        app:tabIndicatorColor="#03A9F4"     //选中时横线颜色
        app:tabIndicatorHeight="5px"        //文字下面横线的高度
        app:tabSelectedTextColor="#03A9F4"  //选中时字体颜色
        app:tabTextColor="#999999" />       //未选中时字体颜色

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

viewPager适配器

package example.com.quarterhour.adapter;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

import java.util.ArrayList;
import java.util.List;

public class TitleFragmentPagerAdapter extends FragmentPagerAdapter {
  
    /** 
     * The m fragment list. 
     */  
    private List<Fragment> mFragmentList = null;
  
    private String[] titles;  
  
    /** 
     * Instantiates a new ab fragment pager adapter. 
     * 
     * @param mFragmentManager the m fragment manager 
     * @param fragmentList     the fragment list 
     */  
    public TitleFragmentPagerAdapter(FragmentManager mFragmentManager, ArrayList<Fragment> fragmentList) {
        super(mFragmentManager);  
        mFragmentList = fragmentList;  
    }  
  
    /** 
     * titles是给TabLayout设置title用的 
     * 
     * @param mFragmentManager 
     * @param fragmentList 
     * @param titles 
     */  
    public TitleFragmentPagerAdapter(FragmentManager mFragmentManager, List<Fragment> fragmentList, String[] titles) {
        super(mFragmentManager);  
        mFragmentList = fragmentList;  
        this.titles = titles;  
    }  
  
    /** 
     * 描述：获取数量. 
     * 
     * @return the count 
     * @see android.support.v4.view.PagerAdapter#getCount() 
     */  
    @Override  
    public int getCount() {  
        return mFragmentList.size();  
    }  
  
    /** 
     * 描述：获取索引位置的Fragment. 
     * 
     * @param position the position 
     * @return the item 
     * @see android.support.v4.app.FragmentPagerAdapter#getItem(int)
     */  
    @Override  
    public Fragment getItem(int position) {
  
        Fragment fragment = null;
        if (position < mFragmentList.size()) {  
            fragment = mFragmentList.get(position);  
        } else {  
            fragment = mFragmentList.get(0);  
        }  
        return fragment;  
    }  
  
    @Override  
    public CharSequence getPageTitle(int position) {  
        if (titles != null && titles.length > 0)  
            return titles[position];  
        return null;  
    }  
}

fragment中的使用；
public class Referrals extends Fragment {
    private View view;
    private TabLayout tab;
    private ViewPager viewpager;
    private String[] titles = new String[]{"热门", "关注"};

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.referrals, container, false);
        initView(view);
        return view;
    }

    private void initView(View view) {
        tab = (TabLayout) view.findViewById(R.id.tab);
        viewpager = (ViewPager) view.findViewById(R.id.viewpager);
        List<Fragment> fragments = new ArrayList<>();
        fragments.add(new HotFragment());
        fragments.add(new FocusFragment());
        TitleFragmentPagerAdapter adapter = new TitleFragmentPagerAdapter(getFragmentManager(), fragments, titles);
        viewpager.setAdapter(adapter);
        tab.setupWithViewPager(viewpager);
    }

}

注意；fragments的大小要与titles大小一样，在Activity中使用把getFragmentManager()改成getSupportFragmentManager()；