Tab hi-light will not change when swiping between fragments in viewPager

Question

I am implementing A view pager with Tab navigation in the action bar and am having a problem when swiping the screen vs. touching the tabs to navigate through the fragments. Originally the tabs are highlighted when their corresponding fragment is visible. When I click on an unhilighted tab to navigate,the highlight changes correctly and so does the fragment. But when I swipe the screen to switch fragments, the highlighting remains over the last tab. Ideally the hilighting woud switch when the screen is swiped as well as when the tab is touched.

in MainActivity setting up action bar

final ActionBar actionBar = getActionBar();
     actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
     ActionBar.TabListener tabListener = new ActionBar.TabListener() {
            @Override
            public void onTabReselected(Tab tab, FragmentTransaction arg1) {

            }

            @Override
            public void onTabSelected(Tab tab, FragmentTransaction arg1) {
                // TODO Auto-generated method stub
                ViewPager mViewPager = (ViewPager)findViewById(R.id.viewpager);
                mViewPager.setCurrentItem(tab.getPosition());
            }

            @Override
            public void onTabUnselected(Tab arg0, FragmentTransaction arg1) {
                // TODO Auto-generated method stub

            }
        };
        for (int i = 0; i < 3; i++) {
            actionBar.addTab(
                    actionBar.newTab()
                            .setText("Tab " + (i + 1))
                            .setTabListener(tabListener));
        }

in MainActivity onCreateOptionsMenu

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main, menu);
    return true;
}

initialize paging in MainActivity

public void initializePaging(){

     List<Fragment> fragments = new Vector<Fragment>();

     fragments.add(TextPageFragment.newInstance(text_data_list));
     fragments.add(ImagePageFragment.newInstance(image_data_list));
     fragments.add(BothPageFragment.newInstance(item_list));

     this.mPagerAdapter  = new PagerAdapter1(super.getSupportFragmentManager(), fragments);

     ViewPager pager = (ViewPager)super.findViewById(R.id.viewpager);
        pager.setAdapter(this.mPagerAdapter);
}

adapter extends fragment adapter

private List<Fragment> fragments;


public PagerAdapter1(android.support.v4.app.FragmentManager fm, List<Fragment> fragments){
    super(fm);
    this.fragments = fragments;
}


@Override
public Fragment getItem(int position) {
    return this.fragments.get(position);
}


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

@Override
public float getPageWidth(int position){
    float wid = (float) 1;
    return wid;
}

}

i cant really figure it out or find where to look for the problem..

Answer 1

You didn't add a OnPageChangedListener to your ViewPager. Try adding the following in initializePaging:

    pager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
        @Override
        public void onPageSelected(int position) {
            actionBar.setSelectedNavigationItem(position);
        }
    });