Testo scheda TabLayout non visualizzato

Question

Sto usando TabLayout all'interno di un Fragment per visualizzare tre schede fisse e le schede funzionano ma non mostra il testo della scheda anche dopo aver impostato l'attributo app:tabTextColor nel layout non è ancora visibile.

NewFragment.java

public class NewFragment extends Fragment { 

private RecyclerView mRecyclerView; 
private RecyclerView.LayoutManager mLayoutManager; 
private RecyclerView.Adapter mAdapter; 

@Override 
public View onCreateView(LayoutInflater inflater, ViewGroup container, 
         Bundle savedInstanceState) { 

    View inflatedView = inflater.inflate(R.layout.new_fragment, container, false); 

    TabLayout tabLayout = (TabLayout) inflatedView.findViewById(R.id.tabLayout); 
    tabLayout.addTab(tabLayout.newTab().setText("Tab 1")); 
    tabLayout.addTab(tabLayout.newTab().setText("Tab 2")); 
    tabLayout.addTab(tabLayout.newTab().setText("Tab 3")); 
    final ViewPager viewPager = (ViewPager) inflatedView.findViewById(R.id.viewpager); 

    LinearLayoutManager mLayoutManager = new LinearLayoutManager(getActivity()); 
    mLayoutManager.setOrientation(LinearLayoutManager.VERTICAL); 

    viewPager.setAdapter(new PagerAdapter(getFragmentManager(), tabLayout.getTabCount())); 
    viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout)); 
    tabLayout.setupWithViewPager(viewPager); 
    tabLayout.setTabMode(TabLayout.MODE_FIXED); 
    tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() { 

     @Override 
     public void onTabSelected(TabLayout.Tab tab) { 
      viewPager.setCurrentItem(tab.getPosition()); 
     } 

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

     } 

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

     } 
    }); 

    return inflatedView; 
} 

public class PagerAdapter extends FragmentStatePagerAdapter { 
    int mNumOfTabs; 

    public PagerAdapter(FragmentManager fm, int NumOfTabs) { 
     super(fm); 
     this.mNumOfTabs = NumOfTabs; 
    } 

    @Override 
    public Fragment getItem(int position) { 

     switch (position) { 
      case 0: 
       return new FragmentTab(); 
      case 1: 
       return new FragmentTab(); 
      case 2: 
       return new FragmentTab(); 
      default: 
       return null; 
     } 
    } 

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

newfragment.xml

<android.support.design.widget.AppBarLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
xmlns:app="http://schemas.android.com/apk/res-auto" 
tools:context=".NewFragment"> 

<android.support.design.widget.TabLayout 
    android:id="@+id/tabLayout" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    app:tabMode="fixed" 
    app:tabTextColor="#ffffff" 
    app:tabGravity="fill" 
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/> 

<android.support.v4.view.ViewPager 
    android:id="@+id/viewpager" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:background="@android:color/white"/> 

</android.support.design.widget.AppBarLayout> 

Answer 1

Il problema è che stai chiamando setupWithViewPager() dopo aver impostato le schede con le addTab() chiamate, in modo efficace sovrascriverli.

Dal documentation di TabLayout riguardo setupWithViewPager():

Le schede visualizzate in questo layout verranno popolati da titoli di pagina della scheda di ViewPager.

Se si desidera utilizzare il vostro TabLayout con un ViewPager, si dovrebbe ignorare getPageTitle() nel PagerAdapter (e rimuovere le addTab() chiamate, sono ridondanti).

Ad esempio:

public class ExamplePagerAdapter extends FragmentStatePagerAdapter { 

    // tab titles 
    private String[] tabTitles = new String[]{"Tab1", "Tab2", "Tab3"}; 

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

    // overriding getPageTitle() 
    @Override 
    public CharSequence getPageTitle(int position) { 
     return tabTitles[position]; 
    } 

    @Override 
    public Fragment getItem(int position) { 
     switch (position) { 
      case 0: 
       return new Tab1Fragment(); 
      case 1: 
       return new Tab2Fragment(); 
      case 2: 
       return new Tab3Fragment(); 
      default: 
       return null; 
     } 
    } 

    @Override 
    public int getCount() { 
     return tabTitles.length; 
    } 

    // ... 
} 

Answer 2

ho aggiunto il testo scheda e l'icona per ogni scheda dopo aver chiamato tabs.setupWithViewPager(viewPager)

viewPager.setAdapter(new MyViewAdapter(getSupportFragmentManager())); 
    TabLayout tabs=(TabLayout) findViewById(R.id.tabs); 
    tabs.setupWithViewPager(viewPager); 
    tabs.getTabAt(0).setIcon(R.drawable.icon1); 
    tabs.getTabAt(1).setIcon(R.drawable.icon2); 
    tabs.getTabAt(0).setText(getResources().getText(R.string.tab1)); 
    tabs.getTabAt(1).setText(getResources().getText(R.string.tab2));