如何更改TabLayout中所选标签的标题颜色?

问题描述:

我想在TabLayout中的图标后面更改此区域的颜色,只有带图标的一行。我也需要在标题下改变这条粉红线,但我无法在风格中找到合适的参数。我的风格:如何更改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

对于选项卡背景色,营造selector,并把该选择的资源ID,如:

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

对于粉红色下划线,改变颜色

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

尝试这种使用下列标签布局的财产

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 

添加属性附加伤害的XML:

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

并在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> 

试试这个

  • 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" /> 


创建 bg_color
  • 并在layout添加此类似这样的

<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" />