Forum Xamarin.Forms

Xamarin Forms TabbedPage Tabs with Custom Font working in Android 4.x but no longer in 5.1?

VincentHVincentH USBeta ✭✭

Hi all,

The below custom TabbedRenderer works fine on Android 4.x to display a custom (icon) font in the tabs of a tabbed page, however not on Android 5.1. The same font renders fine in 5.1 when used in the custom LabelRenderer.

Anyone know how to get custom fonts in TabbedPage tabs working in Android 5.1? Thx!


[assembly: ExportRenderer(typeof(VectorIcon), typeof(VectorIconRenderer))]
[assembly: ExportRenderer(typeof(VectorButton), typeof(VectorButtonRenderer))]
[assembly: ExportRenderer(typeof(TabbedPage), typeof(TabbedVectorIconRenderer))]

namespace MyApp.Droid.Includes
public class VectorIconRenderer : LabelRenderer
protected override void OnElementChanged(ElementChangedEventArgs

public class VectorButtonRenderer : ButtonRenderer
    protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
        if (Element != null) Control.Typeface = TypefaceSpanEx.GetTypeFace(Element.FontFamily);

public class TabbedVectorIconRenderer : TabbedRenderer
    protected override void DispatchDraw(Canvas canvas)

    private void SetTabsTypeface()
        var activity = this.Context as Activity;
        if (activity == null) return;

        var actionBar = activity.ActionBar;
        if (actionBar == null) return;

        for (int i = 0; i < actionBar.TabCount; i++)
            var tab = actionBar.GetTabAt(i);
            if (tab == null) continue;
            string plainText = tab.Text;
            var lastFormattedPlainText = tab.Tag as String;
            if (lastFormattedPlainText != null && lastFormattedPlainText.ToString() == plainText) continue;

            var ss = new SpannableString(plainText);
                new TypefaceSpanEx(VectorIcon.Typeface),
                0, ss.Length(), SpanTypes.ExclusiveExclusive
            tab.SetTag(new String(plainText));


/// <summary>
/// A version of TypeFaceSpan that adds supports for custom fonts
/// Source:
/// </summary>
public class TypefaceSpanEx : MetricAffectingSpan
    /** An <code>LruCache</code> for previously loaded typefaces. */
    private static readonly LruCache sTypefaceCache = new LruCache(5);

    private readonly Typeface mTypeface;

     * Load the {@link Typeface} and apply to a spannable.

    public TypefaceSpanEx(string typefaceName)
        mTypeface = GetTypeFace(typefaceName);

    public static Typeface GetTypeFace(string typefaceName)
        Typeface mTypeface = (Typeface)sTypefaceCache.Get(typefaceName);

        if (mTypeface == null)
            mTypeface = Typeface.CreateFromAsset(Forms.Context.Assets, typefaceName + ".ttf");
            // Cache the loaded Typeface
            sTypefaceCache.Put(typefaceName, mTypeface);

        return mTypeface;

    public override void UpdateMeasureState(TextPaint p)

    public override void UpdateDrawState(TextPaint tp)



  • VincentHVincentH USBeta ✭✭
    edited June 2015

    I solved it: this was caused by the tab bar item text style missing in my values21 folder, which sets the all caps property to false. The custom font was set correctly but because the icon characters were by default changed to upper case, which were not present in the font, nothing was displayed.

  • AndrewMobileAndrewMobile USMember ✭✭✭✭

    wow, nice catch

Sign In or Register to comment.