具有 3 种不同颜色的 3 种状态 TabLayout答案

【问题标题】：3 states TabLayout with 3 differents colors具有 3 种不同颜色的 3 种状态 TabLayout
【发布时间】：2021-09-09 15:28:33
【问题描述】：

我正在尝试基于我将以编程方式执行的 3 个状态的 3 个不同 TextColor 的 tabLayout，基本上状态将是 CURRENT、SEEN、UNSEEN，一切都是动态的。

问题是基本的viewpager和更准确的tablayout只允许SELECTED和UNSELECTED这两个状态。更不用说 setCustomView，将添加（创建）一个视图而不是设置（更新）值，我最终会堆叠视图......

我正在考虑重写 TabLayout 类或添加一些 kotlin 扩展，但不知道从哪里开始。

如果你们能指出一些方向，将不胜感激！

提前致谢。

【问题讨论】：

您可以尝试通过将文本设置为SpannableString 并应用ForegroundColorSpan 来手动更改选项卡项的文本颜色，请参阅stackoverflow.com/a/40968375/10172915
这样我可以让它工作！ Thx 但是现在的问题是 setText 删除了 tabLayout 动画，目前正在尝试寻找修复

标签： android kotlin android-viewpager android-tablayout

【解决方案1】：

感谢@Akaki 为我指明了正确的方向：

首先创建了一个改变tabTextColor的方法：

private fun changeTabTextColor(tabLayout: TabLayout?, index: Int, mainColor: Boolean) {
    if (index in 0 until maxPosition) {
        val tab = tabLayout?.getTabAt(index)
        val sb = SpannableString(tab?.text)
        val color =
            if (mainColor) ContextCompat.getColor(ctx, R.color.main_text_color)
            else ContextCompat.getColor(ctx, R.color.secondary_text_color)
        sb.setSpan(ForegroundColorSpan(color), 0, sb.length, 0)
        tab?.text = sb
    }
}

我在这里处理 2 种颜色，但如果需要可以添加更多。

第二个关键部分是设置文本会破坏动画，所以我们需要在ViewPager中自己处理：

binding.viewPager.addOnPageChangeListener(object : ViewPager.OnPageChangeListener {
        override fun onPageScrollStateChanged(state: Int) {}

        override fun onPageScrolled(position: Int, positionOffset: Float, positionOffsetPixels: Int) {
            tabLayout?.setScrollPosition(position, positionOffset, false)
        }
        override fun onPageSelected(position: Int) {}
    })

这样动画就会保留。

然后我使用onTabSelected 并调用方法changeTabTextColor 来满足我的需求。

【讨论】：