AndroidのTabLayout(Material Design)の文字をカスタムViewを使わずにカスタマイズする

※一部の古いOSバージョン・端末では正しく適用されない場合があるので、それらをサポートしている場合は注意してください。

com.google.android.material.tabs.TabLayoutの文字装飾（太字にする、色を変える、サイズを変えるなど）はSpannableを使うことで、カスタムViewにしなくてもある程度はカスタマイズできます。Spannableを使うので、テキストの一部だけ文字サイズを変えるなどの装飾をすることもできます。

すべてのタブの文字をカスタマイズする

すべてのタブで統一した文字装飾を実装する場合は、PagerAdapter.getPageTitleをOverrideしてSpannableStringを返すとカスタマイズできます。

    //タブの曜日のテキストだけ小さくする
    override fun getPageTitle(position: Int): CharSequence? {
        return dates[position].let {
            val date = it.atJST().toLocalDate()
            SpannableStringBuilder().append(
                DateTimeFormatter.ofPattern("d", Locale.ENGLISH).format(date)
            ).append(
                DateTimeFormatter.ofPattern(" E", Locale.ENGLISH).format(date),
                RelativeSizeSpan(0.7f),
                Spannable.SPAN_INCLUSIVE_EXCLUSIVE
            )
        }
    }

SpannableStringについては以下記事がわかりやすいです。

Spantastic text styling with Spans

選択中のタブの文字だけカスタマイズする

選択中のタブの文字だけ装飾するには、Tablayout.addOnTabSelectedListenerで、textをSpannableStringにすればカスタマイズできます。

　　//すでに適用されている装飾を残しつつ、選択中のタブだけ太字にする
    Tablayout.addOnTabSelectedListener(object : TabLayout.OnTabSelectedListener {
            private val normal = StyleSpan(Typeface.NORMAL)
            private val bold = StyleSpan(Typeface.BOLD)
            override fun onTabReselected(tab: TabLayout.Tab?) {
            }
            override fun onTabUnselected(tab: TabLayout.Tab?) {
                tab?.also {
                    it.text?.also { text ->
                        val span = if(text is SpannableString) text else SpannableString(text)
                        span.removeSpan(bold)
                        span.setSpan(
                            normal,
                            0,
                            text.length,
                            Spannable.SPAN_INCLUSIVE_INCLUSIVE
                        )
                        it.text = span
                    }
                }
            }
            override fun onTabSelected(tab: TabLayout.Tab?) {
                tab?.also {
                    it.text?.also { text ->
                        val span = if(text is SpannableString) text else SpannableString(text)
                        span.removeSpan(normal)
                        span.setSpan(
                            bold,
                            0,
                            text.length,
                            Spannable.SPAN_INCLUSIVE_INCLUSIVE
                        )
                        it.text = span
                    }
                }
            }
        })

参考リンク

Tab Layout - Material Components for Android

TabLayoutでいい感じにアイコンをつけたい時のメモ - 言いたいことはそれだけか

Custom views at TabLayout with highlighted text style at the selected tab