読者です 読者をやめる 読者になる 読者になる

うさがにっき

読書感想文とプログラムのこと書いてきます

TabLayoutのタブテキストの色やフォントを変更する

Android

概要

TabLayoutでタブにあるテキストのフォント、色、大きさを変更する方法をまとめる
f:id:tiro105:20151202180709p:plain

詳細

色、大きさの変更方法

tabLayoutにstyleを指定する

    <android.support.design.widget.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        style="@style/ToolTabStyle"/>

styleの種類は以下参照
Google Play Style Tabs using TabLayout · codepath/android_guides Wiki · GitHub

例えばfocusのアンダーバーとテキストの色を変える場合、は以下のように指定

    <style name="ToolTabStyle" parent="Widget.Design.TabLayout">
        <item name="tabIndicatorColor">@color/tab_select_color</item>
        <item name="tabSelectedTextColor">@color/tab_select_color</item>
    </style>

文字サイズもここで変更できる

<style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
    <item name="tabTextAppearance">@style/MyCustomTabTextAppearance</item>
</style>
<style name="MyCustomTabTextAppearance" parent="TextAppearance.Design.Tab">
    <item name="android:textSize">14sp</item>
    <item name="android:textColor">?android:textColorSecondary</item>
    <item name="textAllCaps">true</item>
</style>

fontの変更

TabLayoutの子Viewを取得し、その子ViewにタブのTextViewが入っているので、そのTextViewに対してfontを設定する

private void changeTabsFont() {
        ViewGroup vg = (ViewGroup) tabLayout.getChildAt(0);
        int tabsCount = vg.getChildCount();
        for (int j = 0; j < tabsCount; j++) {
            ViewGroup vgTab = (ViewGroup) vg.getChildAt(j);
            int tabChildsCount = vgTab.getChildCount();
            for (int i = 0; i < tabChildsCount; i++) {
                View tabViewChild = vgTab.getChildAt(i);
                if (tabViewChild instanceof TextView) {
                    ((TextView) tabViewChild).setTypeface(Font.getInstance().getTypeFace(), Typeface.NORMAL);
                }
            }
        }
    }