使用TabLayout 实现 bottom Tab布局

public class MainActy extends BaseActivity {

    @BindView(R.id.pager)
    ViewPager pager;

    MyPageAdapter pAdapter;

    @BindView(R.id.mTabLayout)
    TabLayout mTabLayout;

    List lists = new ArrayList();

    String[] mTitles = {"首页", "通讯录", "统计", "我"};

    @BindColor(R.color.home_tab_text)
    int home_tab_text;

    @BindColor(R.color.colorPrimaryDark)
    int colorPrimaryDark;

    int[] draWbles = {R.drawable.home_sy, R.drawable.home_txl, R.drawable.home_tj, R.drawable.home_me};
    int[] draWbleSelects = {R.drawable.home_sy_select,
            R.drawable.home_txl, R.drawable.home_tj, R.drawable.home_me_select};

    @Override
    public int initResource() {
        return R.layout.acty_main;
    }


    @Override
    protected void initView() {

        lists.add(new HomeFragment());
        lists.add(new ContactFragment());
        lists.add(new ProfileFragment());
        lists.add(new MeFragment());

        pAdapter = new MyPageAdapter(getSupportFragmentManager(), lists, mTitles);
        pager.setAdapter(pAdapter);
        pager.setOffscreenPageLimit(4);//保存四个页面

        initBottomTab();

        pager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                resetBottomTab(position);
            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });


        mTabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                int position = tab.getPosition();
                resetBottomTab(position);
                if (pager.getCurrentItem() != position) {
                    pager.setCurrentItem(position);
                }
            }

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

            }

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

            }
        });
        resetBottomTab(0);
    }

    /**
     * 初始化tab
     */
    private void initBottomTab() {
        int i = 0;
        for (String str : mTitles) {
            View view = LayoutInflater.from(this).inflate(R.layout.icon_layout, null);
            TextView tv = (TextView) view.findViewById(R.id.title);
            ImageView imageView = (ImageView) view.findViewById(R.id.img);
            tv.setText(str);
            tv.setTextColor(home_tab_text);
            imageView.setImageResource(draWbles[i]);
            mTabLayout.addTab(mTabLayout.newTab().setCustomView(view));
            i++;
        }
    }

    /**
     * 调整tab
     */
    private void resetBottomTab(int positon) {

        for (int i = 0; i < mTabLayout.getTabCount(); i++) {
            TabLayout.Tab tabIndex = mTabLayout.getTabAt(i);
            View view = tabIndex.getCustomView();
            TextView tv = (TextView) view.findViewById(R.id.title);
            ImageView imageView = (ImageView) view.findViewById(R.id.img);
            tv.setTextColor(home_tab_text);
            imageView.setImageResource(draWbles[i]);
        }

        TabLayout.Tab tab = mTabLayout.getTabAt(positon);
        View view = tab.getCustomView();
        TextView tv = (TextView) view.findViewById(R.id.title);
        ImageView imageView = (ImageView) view.findViewById(R.id.img);
        tv.setTextColor(colorPrimaryDark);
        imageView.setImageResource(draWbleSelects[position]);
    }

布局文件 icon_layout.xml





 

  

布局文件 acty_main.xml

 

你可能感兴趣的:(使用TabLayout 实现 bottom Tab布局)