TabLayout自定义Indicator

最新推荐文章于 2025-06-04 13:33:27 发布

原创最新推荐文章于 2025-06-04 13:33:27 发布 · 1.5k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android #android studio

本文展示了如何在Android中创建一个带有渐变效果的TabLayout。通过设置tabIndicator为一个包含渐变颜色的layer-list资源文件，并将tabIndicatorColor设为透明，实现了自定义的指示器效果。示例代码详细说明了XML布局和shape drawable的使用方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

注意：本示例自定义一个渐变的Indicator，tabIndicatorColor要设置成透明
<com.google.android.material.tabs.TabLayout
    android:id="@+id/tabLayout"
    android:layout_width="match_parent"
    android:layout_height="55dp"
    app:tabIndicator="@drawable/me_tab_indicator"
    app:tabIndicatorColor="@color/transparent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

效果图：

me_tab_indicator.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:gravity="center">
        <shape>
            <corners android:radius="0dp" />
            <size android:height="5dp" />
            <gradient
                android:startColor="#FF8A64EB"
                android:endColor="#8064E8DE"
                android:angle="0" />
        </shape>
    </item>
</layer-list>