WinterChilly WinterChilly - 1 year ago 209
Android Question

FontAwesome implementation in tabs at TabLayout

I want to implement fontawesome in tabs. This are the main things that matter.

MainActivity in OnCreate:

viewPager = (ViewPager) findViewById(;
setupViewPager(viewPager); //Kreiramo viewpager oz. klic funkcije
TabLayout tabLayout = (TabLayout) findViewById(;
if (tabLayout != null) {
tabLayout.setupWithViewPager(viewPager); //Poveže tab_layout z viewpagerjem

A method that is in MainActivity for viewpager:

private void setupViewPager(ViewPager viewPager) {
AdapterViewPager adapter = new AdapterViewPager(getSupportFragmentManager());
//Kreiraš fragment, ki bo v ViewPagerju
adapter.addFragment(new Fragment1(), "HOME");
adapter.addFragment(new Fragment2(), "HEART");
adapter.addFragment(new Fragment3(), "CRITERIA");

Custom AdapterViewPager:

public class AdapterViewPager extends FragmentStatePagerAdapter {
private final List<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();

public AdapterViewPager(FragmentManager manager) {

public Fragment getItem(int position) {
return mFragmentList.get(position);

public int getCount() {
return mFragmentList.size();

public void addFragment(Fragment fragment, String title) {

public CharSequence getPageTitle(int position) {
return mFragmentTitleList.get(position);

public int getItemPosition(Object object) {

How can accomplish this? Any ideas?

Answer Source

I used font Awesome in TabLayout but it's a bit nasty.

1- Put font Icon in your asset/font folder.

2- Use following code to apply your font:

private void changeTabsFont() {

        Typeface font = Typeface.createFromAsset(getAssets(),"fonts/font-awsome.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(font);

3- Now just copy your font-awesome code in your string resource and use them, in your TabLayout.

<string name="icon_home">&#xf015;</string>

4- (alternative of 3) Override getTitle of your adapter:

        public CharSequence getPageTitle(int position) {
            switch (position) {
                case POSITION_HOME:
                    return mContext.getResources().getString(R.string.icon_home);
             //  ... other title


Because Tablayout doesn't have setTypeface method you have to use such code. if you use PagerSlidingTabStrip it have such method and you can easily apply your font.

tabs.setTypeface(typeFace , 0);
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download