TabLayout not displaying tab title on Marshmallow

Question

I'm having a strange issue with the titles of my tabs not showing up when I test my app on a marshmallow device. When I test it on all other devices, the titles show up just fine. While debugging, the device hits all of the same points including the the "getPageTitle" method inside my adapter. I've read through many tutorials for using android's TabLayout and ViewPager, just to make absolutely certain I'm not missing anything, and from what I can tell, I am not doing anything wrong.

Here is the code in my main activity,

// setup viewPager
final ViewPager viewPager = (ViewPager) findViewById(R.id.viewPager);
setupViewPager(viewPager);

// setup tabLayout
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabLayout);
tabLayout.setupWithViewPager(viewPager);
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));

my setUpViewPager() method,

private void setupViewPager(ViewPager viewPager) {
    ViewPagerAdapter adapter = new ViewPagerAdapter(getFragmentManager());
    viewPager.setAdapter(adapter);
}

and my adapter class which extends FragmentPagerAdapter

private class ViewPagerAdapter extends FragmentPagerAdapter {
    private static final int NUM_FRAGMENTS = 2;

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

    @Override
    public Fragment getItem(int position) {
        switch (position) {
            case 0: return AllFeaturesFragment.newInstance();
            case 1: return CategoriesFragment.newInstance();
        }
        return null;
    }

    @Override
    public CharSequence getPageTitle(int position) {
        switch (position) {
            case 0: return "All Features";
            case 1: return "Categories";
        }
        return null;
    }

    @Override
    public int getCount() {
        return NUM_FRAGMENTS;
    }
}

Any help is greatly appreciated!

EDIT

It never occurred to me to check the xml file for the answer, but I was using a style on the TabLayout element whose parent style was "Widget.AppCompat.Toolbar". For some reason this style made the titles invisible on marshmallow devices and none others. All I had to do was remove the style and it worked fine!

Try to give some other tabtextcolor to your tablayout.It might help. — Dhruvi, Jul 21 '16 at 18:37

score 5 · Accepted Answer · answered Sep 05 '16 at 09:34

I was also facing the same issue. The issue is there is some issue in support library when you hardcode the tab tiles inside pager adapter. I changed the pager adapter like this

 class ViewPagerAdapter extends FragmentPagerAdapter {
    private final List<Fragment> mFragmentList = new ArrayList<>();
    private final List<String> mFragmentTitleList = new ArrayList<>();

    public ViewPagerAdapter(FragmentManager manager) {
        super(manager);
    }

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

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

    public void addFragment(Fragment fragment, String title) {
        mFragmentList.add(fragment);
        mFragmentTitleList.add(title);
    }

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

then you can add the fragment in activity like this

public class MainActivity extends AppCompatActivity {

private Toolbar toolbar;
private TabLayout tabLayout;
private ViewPager viewPager;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);

    getSupportActionBar().setDisplayHomeAsUpEnabled(true);

    viewPager = (ViewPager) findViewById(R.id.viewpager);
    setupViewPager(viewPager);

    tabLayout = (TabLayout) findViewById(R.id.tabs);
    tabLayout.setupWithViewPager(viewPager);
}

private void setupViewPager(ViewPager viewPager) {
    ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
    adapter.addFragment(new OneFragment(), "ONE");
    adapter.addFragment(new TwoFragment(), "TWO");
    adapter.addFragment(new ThreeFragment(), "THREE");
    viewPager.setAdapter(adapter);
}
}

Using this approach, I lost the Icon and now I have the title. I need both Icons and Title — Neon Warge, Feb 07 '17 at 04:17

score 3 · Answer 2 · edited Jan 25 '17 at 10:27

3

replace

tabLayout.setupWithViewPager(viewPager);

with

viewPager.addOnPageChangeListener(
    new TabLayout.TabLayoutOnPageChangeListener(tabLayout)
);

edited Jan 25 '17 at 10:27

CroMagnon

1,218
7
20
32

answered Jan 25 '17 at 09:02

Makvin

3,475
27
26

Can you explain? why is that? – Neon Warge Feb 07 '17 at 04:16

TabLayout not displaying tab title on Marshmallow

2 Answers2

Linked