更改标签指示符背景（适用于所有标签布局视图）

Question

I have a question which I can't find an answer to and really have to solve. I am trying to change the background for the tab layout indicator but JUST FOR IT, ie if the entire tablayout is green and the tablayoutindicator height is 4dp I want the ENTIRE bottom 4dp of the tablayoutview will be in another color (lets say red) is that possible? Before you answer please note I'm not talking about app:tabIndicatorColor property but on the entire height of the tabIndicator (regardless of the tabIndicator itself).

For example, on the attached image the app:tabIndicatorColor is white but the background of it is black while the entire view is a gardient of blue.

Edit - I managed to do it using a FrameLayout having the bottom view in black while the tablayout is above it with its properties, I'm still looking for a more "clean" way to achieve the same thing

Answer 1

To achieve what you are looking for you can try the following

Create a selector tab_layout_selector

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_selected="false" android:state_pressed="false">

    <layer-list>

        <!-- Stripe bottom indicator color -->
        <item android:top="-5dp" android:left="-5dp" android:right="-5dp">
            <shape android:shape="rectangle">
                <stroke android:color="@color/red" android:width="4dp"/>
            </shape>
        </item>

    </layer-list>

</item>

</selector>

Finally, in your TabLayout add

 <android.support.design.widget.TabLayout


    <!-- Whole tab background -->
    android:background="@color/white"

    <!-- Line color -->
    android:tabBackground="@drawable/tab_layout_selector"

    .... Others....
    />