Custom font for ActionBarSherlock tabs

Question

I want to set font for the \"Video\" and \"Image\" tabs in ActionBarSherlock. I have used the following code to do so. Its showing accurately in ICS but not in

Answer 1

It seems like you are not getting any guidance. I am not sure with my answer's result but yes you can defiantly get idea to make it as you want.

Let me try to help you. I think you have to somewhat play with the in-built default resources of the android sdk.

You have to create custom style:

<style name="MyActionBarTabText" parent="Widget.ActionBar.TabText">
    <item name="android:textAppearance">@style/TextAppearance.Holo.Medium</item>
    <item name="android:textColor">?android:attr/textColorPrimary</item>
    <item name="android:textSize">12sp</item>
    <item name="android:textStyle">bold</item>
    <item name="android:textAllCaps">true</item>
    <item name="android:ellipsize">marquee</item>
    <item name="android:maxLines">2</item>
</style>

 <style name="Widget.ActionBar.TabText" parent="Widget">
    <item name="android:textAppearance">@style/TextAppearance.Widget.TextView.PopupMenu</item>
    <item name="android:textColor">?android:attr/textColorPrimaryInverse</item>
    <item name="android:textSize">18sp</item>
    <item name="android:fontFamily">HERE YOU CAN GIVE YOUR FONT</item>
</style>

You can also refer this SO.

Now just apply that theme to your activity and you will get Font of the TabText as you want.

Comment me if have any query.

Enjoy coding... :)

In EXTRA

Another solution could be to modify the tab image to include the text, with GIMP or photoshop something, and then just set those images in the tabs, instead of images and text. It is a bit of an awkward way of doing it but it would work.

Hope this helps!

Answer 2

You can do it with this:

// Set a custom font on all of our ActionBar Tabs
private boolean setCustomFontToActionBarTab(Object root) {

    // Found the container, that holds the Tabs. This is the ScrollContainerView to be specific,
    // but checking against that class is not possible, since it's part of the hidden API.
    // We will check, if root is an instance of HorizontalScrollView instead,
    // since ScrollContainerView extends HorizontalScrollView.
    if (root instanceof HorizontalScrollView) {
        // The Tabs are all wraped in a LinearLayout
        root = ((ViewGroup) root).getChildAt(0);
        if (root instanceof LinearLayout) {
            // Found the Tabs. Now we can set a custom Font to all of them.
            for (int i = 0; i < ((ViewGroup) root).getChildCount(); i++) {
                LinearLayout child = ((LinearLayout)((ViewGroup) root).getChildAt(i));
                TextView actionBarTitle = (TextView) child.getChildAt(0);
                Typeface tf = Typeface.createFromAsset(mContext.getAssets(), "font/font.ttf");
                actionBarTitle.setTypeface(tf)
            }
            return true;
        }

    } 
    // Search ActionBar and the Tabs. Exclude the content of the app from this search.
    else if (root instanceof ViewGroup) {
        ViewGroup group = (ViewGroup) root;
        if (group.getId() != android.R.id.content) {
            // Found a container that isn't the container holding our screen layout.
            // The Tabs have to be in here.
            for (int i = 0; i < group.getChildCount(); i++) {
                if (setCustomFontToActionBarTab(group.getChildAt(i))) {
                    // Found and done searching the View tree
                    return true;
                }
            }
        }
    }
    // Found nothing
    return false;
}

Call it with this:

ViewParent root = findViewById(android.R.id.content).getParent();
setCustomFontToActionBarTab(root);

Answer 3

First create following custom TypefaceSpan class in your project.Bit changed version of Custom TypefaceSpan to enable to use both .otf and .ttf fonts.

import java.util.StringTokenizer;

import android.content.Context;
import android.graphics.Typeface;
import android.support.v4.util.LruCache;
import android.text.TextPaint;
import android.text.style.MetricAffectingSpan;

public class TypefaceSpan extends MetricAffectingSpan{

    /*Cache to save loaded fonts*/
    private static LruCache<String, Typeface> typeFaceCache= new LruCache<String, Typeface>(12);
    private Typeface mTypeface;
    public TypefaceSpan(Context context,String typeFaceName)
    {
        StringTokenizer tokens=new StringTokenizer(typeFaceName,".");
        String fontName=tokens.nextToken();
        mTypeface=typeFaceCache.get(fontName);

        if(mTypeface==null)
        {
            mTypeface=Constants.getFont(context, typeFaceName);
            //cache the loaded font
            typeFaceCache.put(fontName, mTypeface);
        }
    }
    @Override
    public void updateMeasureState(TextPaint p) {
        p.setTypeface(mTypeface);
    }

    @Override
    public void updateDrawState(TextPaint tp) {
        tp.setTypeface(mTypeface);
    }

}

Now apply code like this:(I used this on one of my Bangla apps successfully)

        SpannableString mstKnwTitle=new SpannableString(getString(R.string.e_mustknow_tab));
        SpannableString cntctsTitle=new SpannableString(getString(R.string.e_number_tab));


        TypefaceSpan span=new TypefaceSpan(this, "solaimanlipi.ttf");

        mstKnwTitle.setSpan(span, 0, mstKnwTitle.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);     
        cntctsTitle.setSpan(span, 0, mstKnwTitle.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);

        Tab tab= actionBar.newTab();
        tab.setText(mstKnwTitle);
        tab.setTabListener(tabListener);

        actionBar.addTab(tab);


        tab= actionBar.newTab();
        tab.setText(cntctsTitle);
        tab.setTabListener(tabListener);

        actionBar.addTab(tab);

Original inspiration of my answer was:Styling the Android Action Bar title using a custom typeface

Answer 4

Try this:

String s = "VIDEO";
SpannableString mSS = new SpannableString(s);
mSS.setSpan(new StyleSpan(Typeface.BOLD), 0, s.length(), 0);
mTabsAdapter.addTab(bar.newTab().setText(mSS),
                BFragment.class, null);

Answer 5

Okay . I found it myself some where on SO.

First make an xml file with this in it: tab_title.xml

<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/action_custom_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="My Custom title"
android:textColor="#fff"
android:textSize="18sp"
android:paddingTop="5dp" />

Then in the class where you in instantiate your ActionBar use this code to set the text on each of the tabs. (This example is using ActionBarSherlock.)

ActionBar bar = getSupportActionBar();
bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

String[] tabNames = {"Tab 1","Tab 2","Tab 3"};

for(int i = 0; i<bar.getTabCount(); i++){
    LayoutInflater inflater = LayoutInflater.from(this);
    View customView = inflater.inflate(R.layout.tab_title, null);

    TextView titleTV = (TextView) customView.findViewById(R.id.action_custom_title);
    titleTV.setText(tabNames[i]);
    //Here you can also add any other styling you want.

    bar.getTabAt(i).setCustomView(customView);
}

Answer 6

To solve this you could create a Special Actionbar class. Simply create a Class myBar extends Sherlockactionbar and put in the settypeface. If you now create that Bar in your view it will have the Typeface as you whish. For example here is an button with a new Typeface.

public class ChangedButton extends Button{

    public ChangedButton(Context context, AttributeSet attrs) {
        super(context, attrs);
        Typeface font = Typeface.createFromAsset(context.getAssets(), "fonts/viking2.TTF");
        this.setTypeface(font);
    }
}

regards