Добавление строки ниже TabLayout

Question

У меня возникли проблемы с попыткой добавить строку ниже TabLayout, но она должна находиться за линией селектора. Должно быть что-то вроде этого:

я уже пытался добавить настраиваемое представление, но каждая вкладка имеет некоторый запас внутри, так и не получилось.

любые идеи?

Это то, что я получил прямо сейчас:

Вот его, как я буду добавлять его на XML:

<android.support.design.widget.TabLayout 
    android:id="@+id/tabs" 
    android:layout_width="match_parent" 
    android:layout_height="60dp" 
    app:tabBackground="@color/white" 
    app:tabIndicatorColor="@color/colorAccent" 
    app:tabTextColor="@color/white"/> 

и это то, что я делаю с помощью кода:

private void configureTabLayout() { 
    TabLayout.Tab tabHome = mTabLayout.newTab().setIcon(R.drawable.ic_home_cinza); 
    TabLayout.Tab tabEmprestimos = mTabLayout.newTab().setIcon(R.drawable.ic_emprestimos_cinza); 
    TabLayout.Tab tabPersonal = mTabLayout.newTab().setIcon(R.drawable.ic_usuario_cinza); 

    View root = mTabLayout.getChildAt(0); 
    if (root instanceof LinearLayout) { 
     ((LinearLayout) root).setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE); 
     GradientDrawable drawable = new GradientDrawable(); 
     drawable.setColor(getResources().getColor(R.color.silver)); 
     drawable.setSize(2, 1); 
     ((LinearLayout) root).setDividerPadding(10); 
     ((LinearLayout) root).setDividerDrawable(drawable); 
    } 

    mTabLayout.addTab(tabHome); 
    mTabLayout.addTab(tabEmprestimos); 
    mTabLayout.addTab(tabPersonal); 
    mTabLayout.setTabGravity(TabLayout.GRAVITY_FILL); 
} 

Answer 1

В вашей вытяжке папке создать XML

background.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 

    <item android:top="-10dp" android:right="-10dp" android:left="-10dp"> 
     <shape xmlns:android="http://schemas.android.com/apk/res/android" 
      android:shape="rectangle"> 
      <solid android:color="#1bd4f6" /> 
      <stroke 
       android:width="2dp" 
       android:color="#0288D1" /> 
     </shape> 
    </item> 

</layer-list> 

Устанавливается в TabLayout

<android.support.design.widget.TabLayout 
     android:background="@drawable/background" 
     android:id="@+id/tabs" 
     android:layout_width="match_parent" 
     android:layout_height="60dp" 
     app:tabIndicatorColor="@color/colorAccent" 
     app:tabTextColor="@color/white"/> 

Изменение значений и цветов, как вам нужно!

Выход:

Answer 2

Вы можете попробовать это. Решение

<FrameLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"> 

    <android.support.design.widget.TabLayout 
     android:id="@+id/tabs" 
     android:layout_width="match_parent" 
     android:layout_height="60dp" 
     app:tabBackground="@color/white" 
     app:tabIndicatorColor="@color/colorAccent" 
     app:tabIndicatorHeight="2.5dp" 
     app:tabTextColor="@color/white"/> 

    <View 
     android:layout_width="match_parent" 
     android:layout_height="2.5dp" 
     android:layout_gravity="bottom" 
     android:background="#c6c6c6" /> 

</FrameLayout>