2017-10-04 4 views
1

Je veux changer une couleur de cette zone derrière les icônes de TabLayout, seulement une ligne avec des icônes. J'ai également besoin de changer cette ligne rose sous le titre, mais je ne peux pas trouver les paramètres appropriés au style. Mon style:Comment changer la couleur du titre de l'onglet sélectionné sur TabLayout?

<style name="AppTabLayout" parent="Widget.Design.TabLayout"> 
    <item name="tabIndicatorColor">?attr/colorAccent</item> 
    <item name="tabIndicatorHeight">4dp</item> 
    <item name="tabPaddingStart">6dp</item> 
    <item name="tabPaddingEnd">6dp</item> 
    <item name="tabBackground">?attr/selectableItemBackground</item> 
    <item name="tabTextAppearance">@style/AppTabTextAppearance</item> 
    <item name="tabSelectedTextColor">@color/darkPurple</item> 
    </style> 

    <!-- for text --> 
    <style name="AppTabTextAppearance" parent="TextAppearance.Design.Tab"> 
    <item name="android:textSize">12sp</item> 
    <item name="android:textColor">@color/orange</item> 
    <item name="textAllCaps">false</item> 
    </style> 

screenshot

Répondre

1

Pour la couleur d'arrière-plan de l'onglet, créer une selector et mettre des ressources de ce sélecteur ID comme:

<item name="tabBackground">@drawable/selector_name</item>.

Pour le soulignement rose, changer la couleur

<item name="tabIndicatorColor">@color/your_new_color</item>

1

essayer cette suite à l'utilisation des biens de l'onglet de mise en page

app:tabIndicatorColor="@color/colorBlack"// it set Selected tab underline color 
app:tabSelectedTextColor="@color/colorPrimary"// it set Selected tab text color 
app:tabTextColor="@color/colorAccent"// it set tab text color 
1

Ajouter atribute en xml:

<android.support.design.widget.TabLayout 
    .... 
    app:tabBackground="@drawable/tab_color_selector" 
    ... 
    /> 

Et créer dans un dossier drawable, tab_color_selector.xml

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:drawable="@color/tab_background_selected" android:state_selected="true"/> 
    <item android:drawable="@color/tab_background_unselected"/> 
</selector> 
0

essayer cette

  • Créer bg_color dans votre drawable folder

<selector xmlns:android="http://schemas.android.com/apk/res/android"> 

<!-- Non focused states --> 
<item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/timecard" 
    android:color="@color/colorText" /> 
<item android:state_focused="false" android:state_selected="true" android:state_pressed="false" android:drawable="@drawable/timecard_selected" 
    android:color="@color/colorSkyBlue"/> 

<!-- Focused states --> 
<item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/timecard" 
    android:color="@color/colorText"/> 
<item android:state_focused="true" android:state_selected="true" android:state_pressed="false" android:drawable="@drawable/timecard_selected" 
    android:color="@color/colorSkyBlue"/> 

<!-- Pressed --> 
<item android:state_selected="true" android:state_pressed="true" android:drawable="@drawable/timecard" 
    android:color="@color/colorText"/> 
<item android:state_pressed="true" android:drawable="@drawable/timecard_selected" 
    android:color="@color/colorSkyBlue" /> 


  • et ajoutez dans votre layout comme celui-ci

<android.support.design.widget.TabLayout 
      android:id="@+id/tabs" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:padding="0dp" 
      android:tabStripEnabled="false" 
      app:tabIndicatorHeight="0dp" 
      android:fitsSystemWindows="true" 
      app:tabContentStart="0dp" 
      app:tabBackground="@drawable/bg_color" 
      app:tabPaddingStart="0dp" 
      android:paddingLeft="0dp" 
      app:tabPaddingEnd="0dp" 
      app:paddingEnd="0dp" 
      android:layout_gravity="center_vertical" 
      app:tabIndicatorColor="@color/colorSkyBlue" 
      android:paddingRight="0dp" 
      app:tabSelectedTextColor="@color/colorSkyBlue" />