【Android -- Material Design】TabLayout 的基本使用

一、前言

官网：TabLayout 提供一个水平方向的布局来显示 Tabs，继承的是HorizontalScrollView 这个类。

二、属性 属性含义tabBackground设置Tabs的背景tabGravity为Tabs设置GravitytabIndicatorColor设置指示器的颜色tabIndicatorHeight设置指示器的高度，规范建议是2dptabMaxWidth设置 Tab 的最大宽度tabMinWidth设置 Tab 的最小宽度tabMode设置Tabs的显示模式tabSelectedTextColor设置Tab选中后，文字显示的颜色tabTextColor设置Tab未选中，文字显示的颜色 三、基础使用

1. 简单使用

• 效果图

• 布局文件

• java 代码

public class BFragment extends BaseFragment {
    @BindView(R.id.tabLayout)
    TabLayout mTabLayout;

    @Override
    protected int layoutId() {
        return R.layout.fragment_b;
    }

    @Override
    protected void initView(View view) {
        mTabLayout.addTab(mTabLayout.newTab().setText("个性推荐"));
        mTabLayout.addTab(mTabLayout.newTab().setText("歌单"));
        mTabLayout.addTab(mTabLayout.newTab().setText("主播电台"));
        mTabLayout.addTab(mTabLayout.newTab().setText("排行榜"));
    }


    @Override
    protected void initData() {

    }
}

2. 带 icon 的导航栏

• 效果图

• 布局文件

3. Tab 选中监听 Tab 切换的时候，我们需要切换页面的内容，这时候就需要为它设置一个监听器 TabLayout.OnTabSelectedListener，如下：

 mTabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                Log.i(TAG,"onTabSelected:"+tab.getText());
            }

            @Override
            public void onTabUnselected(TabLayout.Tab tab) {

            }

            @Override
            public void onTabReselected(TabLayout.Tab tab) {

            }
        });

四、实例 结合使用 TabLayout + ViewPager + Fragment

1. 布局文件

    
        18sp
        bold
    

2. MainActivity.java

public class MainActivity extends BaseActivity {
    @BindView(R.id.tab_layout)
    TabLayout mTabLayout;

    @BindView(R.id.viewPager)
    ViewPager mViewPager;

    private List mTitles = new ArrayList();

    private List mFragments = new ArrayList();

    private HomeFragment mHomeFragment = HomeFragmentFactory.getInstance().getHomeFragment();
    private OrderFragment mOrderFragment = HomeFragmentFactory.getInstance().getOrderFragment();
    private NoticeFragment mNoticeFragment = HomeFragmentFactory.getInstance().getNoticeFragment();
    private MineFragment mMineFragment = HomeFragmentFactory.getInstance().getMineFragment();

    private HomeAdapter mAdapter;

    @Override
    public int getLayoutId() {
        return R.layout.activity_main;
    }

    @Override
    public void initView() {
        mTitles.add("首页");
        mTitles.add("工单");
        mTitles.add("通知");
        mTitles.add("我的");

        mFragments.add(mHomeFragment);
        mFragments.add(mOrderFragment);
        mFragments.add(mNoticeFragment);
        mFragments.add(mMineFragment);

        mAdapter = new HomeAdapter(getSupportFragmentManager(),mTitles,mFragments);

        mViewPager.setAdapter(mAdapter);

        mTabLayout.setupWithViewPager(mViewPager);
        mTabLayout.setTabsFromPagerAdapter(mAdapter);
    }
}

3. BaseFragment.java

public abstract class BaseFragment extends Fragment {
    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(layoutId(),container,false);
        ButterKnife.bind(this,view);
        initData();
        initView(view);
        return view;

    }

    /**
     * 初始化布局
     * @return 布局id
     */
    protected abstract int layoutId();

    /**
     * 初始化控件
     * @param view 布局view
     */
    protected abstract void initView(View view);

    /**
     * 初始化，绑定数据
     */
    protected abstract void initData();

    /**
     * 不带参数的跳转
     *
     * @param clazz 跳转到的目标类
     */
    protected void readyGo(final Class clazz) {
        Intent intent = new Intent(getActivity(), clazz);
        startActivity(intent);
    }

    /**
     * 带参数的跳转
     *
     * @param clazz  跳转到的目标类
     * @param bundle 参数
     */
    protected void readyGo(final Class clazz, final Bundle bundle) {
        Intent intent = new Intent(getActivity(), clazz);
        if (bundle != null) {
            intent.putExtras(bundle);
        }
        startActivity(intent);
    }

    /**
     * 跳转且返回结果
     *
     * @param clazz       跳转到的目标类
     * @param requestCode 请求码
     */
    protected void readyGoForResult(final Class clazz, final int requestCode) {
        Intent intent = new Intent(getActivity(), clazz);
        startActivityForResult(intent, requestCode);
    }

    /**
     * 带参数跳转且返回结果
     *
     * @param clazz       跳转到的目标类
     * @param requestCode 请求码
     * @param bundle      参数
     */
    protected void readyGoForResult(final Class clazz, final int requestCode, final Bundle bundle) {
        Intent intent = new Intent(getActivity(), clazz);
        if (bundle != null) {
            intent.putExtras(bundle);
        }
        startActivityForResult(intent, requestCode);
    }

    @Override
    public void onDestroy() {
        super.onDestroy();
    }
}

4. HomeFragment.java

public class HomeFragment extends BaseFragment {

    @Override
    protected int layoutId() {
        return R.layout.fragment_home;
    }

    @Override
    protected void initView(View view) {

    }

    @Override
    protected void initData() {

    }
}

5. HomeFragmentFactory.java

public class HomeFragmentFactory {
    static HomeFragmentFactory mInstance;
    private HomeFragment mHomeFragment;
    private OrderFragment mOrderFragment;
    private NoticeFragment mNoticeFragment;
    private MineFragment mMineFragment;


    public HomeFragmentFactory() {
    }

    public static HomeFragmentFactory getInstance() {
        if (mInstance == null) {
            synchronized (HomeFragmentFactory.class) {
                if (mInstance == null) {
                    mInstance = new HomeFragmentFactory();
                }
            }
        }
        return mInstance;
    }

    /**
     * 首页
     *
     * @return
     */
    public HomeFragment getHomeFragment() {
        if (mHomeFragment == null) {
            synchronized (HomeFragment.class) {
                if (mHomeFragment == null) {
                    mHomeFragment = new HomeFragment();
                }
            }
        }
        return mHomeFragment;
    }

    /**
     * 工单
     *
     * @return
     */
    public OrderFragment getOrderFragment() {
        if (mOrderFragment == null) {
            synchronized (OrderFragment.class) {
                if (mOrderFragment == null) {
                    mOrderFragment = new OrderFragment();
                }
            }
        }
        return mOrderFragment;
    }

    /**
     * 通知
     *
     * @return
     */
    public NoticeFragment getNoticeFragment() {
        if (mNoticeFragment == null) {
            synchronized (NoticeFragment.class) {
                if (mNoticeFragment == null) {
                    mNoticeFragment = new NoticeFragment();
                }
            }
        }
        return mNoticeFragment;
    }

    /**
     * 我的
     *
     * @return
     */
    public MineFragment getMineFragment() {
        if (mMineFragment == null) {
            synchronized (MineFragment.class) {
                if (mMineFragment == null) {
                    mMineFragment = new MineFragment();
                }
            }
        }
        return mMineFragment;
    }

}

6. HomeAdapter.java

public class HomeAdapter extends FragmentPagerAdapter {
    private List titleList;
    private List fragmentList;
    public HomeAdapter(@NonNull FragmentManager fm, List titleList,
                       List fragmentList) {
        super(fm);
        this.titleList = titleList;
        this.fragmentList = fragmentList;
    }

    @NonNull
    @Override
    public Fragment getItem(int position) {
        return fragmentList.get(position);
    }

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

    @Nullable
    @Override
    public CharSequence getPageTitle(int position) {
        return titleList.get(position);
    }
}

修改选中字体大小

1. 效果图 2. 布局文件

3. 代码引用并设置

private void initTabView() {
        holder = null;
        for (int i = 0; i