Come si modifica lo stile di testo di una scheda selezionata quando si utilizza tabLayout?

Question

Desidero rendere il testo di una scheda selezionata in grassetto. Come posso farlo tramite codice xml o java, qualunque cosa sia più facile.

Answer 1

C'è un modo per aggiungere grassetto programmazione utilizzando un CustomView Tab, il caricamento di un TextView in quella CustomView e applicando lo styling sul TextView:

private TabLayout mTabLayout; 
protected void onCreate(Bundle savedInstanceState) { 
    ... 
    mTabLayout = (TabLayout) findViewById(R.id.tablayout); 
    mTabLayout.setOnTabSelectedListener(new OnTabSelectedListener()); 
    int tabCount = mTabLayout.getTabCount(); 
    for (int i = 0; i < tabCount; i++) { 
     TabLayout.Tab tab = mTabLayout.getTabAt(i); 
     if (tab != null) { 
      TextView tabTextView = 
       (TextView) LayoutInflater.from(this).inflate(R.layout.tab_item, mTabLayout, false); 
      tabTextView.setText(tab.getText()); 
      // First tab is the selected tab, so if i==0 then set Tabs_Selected style 
      tabTextView.setTextAppearance(getAppContext(), i == 0 ? R.style.TextAppearance_Tabs_Selected 
               : R.style.TextAppearance_Tabs); 
      tab.setCustomView(tabTextView); 
     } 
    } 
} 
class OnTabSelectedListener implements TabLayout.OnTabSelectedListener { 

    public void onTabSelected(TabLayout.Tab selectedTab) { 
     int tabCount = mTabLayout.getTabCount(); 
     for (int i = 0; i < tabCount; i++) { 
      TabLayout.Tab tab = mTabLayout.getTabAt(i); 
      View tabView = tab != null ? tab.getCustomView() : null; 
      if (tabView instanceof TextView) { 
       ((TextView) tabView).setTextAppearance(getAppContext(), selectedTab.equals(tab) 
                  ? R.style.TextAppearance_Tabs_Selected 
                  : R.style.TextAppearance_Tabs); 
      } 
     } 
    } 

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

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

Ed ecco le voci in styles.xml:

<style name="TextAppearance.Tabs" parent="TextAppearance.Design.Tab"> 
    <item name="android:textSize">12sp</item> 
    <item name="android:textColor">@android:color/white</item> 
</style> 

<style name="TextAppearance.Tabs.Selected"> 
    <item name="android:textStyle">bold</item> 
</style> 

E qui è il tab_item di layout:

<?xml version="1.0" encoding="utf-8"?> 
<TextView 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/tab_textview" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    tools:text="Tab 1" /> 

Answer 2

ho cambiato la risposta suggerita sopra un po 'e funziona benissimo per me, senza bisogno di ulteriori file .xml, spero che possa essere d'aiuto.

for (int i = 0; i < tabLayout.getTabCount(); i++) { 

    TabLayout.Tab tab = tabLayout.getTabAt(i); 
    if (tab != null) { 

     TextView tabTextView = new TextView(this); 
     tab.setCustomView(tabTextView); 

     tabTextView.getLayoutParams().width = ViewGroup.LayoutParams.WRAP_CONTENT; 
     tabTextView.getLayoutParams().height = ViewGroup.LayoutParams.WRAP_CONTENT; 

     tabTextView.setText(tab.getText()); 

     // First tab is the selected tab, so if i==0 then set BOLD typeface 
     if (i == 0) { 
      tabTextView.setTypeface(null, Typeface.BOLD); 
     } 

    } 

} 

tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() { 

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

     TextView text = (TextView) tab.getCustomView(); 

     text.setTypeface(null, Typeface.BOLD); 
    } 

    @Override 
    public void onTabUnselected(TabLayout.Tab tab) { 
     TextView text = (TextView) tab.getCustomView(); 

     text.setTypeface(null, Typeface.NORMAL); 
    } 

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

    } 

}); 

Answer 3

Se si utilizza di default TabLayout (non CustomView), è possibile ottenere TextView della scheda utilizzando il metodo getChildAt().

.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() { 
     @Override 
     public void onTabSelected(TabLayout.Tab tab) { 
      LinearLayout tabLayout = (LinearLayout)((ViewGroup) mMainTabs.getChildAt(0)).getChildAt(tab.getPosition()); 
      TextView tabTextView = (TextView) tabLayout.getChildAt(1); 
      tabTextView.setTypeface(tabTextView.getTypeface(), Typeface.BOLD); 
     } 

     @Override 
     public void onTabUnselected(TabLayout.Tab tab) { 
      LinearLayout tabLayout = (LinearLayout)((ViewGroup) mMainTabs.getChildAt(0)).getChildAt(tab.getPosition()); 
      TextView tabTextView = (TextView) tabLayout.getChildAt(1); 
      tabTextView.setTypeface(tabTextView.getTypeface(), Typeface.NORMAL); 
     } 

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