Настройте выбранную вкладку в TabLayout

Question

Вот что мне нужно

Вот чего я достиг ( Игнорировать размер и фонцвет )

Мои коды:

<android.support.design.widget.TabLayout
                    android:id="@+id/tabs"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="24dp"
                    app:tabMode="fixed"
                    app:tabBackground="@drawable/tab_selector"
                    app:tabIndicatorHeight="0dp"
                    app:tabTextAppearance="?android:textAppearanceMedium"
                    app:tabSelectedTextColor="#6e00b5"/>

tab_selector.xml

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

    <item android:drawable="@drawable/selected_dot"
        android:state_selected="true"/>

</selector>

selected_dot.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape
        android:innerRadius="0dp"
        android:shape="ring"
        android:thickness="4dp"
        android:useLevel="false">
        <solid android:color="#6e00b5"/>
    </shape>
</item>

Единственная проблема, с которой я сталкиваюсь - это поместить точку под текст.

Answer 1

Простое решение

Используйте app:tabIndicator вместо app:tabBackground

<TabLayout
    app:tabIndicator="@drawable/tab_dot"
    app:tabIndicatorHeight="8dp">

Обратите внимание, что использует как минимум двойную app:tabIndicatorHeight мыслительности табуляции (4dp) чтобы сделать это полностью видимым.

Answer 2

Я так не думаю, селектор вкладок будет работать в случае tablayout .Вам нужно реализовать по-своему

Вам нужно установить TabSlected слушателя , а затем добавить следующий код,

tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener(){
    @Override
    public void onTabSelected(TabLayout.Tab tab){
    int position = tab.getPosition();
    LinearLayout view = (LinearLayout) tabLayout.getChildAt(0);      
    TextView textView = (TextView) view.getChildAt(position);
//Below line will change selected tab textview title only.
    textView.setCompoundDrawablesWithIntrinsicBounds(null,null,null,objContext.getResources().getDrawable(R.drawable.selected_dot))
    }
});