Unable to see Tab Indicator in TabLayout design support library

You can use below methods

1 Change in xml app:tabIndicatorColor="" set your indicator color

2 creating costume theme

<style name="AppTheme.TabStyle" parent="Widget.Design.TabLayout">
        <item name="tabTextAppearance">@style/AppTheme.TextStyle</item>
        <item name="tabTextColor">@color/primaryDark</item>
        <item name="tabSelectedTextColor">@color/white</item>
        <item name="tabIndicatorColor">@color/primaryDark</item>
        <item name="tabIndicatorHeight">3dp</item>
        <item name="android:background">?attr/colorPrimary</item>
    </style>

    <style name="AppTheme.TextStyle" parent="TextAppearance.Design.Tab">
        <item name="android:textSize">14sp</item>
        <item name="textAllCaps">true</item>
    </style>

set theme in your Tablayout


I think it's bug on Design Support library. that When You apply both property at the same time

app:tabBackground="@color/tab_bg"
app:tabIndicatorColor="@color/tab_indicator"

the background color overlap the tab indicator. that's why the tab indicator is not visible.

If you remove tabBackground color property then you can see the indicator.

[Update on 25-06-2015]

As I said it's bug on Design Support library. I reported it to android bug source. here is the refrence https://code.google.com/p/android/issues/detail?id=176540.

So status for this is issue is FutureRelease so bug is fixed. And it will come in future library.

[Update 20-07-2015]

The bug is fixed and Released in v 22.2.1. you can also check it on above link.