选项卡布局指示器自定义化

Question

我一直在搜索如何将Tablayout中的指示器更改为圆形，就像这样。

但我不知道如何实现，需要帮助！

- Sarah

Answer 1

从源代码中可以看到，标签指示器被定义为：

<style name="Base.Widget.Design.TabLayout" parent="android:Widget">
        <item name="tabMaxWidth">@dimen/design_tab_max_width</item>
        <item name="tabIndicatorColor">?attr/colorAccent</item>
        <item name="tabIndicatorHeight">2dp</item>
        <item name="tabPaddingStart">12dp</item>
        <item name="tabPaddingEnd">12dp</item>
        <item name="tabBackground">?attr/selectableItemBackground</item>
        <item name="tabTextAppearance">@style/TextAppearance.Design.Tab</item>
        <item name="tabSelectedTextColor">?android:textColorPrimary</item>
    </style>

而 tabIndicatorColor 属性被定义为：

<declare-styleable name="TabLayout">
        <attr name="tabIndicatorColor" format="color"/>
        <attr name="tabIndicatorHeight" format="dimension"/>

所以我认为你无法将其更改为可绘制对象（形状），只能更改其颜色。

另一种方法是为选项卡定义自定义视图，并自行处理指示器状态。

- Mina Wissa

Answer 2

1) 为您的选项卡状态创建布局（例如：tab_selected.xml 和 tab_unselected.xml）

2) 使用您的布局为选项卡设置自定义视图：

//get your tab item
TabLayout.Tab tabItem = tabLayout.getTabAt(i);
//inflate your layout to a view and set it as the tab's custom view
tabItem.setCustomView(customView);

3) 然后，使用setOnTabSelectedListener持续监听选中的选项卡并相应地更新其自定义视图（使用setCustomView）

- Mateus Gondim

---

这会提供任何动画效果吗？ - user1278890

@user1278890 如果你的意思是从选中状态到未选中状态的动画，我认为不行。 - Mateus Gondim

Answer 3

我认为您应该使用自定义视图来制作标签，并通过TabLayout.OnTabSelectedListener进行更改。

- Yrgl