0

I want to add a font to the tablayout. The tabs are filled dynamically using Json. Please suggest me how to add font to the tab headers.

This is the tablayout

private void setupPager() {
        viewPager.setAdapter(new CustomAdapter(getActivity().getSupportFragmentManager(),getContext()));
        tabLayout.setupWithViewPager(viewPager);
        Typeface tf = Typeface.createFromAsset(getActivity().getAssets(), "EdgeCaps.ttf");
        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(tf);
                }
            }
        }
}

This is the adapter. Here tabnames is a string array filled by json parsing.

 private class CustomAdapter extends FragmentPagerAdapter {
        public CustomAdapter(FragmentManager supportFragmentManager, Context applicationContext) {
            super(supportFragmentManager);
        }

        @Override
        public Fragment getItem(int position) {
            Fragment fragment = new ItemsMenuFragment();
            return  fragment;
        }
        @Override
        public int getCount() {
            return tabNames.size();
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return tabNames.get(position);
        }
    }

}

Can anyone help me to change the font of the tablayout.I have tried to use this in the setupPager but its not working.

 Typeface tf = Typeface.createFromAsset(getActivity().getAssets(), "EdgeCaps.ttf");
            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(tf);
                    }
                }
            }
Rohit Mishra
  • 281
  • 5
  • 16

2 Answers2

2

Not entirely sure what's going on in your code. But this class might help. All it does is set the all the TextViews inside a tab to EdgeCaps.tff whenever a new tab is added to the TabLayout.

Use it in place of a normal TabLayout and make sure that you've put your your EdgeCaps.tff font inside the "assets/fonts" directory of your project.
Here's an example of where the font file is meant to go (using Android Studio).

Code was modified from here to work with Android Support Library 23.3.0:

public class CustomFontTabLayout extends TabLayout {
    private Typeface mCustomTypeFace;

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

    public CustomFontTabLayout(Context context) {
        super(context);
        initialise();
    }

    public CustomFontTabLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
        initialise();
    }
    private void initialise()
    {
        // Note: Rename "EdgeCaps.tff" to whatever your font file is named.
        // Note that the font file needs to be in the assets/fonts/ folder.
        mCustomTypeFace = Typeface.createFromAsset(getContext().getAssets(), "fonts/EdgeCaps.tff"); 
    }

    @Override
    public void addTab(@NonNull Tab tab, boolean setSelected) {
        super.addTab(tab, setSelected);
        setTabTypeFace(tab);
    }

    @Override
    public void addTab(@NonNull Tab tab, int position, boolean setSelected) {
        super.addTab(tab, position, setSelected);
        setTabTypeFace(tab);
    }

    private void setTabTypeFace(Tab tab)
    {
        ViewGroup tabLayoutView = (ViewGroup)getChildAt(0);
        ViewGroup tabView = (ViewGroup) tabLayoutView.getChildAt(tab.getPosition());
        int tabViewChildCount = tabView.getChildCount();
        for (int i = 0; i < tabViewChildCount; i++) {
            View tabViewChild = tabView.getChildAt(i);
            // Find the TextView in the tab
            if (tabViewChild instanceof TextView) {
                TextView tabTextView = (TextView)tabViewChild;
                // Set the TextView's font
                tabTextView .setTypeface(mCustomTypeFace, Typeface.NORMAL);
            }
        }
    }
}
Community
  • 1
  • 1
Patrick
  • 1,045
  • 1
  • 9
  • 21
  • I am doing this.. But everytime i am getting an exception that Font asset not found fonts/EdgeCaps.tff – Rohit Mishra Apr 20 '16 at 10:51
  • @RohitMishra are you using do you have a font file named "EdgeCaps.tff" in the assets folder of your project? – Patrick Apr 20 '16 at 12:33
0
<style name="NavigationTab" parent="Widget.Design.TabLayout">
    <item name="tabBackground">@drawable/background_tab</item>
    <item name="tabSelectedTextColor">@color/primary_light</item>
    <item name="tabIndicatorColor">@color/blue</item>
    <item name="tabTextAppearance">@style/NavigationTabTextAppeareance</item>
</style>

<style name="NavigationTabTextAppeareance" parent="TextAppearance.Design.Tab">
    <item name="android:textColor">@color/primary_light</item>
    <item name="android:textSize">12sp</item>
</style>

Inside the TabLayout xml file. add this as style. change the fontsize according to what you want.

Arnold Laishram
  • 1,801
  • 2
  • 18
  • 25
  • I have tried this one.. But i want a custom font "EdgeCaps.ttf" to be applied to the tablayout.How to do that via code? – Rohit Mishra Mar 18 '16 at 19:51
  • This doesn't work. TextAppearance.Design.Tab is a button style and it looks like a pre-material design button cant have a custom font through styles. – Ryan Johnston May 31 '17 at 22:54