How to change the font of PagerTabStrip

Question

I'm using a ViewPager with a PagerTabStrip and I need to set custom fonts (typeface) , but there is no .setTypeFace function for PagerTabStrip!

Here is my XML code:

 <android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/viewPager"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <android.support.v4.view.PagerTabStrip
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/pagerTabStrip"
        android:layout_gravity="top"
        android:background="#FF0000"
        android:textColor="#FFFFFF" />

</android.support.v4.view.ViewPager>

According to this link, I found a solution that may solve my problem.

Get the child views of the PagerTabStrip and check if it is an instance of a TextView. If it is, set the typeface:

for (int i = 0; i < pagerTabStrip.getChildCount(); ++i) {
View nextChild = pagerTabStrip.getChildAt(i);
if (nextChild instanceof TextView) {
   TextView textViewToConvert = (TextView) nextChild;
   textViewToConvert.setTypeface(PUT_TYPEFACE_HERE)
}
}

But I don't understand what it means.

My layout is:

I want to change the title tab to another font style,.like below:

Try **android:textAppearance** attribute as i explained in my answer...!! — Vishesh Chandra, Sep 21 '15 at 07:16

score 6 · Accepted Answer · answered Sep 21 '15 at 07:11

6

You need to do is create a style for the text, and then use the android:textAppearance attribute...

Something like this:

 <style name="PagerTabStripText">
     <item name="android:textStyle">italic</item>
 </style>

Your PagerTabStrip XML will be like this:

<android.support.v4.view.PagerTabStrip
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/pagerTabStrip"
    android:layout_gravity="top"
    android:background="#FF0000"
    android:textColor="#FFFFFF"
    android:textAppearance="@style/PagerTabStripText" />

answered Sep 21 '15 at 07:11

Vishesh Chandra

6,951
6
35
38

thank you Vishesh,but I need to use custom typeface for my pagerTabstrip,In my research, there is no way to add external font to the xml file.Only 3 default fonts are available in xml -- i want something maybe like this : @assets/font1.ttf – Emad Sep 21 '15 at 07:28
1

Then you can go with Java Reflection API and access the Non-public title textView and update the textStyle by making the child class of **android.support.v4.view.PagerTabStrip** – Vishesh Chandra Sep 21 '15 at 07:53
Could you explain a little more? :) – Emad Sep 21 '15 at 08:06
like this: [link](http://stackoverflow.com/questions/11932820/how-to-set-a-typeface-to-pagertabstrip-text-views) ? – Emad Sep 21 '15 at 08:18
1

**This is source code of PagerTabStrip** https://chromium.googlesource.com/android_tools/+/881586ca84f2fb8e82faa9c8d645416d175d0f01/sdk/extras/android/support/v4/src/java/android/support/v4/view/PagerTitleStrip.java And **Example for Reflection API is:** http://stackoverflow.com/questions/13307758/how-to-set-textstyle-of-pagertabstrip-to-bold/26263487#26263487 – Vishesh Chandra Sep 21 '15 at 10:03
Thank you for your prompt reply :) I think I should learn more about Reflection... tnx bro ;-) – Emad Sep 21 '15 at 15:07

score 4 · Answer 2 · answered Sep 21 '15 at 09:33

4

You can put font.ttf in assets/fonts/ folder and get font instance

   Typeface fontTypeFace= Typeface.createFromAsset(getContext().getAssets(),
                "fonts/font.ttf");

for (int i = 0; i < pagerTabStrip.getChildCount(); ++i) {
    View nextChild = pagerTabStrip.getChildAt(i);
    if (nextChild instanceof TextView) {
       TextView textViewToConvert = (TextView) nextChild;
       textViewToConvert.setTypeface(fontTypeFace)
    }
}

answered Sep 21 '15 at 09:33

Ashish Agrawal

1,977
2
18
32

**when I use this code :** `error: non-static method getChildCount() cannot be referenced from a static context` **whats the problam...?** – Emad Sep 21 '15 at 15:10
are you using this thing in static method ? – Ashish Agrawal Sep 22 '15 at 04:43
In my app,I have an activity `MainActivity` , that contains a viewpager with a PagerTabStrip... so I have: `MainActivity` - `PagerAdapter` and `frgmentA` , where should i use your code? ;) ofcource i used them in All three... but the Error occurred ! – Emad Sep 22 '15 at 05:16
are you getting pagerTabstrip instance using findViewById – Ashish Agrawal Sep 22 '15 at 06:24
[PagerTabStrip](http://pastie.org/private/7z6zjbotzdsiolcqkkicq) - [FragmentA](http://pastie.org/private/sfjdycn888uatpkbqqa) - [ActivityMain](http://pastie.org/private/uwxuryi1dy4czyjnmqlfqg) - [layout](http://pastie.org/private/b8mwfnmavczy1kfr6mv0aa) -- thank you for your time :) – Emad Sep 22 '15 at 07:24
in the above comment,there is a typo :D PagerTabStrip ==> **PagerAdapter** – Emad Sep 22 '15 at 07:34

score 1 · Answer 3 · answered Jul 13 '16 at 10:25

Put .ttf file in assets folder and use this code in onCreate method

fontTypeFace= Typeface.createFromAsset(getAssets(),
            "fontawesome-webfont.ttf");

 tabs = (PagerSlidingTabStrip) findViewById(R.id.tabs);
    tabs.setTypeface(fontTypeFace,0);

How to change the font of PagerTabStrip

3 Answers3