Android TabLayout如何制作两条下划线

Question

我正在尝试创建 TabLayout，它看起来像 this .

我想在 like this 下再写一个.

这是我自己的黄线，我想把它变成黑线，当我改变标签时，黄线会改变自己的位置。也许我需要做一些背景线，但我不知道该怎么做

XML:

<android.support.design.widget.TabLayout
    android:id="@+id/tabs"
    style="@style/AppTabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:visibility="gone"
    app:tabGravity="fill"
    app:tabMaxWidth="0dp"
    app:tabMode="fixed" />

<style name="AppTabLayout" parent="Widget.Design.TabLayout">
    <item name="tabIndicatorColor">@color/visit_tabs_indicator</item>
    <item name="tabIndicatorHeight">4dp</item>
    <item name="tabPaddingStart">6dp</item>
    <item name="tabPaddingEnd">6dp</item>
    <item name="tabBackground">@android:color/white</item>
    <item name="tabTextAppearance">@style/AppTabTextAppearance</item>
    <item name="tabSelectedTextColor">@color/visit_tabs_text</item>
</style>

Answer 1

创建具有底部黑线的背景可绘制对象。 即 tab_ract_border.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle" >
            <solid android:color="#ffffff" />
        </shape>
    </item>

    <item android:top="-2dp" android:right="-2dp" android:left="-2dp">
        <shape>
            <solid android:color="@android:color/transparent" />
            <stroke
                android:width="2dp"
                android:color="#000000" />
        </shape>
    </item>
</layer-list>

然后将这个 drawable 应用于 Tablayout 的背景 即 app:tabBackground="@drawable/tab_ract_border"

<android.support.design.widget.TabLayout
    android:id="@+id/content_main_tab_bar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#ffffff"
    app:tabIndicatorColor="#F3CD84"
    app:tabBackground="@drawable/tab_ract_border"
    app:tabMode="scrollable"
    app:tabSelectedTextColor="@color/colorAccent"
    app:tabTextAppearance="@android:style/TextAppearance.Widget.TabWidget"
    app:tabTextColor="#000000" />

njoe 它会为你工作:)