6

How can i use custom font for Tablayout class belonging to android.support.design.widget package? I'm using it to implement Quick Return view functionality.

4 Answers 4

27

As of 23.2.0, setTabsFromPagerAdapter has been deprecated, however using a modified version of Andreyua's answer you can use setupWithViewPager instead.

    @Override
public void setupWithViewPager(ViewPager viewPager)
{
    super.setupWithViewPager(viewPager);

    if (mTypeface != null)
    {
        this.removeAllTabs();

        ViewGroup slidingTabStrip = (ViewGroup) getChildAt(0);

        PagerAdapter adapter = viewPager.getAdapter();

        for (int i = 0, count = adapter.getCount(); i < count; i++)
        {
            Tab tab = this.newTab();
            this.addTab(tab.setText(adapter.getPageTitle(i)));
            AppCompatTextView view = (AppCompatTextView) ((ViewGroup) slidingTabStrip.getChildAt(i)).getChildAt(1);
            view.setTypeface(mTypeface, Typeface.NORMAL);
        }
    }
}

All credit goes to Andreyua for their original code snippet with a minor modification.

Unfortunately, I don't have enough reputation to make comments or I would have responded directly :)

0
18

Try this CustomTabLayout

public class CustomTabLayout extends TabLayout {
    public CustomTabLayout(Context context) {
        super(context);
    }

    public CustomTabLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public CustomTabLayout(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    public void setTabsFromPagerAdapter(@NonNull PagerAdapter adapter) {
            Typeface typeface = Typeface.createFromAsset(getContext().getAssets(), "fonts/Roboto-Medium.ttf");

        this.removeAllTabs();

        ViewGroup slidingTabStrip = (ViewGroup) getChildAt(0);

        for (int i = 0, count = adapter.getCount(); i < count; i++) {
            Tab tab = this.newTab();
            this.addTab(tab.setText(adapter.getPageTitle(i)));
            AppCompatTextView view = (AppCompatTextView) ((ViewGroup)slidingTabStrip.getChildAt(i)).getChildAt(1);
            view.setTypeface(typeface, Typeface.NORMAL);
        }
    }
}
0
9

With android support library 26.2.0 you specify the font in the style

<style name="TabLayout" parent="Widget.Design.TabLayout">
    <item name="tabTextAppearance">@style/TabText</item>
    <item name="tabSelectedTextColor">@color/white</item>
    <item name="tabIndicatorColor">@color/white</item>

</style>

<style name="TabText" parent="TextAppearance.Design.Tab">
    <item name="android:textSize">14sp</item>
    <item name="android:textColor">@color/lite</item>
    <!--Here below-->
    <item name="android:fontFamily">@font/gotham_medium</item>
</style>
2
  • 1
    This should be the top answer. Thanks. Aug 13, 2020 at 7:23
  • This is the best answer. Feb 4, 2021 at 10:44
0

Kotlin Version via Extension Function

To set a custom typeface to TabLayout try to add below code snippet as an extension function in a kotlin file (for example I've created a file named Extentions.tk):

fun TabLayout.applyFont(typeface: Typeface) {
    val viewGroup = getChildAt(0) as ViewGroup
    val tabsCount = viewGroup.childCount
    for (j in 0 until tabsCount) {
        val viewGroupChildAt = viewGroup.getChildAt(j) as ViewGroup
        val tabChildCount = viewGroupChildAt.childCount
        for (i in 0 until tabChildCount) {
            val tabViewChild = viewGroupChildAt.getChildAt(i)
            if (tabViewChild is TextView) {
                tabViewChild.typeface = typeface
            }
        }
    }
}

.

Usage

Now you can use it simply as following:

val typeface = Typeface.createFromAsset(context.assets, "fonts/Roboto.ttf")
tabLayout.applyFont(typeface)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.