How can I change the Font Size and Weight for the Header in a Navigation Page?

Question

I can change the Font Color like this:

var homePage = new NavigationPage(new HomePage())
{ 
   Title = "Home",
   Icon = "ionicons_2_0_1_home_outline_25.png",
   BarTextColor = Color.Gray,
};

But is there a way to change the Font Size and Weight for the Title? I would like to change it for the iOS and Android platforms only. Hoping that someone knows of Custom Renderer code that can help me to do this.

Note that this question is similar to my question on how to change the Font which has been answered here:

How can I change the font for the header of a Navigation page with Xamarin Forms?

Answer 1

Here is an Custom Renderer for Android where you are able to change the Font Size and also the Font Weight. I've marked the values you have to change with an TODO.

using Android.Content;
using Android.Graphics;
using App5.Droid;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android.AppCompat;

[assembly: ExportRenderer(typeof(NavigationPage), typeof(CustomNavigationPageRenderer))]
namespace App5.Droid
{
    public class CustomNavigationPageRenderer : NavigationPageRenderer
    {
        private Android.Support.V7.Widget.Toolbar _toolbar;

        public CustomNavigationPageRenderer(Context context) : base(context)
        {
        }

        public override void OnViewAdded(Android.Views.View child)
        {
            base.OnViewAdded(child);

            if (child.GetType() == typeof(Android.Support.V7.Widget.Toolbar))
            {
                _toolbar = (Android.Support.V7.Widget.Toolbar)child;
                _toolbar.ChildViewAdded += Toolbar_ChildViewAdded;
            }
        }

        protected override void Dispose(bool disposing)
        {
            base.Dispose(disposing);

            if (disposing)
            {
                _toolbar.ChildViewAdded -= Toolbar_ChildViewAdded;
            }
        }

        private void Toolbar_ChildViewAdded(object sender, ChildViewAddedEventArgs e)
        {
            var view = e.Child.GetType();

            System.Diagnostics.Debug.WriteLine(view);

            if (e.Child.GetType() == typeof(Android.Support.V7.Widget.AppCompatTextView))
            {
                var textView = (Android.Support.V7.Widget.AppCompatTextView)e.Child;

                // TODO: CHANGE VALUES HERE
                textView.TextSize = 25;
                textView.SetTypeface(null, TypefaceStyle.Bold);

                _toolbar.ChildViewAdded -= Toolbar_ChildViewAdded;
            }
        }
    }
}

Here is an implementation of a Custom Renderer for iOS.

using App5.iOS;
using UIKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;

[assembly: ExportRenderer(typeof(NavigationPage), typeof(CustomNavigationPageRenderer))]
namespace App5.iOS
{
    public class CustomNavigationPageRenderer : NavigationRenderer
    {
        protected override void OnElementChanged(VisualElementChangedEventArgs e)
        {
            base.OnElementChanged(e);

            if (e.NewElement != null)
            {
                var att = new UITextAttributes();
                // TODO: Create your FontSize and FontWeight here
                var fontSize = Font.SystemFontOfSize(30.0);
                var boldFontSize = Font.SystemFontOfSize(35.0, FontAttributes.Bold);
                // TODO: Apply your selected FontSize and FontWeight combination here
                att.Font = boldFontSize.ToUIFont();
                UINavigationBar.Appearance.SetTitleTextAttributes(att);
            }
        }
    }
}