TabLayout高亮和涟漪效果

Question

我有两个关于TabLayout的问题：

1）我能否删除TabLayout的高亮或更改选项卡布局的高亮颜色？

2）我能否为选项卡添加涟漪效果？每个选项卡都包含TextView，我尝试添加自定义背景，类似于这样：

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?android:colorControlHighlight">
    <item android:drawable="@drawable/btn_white_bg" />
</ripple>

但它无法工作。

- Tiberal

---

标记这个。如果有解决这个问题的方法，我想知道。 - SilentKnight

你找到正确的解决方案了吗？我尝试了下面提到的解决方案，但涟漪颜色没有改变.. - Mitesh Sharma

如果您想更改涟漪颜色，请使用上面的代码，但更改android:color属性颜色。并将其设置为selectableItemBackground属性，在/values-v21中选择应用程序主题。 - Tiberal

Answer 1

要去除高亮显示，请将以下行添加到您的XML中：

app:tabRippleColor="@android:color/transparent"

- Ranjan

Answer 2

对我有效的另一个解决方案

<android.support.design.widget.TabLayout
    android:id="@+id/tab_layout"
    android:minHeight="?attr/actionBarSize"
    android:layout_width="match_parent"
    app:tabMode="fixed"
    app:tabGravity="fill"
    android:clipToPadding="false"
    android:elevation="0dp"
    style="@style/MyCustomTabLayout"
    android:background="@color/colorPrimary"
    app:tabBackground="?attr/selectableItemBackground"
    app:tabIndicatorColor="@color/app_yellow"
    app:tabIndicatorHeight="4dip"
    android:layout_height="wrap_content"/>

我刚添加了下面这些行： android:background="@color/colorPrimary" app:tabBackground="?attr/selectableItemBackground"

- Munish Kapoor

---

简单而甜美的方法！ - zackygaurav

Answer 3

你可以像这样自定义TabLayout： 在values中创建一个xml文件，例如MyCustomTabLayout.xml，然后将以下代码放入其中。

<resources>

<style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
    <item name="tabMaxWidth">@dimen/tab_max_width</item>
     <item name="tabIndicatorColor">@color/black</item>
   <!--  <item name="tabIndicatorColor">?attr/colorAccent</item> -->
    <item name="tabIndicatorHeight">5dp</item>
    <item name="tabPaddingStart">12dp</item>
    <item name="tabPaddingEnd">12dp</item>
    <item name="tabBackground">?attr/selectableItemBackground</item>
    <item name="tabTextAppearance">@style/MyCustomTabTextAppearance</item>
    <item name="tabSelectedTextColor">?android:textColorPrimary</item>
</style>

<style name="MyCustomTabTextAppearance" parent="TextAppearance.Design.Tab">
    <item name="android:textSize">16sp</item>
    <item name="android:textColor">?android:textColorSecondary</item>
    <item name="textAllCaps">true</item>
</style>

在你的布局文件中添加以下内容：

<android.support.design.widget.TabLayout
        android:id="@+id/mainSlidingTab"
        style="@style/MyCustomTabLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/tool_bar"
        android:background="@color/ColorPrimary" />
    <!-- app:tabMode="scrollable" when many tabs -->

- Abhijit

---

因某些原因，“?attr/selectableItemBackground”现在不被接受了吗？我可以通过使用ripple xml作为tabBackground来解决这个问题。 - Dielson Sales

Answer 4

或者，你可以通过编程使水波纹透明：

val tabs = findViewById<TabLayout>(R.id.your_tablayout)

for (n in 0 until tabs.tabCount) {
    val tab = (tabs.getChildAt(0) as ViewGroup).getChildAt(n)
    tab?.let {
        val ripple = it.background as? RippleDrawable
        ripple?.setColor(ColorStateList.valueOf(Color.parseColor("#00000000")))
    }
}

这种方法也可以用于为每个选项卡设置自己的涟漪颜色。

- alexrnov