新的TabLayout材质组件如何设置Tab背景色

Question

我正在使用我想要实现此设计 的新材料组件

我为旧的 TabLayout 找到了这些答案

如何更改 TabLayout 所选选项卡的图标颜色？

在 TabLayout（Android 设计支持库）中更改 Tab 的背景颜色不会占用整个 Tab 空间

我认为新的 TabLayout 有一种更简单的方法来设置选项卡的背景并处理文本和图标颜色的变化

Answer 1

以下是设置选项卡背景颜色的步骤：

首先是代码，然后是一些简要说明：

编码：

<com.google.android.material.tabs.TabLayout
    android:id="@+id/tabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_constraintTop_toTopOf="parent"
    app:tabBackground="@drawable/tab_background_color_selector"
    app:tabIconTint="@color/tab_content_color_selector"
    app:tabIndicator="@null"
    app:tabSelectedTextColor="@color/md_white_1000"
    app:tabTextColor="@color/secondaryColor">

    <com.google.android.material.tabs.TabItem
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:icon="@drawable/ic_list"
        android:text="list" />

    <com.google.android.material.tabs.TabItem
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:icon="@drawable/ic_calender"
        android:text="calender" />
</com.google.android.material.tabs.TabLayout>

drawable/tab_background_color_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@color/secondaryColor" android:state_selected="true" />
    <item android:drawable="@color/md_white_1000" />
</selector>

颜色/tab_content_color_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/md_white_1000" android:state_selected="true" />
    <item android:color="@color/secondaryColor" />
</selector>

说明

tabBackground : 是标签背景，应该是一个可绘制的选择器。

tabIconTint：用于图标颜色，它必须是颜色选择器。

tabIndicator ="@null" ：因为在这种情况下它是无用的。

tabSelectedTextColor , tabTextColor是不言自明的。