tabindicator is not sliding from one to another tab in tablayout when I swipe between fragments. Highlighting of font is also not changing

Question

public class LoginRegister extends AppCompatActivity implements SignUpFragment.OnFragmentInteractionListener ,SignInFragment.OnFragmentInteractionListener{
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_login_register);
    final TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout_signup);
    tabLayout.addTab(tabLayout.newTab().setText("Sign Up"));
    tabLayout.addTab(tabLayout.newTab().setText("Sign in"));
    tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);        
    final ViewPager pager =(ViewPager) findViewById(R.id.loginpager);
    final SigninPagerAdapter adapter = new SigninPagerAdapter(getSupportFragmentManager(),tabLayout.getTabCount());
    pager.setAdapter(adapter);
    tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
        @Override
        public void onTabSelected(TabLayout.Tab tab) {
            pager.setCurrentItem(tab.getPosition());
        }
        @Override
        public void onTabUnselected(TabLayout.Tab tab) {
}
        @Override
        public void onTabReselected(TabLayout.Tab tab) {
        }
    });

when I slide through fragments, the highlights of the tab does not changes, But it works fine when I touch the tabs.When I touch them, the tab indicator slides well from left to right and font color of tabs also looks highlighted. I think Problem is in this piece of code

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

        @Override
        public void onPageSelected(int position) {


        }

        @Override
        public void onPageScrollStateChanged(int state) {

        }
    });

}


@Override
public void onFragmentInteraction(Uri uri) {

}
}

What should I do to Highlight current tab...

Hispaniola

Answer 1

I found my solution.

tabLayout.setupWithViewPager(pager);

this method sets everything easily.

Hispaniola

Answer 2

Just an additional note.

Best thing to do is call tabLayout.setupWithViewPager(viewPager) last.

At least, don't call viewPager.clearOnPageChangeListeners() or viewPager.setOnPageChangeListener() right after you called tabLayout.setupWithViewPager(viewPager) because that will remove the listener that TabLayout uses when the ViewPager is scrolled.

Upsydaisy

Answer 3

You shouldn't addTab() on your tablayout because you've already set up a view pager adapter

Do the following and it should work fine

public class LoginRegister extends AppCompatActivity implements SignUpFragment.OnFragmentInteractionListener ,SignInFragment.OnFragmentInteractionListener {
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_login_register);

    final SigninPagerAdapter adapter = new SigninPagerAdapter(getSupportFragmentManager());

    final ViewPager pager = (ViewPager) findViewById(R.id.loginpager);
    pager.setAdapter(adapter);

    final TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout_signup);
    tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
    tabLayout.setupWithViewPager(pager);

    }
}

And SignInPagerAdapter

public class SigninPagerAdapter extends FragmentStatePagerAdapter {

    public SectionsPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {

        switch (position) {
        case 0: 
            return SingnUpFragment.newInstance()
        case 1: 
            return SignInFragment.newInstance()
        default:
            return null;
        }
    }

    @Override
    public int getCount() {
        //return the number of tabs you want in your tabLayout
        return 2;
    }


    @Override
    public CharSequence getPageTitle(int position) {
        //this is where you set the titles
        switch(position) {
            case 0: 
                return "Sign Up";
            case 1:
                return "Sign In";
        }
        return null;
    }

Kilmarx

when I removed addTab(), the titles of the tabs also got removed. – Hispaniola

Take a look at the adapter code. Did you override getPageTitle in your adapter? That's where you set the titles – Kilmarx

Yes, getpagetitle is overridden there,but still titles are not visible – Hispaniola

Apologies, seems i've forgotten to set up the viewpager with the tablayout. Add tabLayout.setupWithViewPager(pager) just below setTabGravity. I've edited the code, take a look – Kilmarx

Answer 4

To change the color of selected and unselected tab. Use the following code in your LoginRegister.java file:

//tabLayout.setTabTextColors(unselectedTabColor, selectedTabColor)
        tabLayout.setTabTextColors(Color.parseColor("#627179"), Color.parseColor("#BF4A32"));

Domini

Answer 5

Try add this in yout code:

 mTabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
        @Override
        public void onTabSelected(TabLayout.Tab tab) {

            //THIS!!
            if (mViewPager != null) {
                mViewPager.setCurrentItem(tab.getPosition());

            }
        }

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

        }

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

        }
    });

It solved my problem.

Castaneda